Flutter 对比 Android

2019-08-13  本文已影响0人  C_G__

1. Widget 和 View

Widget 不可变,仅支持一帧,每帧都会重构一个widget树,
View绘制完,就不会重绘,直到 invalidate() 被调用。

2. 更新Widget

StatelessWidget,StatefulWidget 无状态,有状态组件。
更新Widget需要改变widget的状态,当改变状态后,下一帧绘制时,就会用新的值。

setState(() {
  
});

3. 布局

Android用XML布局,
Flutter树用 Widget树布局。

4. 添加或删除组件

Android用 addChild()removeChild()
Widget 不可变,仅能通过boolean值作为开关创建删除。

body: Center(
    child: _getToggleChild(),
),

_getToggleChild() {
    if (toggle) {
      return new Text('Toggle One');
    } else {
      return new MaterialButton(onPressed: () {}, child: new Text('Toggle Two'));
    }
}

5. 动画处理

Android 用 View.animate()
Flutter

// 1 创建 controller 和 animation
AnimationController controller;
CurvedAnimation curve;
@override
void initState() {
    controller = AnimationController(duration: const Duration(milliseconds: 2000), vsync: this);
    curve = CurvedAnimation(parent: controller, curve: Curves.easeIn);
}
// 2 创建 Transition
child: FadeTransition(
    opacity: curve,
    child: new FlutterLogo(size: 100.0)
),
// 3 调用
controller.forward();

6. 如何绘制

Android 用 Canvas draw/paint,
Flutter 用 Canvas,CustomPaint 和 CustomPainter。

7. 自定义 Widgets

Android 继承View,
Widgets 组合其他Widgets。

8. Intents

Android 有 Intents,
Flutter 没有Intents,用 Navigator 的 push 和 pop route对象以实现页面切换。

void main() {
  runApp(new MaterialApp(
    home: new MyAppHome(), // becomes the route named '/'
    routes: <String, WidgetBuilder> {
      '/a': (BuildContext context) => new MyPage(title: 'page A'),
      '/b': (BuildContext context) => new MyPage(title: 'page B'),
      '/c': (BuildContext context) => new MyPage(title: 'page C'),
    },
  ));
}

Navigator.of(context).pushNamed('/b');

9. Flutter 处理外部应用程序传入的Intents

1)Android 中 处理。
2)Flutter 中 通过 MethodChannel 调用。

10. startActivityForResult

Android startActivityForResult

11. 异步UI

Android runOnUiThread
async await

Android runOnUiThread

Android AsyncTask和IntentService
Isolate

12. 进度指示器

Progress Indicator widget

项目结构和资源

13. Layouts

LinearLayout
Row 或 Co​​lumn

RelativeLayout
Column、Row和Stack的组合

ScrollView
ListView

手势检测和触摸事件处理

Widget支持事件监听,onPressed
Widget不支持事件监听,将Widget包装到GestureDetector 中 onTap

使用GestureDetector,可以监听多种手势,例如

Tap
    onTapDown
    onTapUp
    onTap
    onTapCancel

Double tap
    onDoubleTap 用户快速连续两次在同一位置轻敲屏幕.

长按
    onLongPress

垂直拖动
    onVerticalDragStart
    onVerticalDragUpdate
    onVerticalDragEnd

水平拖拽
    onHorizontalDragStart
    onHorizontalDragUpdate
    onHorizontalDragEnd

Flutter 插件

使用 GPS
https://pub.dartlang.org/packages/location
使用 相机
https://pub.dartlang.org/packages/image_picker
Facebook登陆
https://pub.dartlang.org/packages/flutter_facebook_connect

主题

Material主题风格的app
MaterialApp

数据库和本地存储

SharedPreferences prefs = await SharedPreferences.getInstance();

SQLite
SQFlite插件
https://pub.dartlang.org/packages/sqflite

通知

推送通知
Firebase_Messaging插件
https://github.com/flutter/plugins/tree/master/packages/firebase_messaging

上一篇下一篇

猜你喜欢

热点阅读