Flutter核心技术与实战
陈航
美团点评高级技术专家
立即订阅
6150 人已学习
课程目录
已完结 47 讲
0/4登录后,你可以任选4讲全文学习。
课前必读 (3讲)
开篇词 | 为什么每一位大前端从业者都应该学习Flutter?
免费
01 | 预习篇 · 从0开始搭建Flutter工程环境
02 | 预习篇 · Dart语言概览
Flutter开发起步 (3讲)
03 | 深入理解跨平台方案的历史发展逻辑
04 | Flutter区别于其他方案的关键技术是什么?
05 | 从标准模板入手,体会Flutter代码是如何运行在原生系统上的
Dart语言基础 (3讲)
06 | 基础语法与类型变量:Dart是如何表示信息的?
07 | 函数、类与运算符:Dart是如何处理信息的?
08 | 综合案例:掌握Dart核心特性
Flutter基础 (13讲)
09 | Widget,构建Flutter界面的基石
10 | Widget中的State到底是什么?
11 | 提到生命周期,我们是在说什么?
12 | 经典控件(一):文本、图片和按钮在Flutter中怎么用?
13 | 经典控件(二):UITableView/ListView在Flutter中是什么?
14 | 经典布局:如何定义子控件在父容器中排版的位置?
15 | 组合与自绘,我该选用何种方式自定义Widget?
16 | 从夜间模式说起,如何定制不同风格的App主题?
17 | 依赖管理(一):图片、配置和字体在Flutter中怎么用?
18 | 依赖管理(二):第三方组件库在Flutter中要如何管理?
19 | 用户交互事件该如何响应?
20 | 关于跨组件传递数据,你只需要记住这三招
21 | 路由与导航,Flutter是这样实现页面切换的
Flutter进阶 (17讲)
22 | 如何构造炫酷的动画效果?
23 | 单线程模型怎么保证UI运行流畅?
24 | HTTP网络编程与JSON解析
25 | 本地存储与数据库的使用和优化
26 | 如何在Dart层兼容Android/iOS平台特定实现?(一)
27 | 如何在Dart层兼容Android/iOS平台特定实现?(二)
28 | 如何在原生应用中混编Flutter工程?
29 | 混合开发,该用何种方案管理导航栈?
30 | 为什么需要做状态管理,怎么做?
31 | 如何实现原生推送能力?
32 | 适配国际化,除了多语言我们还需要注意什么?
33 | 如何适配不同分辨率的手机屏幕?
34 | 如何理解Flutter的编译模式?
35 | Hot Reload是怎么做到的?
36 | 如何通过工具链优化开发调试效率?
37 | 如何检测并优化Flutter App的整体性能表现?
38 | 如何通过自动化测试提高交付质量?
Flutter综合应用 (6讲)
39 | 线上出现问题,该如何做好异常捕获与信息采集?
40 | 衡量Flutter App线上质量,我们需要关注这三个指标
41 | 组件化和平台化,该如何组织合理稳定的Flutter工程结构?
42 | 如何构建高效的Flutter App打包发布环境?
43 | 如何构建自己的Flutter混合开发框架(一)?
44 | 如何构建自己的Flutter混合开发框架(二)?
结束语 (1讲)
结束语 | 勿畏难,勿轻略
特别放送 (1讲)
特别放送 | 温故而知新,与你说说专栏的那些思考题
Flutter核心技术与实战
登录|注册

27 | 如何在Dart层兼容Android/iOS平台特定实现?(二)

陈航 2019-08-29
你好,我是陈航。
在上一篇文章中,我与你介绍了方法通道,这种在 Flutter 中实现调用原生 Android、iOS 代码的轻量级解决方案。使用方法通道,我们可以把原生代码所拥有的能力,以接口形式提供给 Dart。
这样,当发起方法调用时,Flutter 应用会以类似网络异步调用的方式,将请求数据通过一个唯一标识符指定的方法通道传输至原生代码宿主;而原生代码处理完毕后,会将响应结果通过方法通道回传至 Flutter,从而实现 Dart 代码与原生 Android、iOS 代码的交互。这,与调用一个本地的 Dart 异步 API 并无太多区别。
通过方法通道,我们可以把原生操作系统提供的底层能力,以及现有原生开发中一些相对成熟的解决方案,以接口封装的形式在 Dart 层快速搞定,从而解决原生代码在 Flutter 上的复用问题。然后,我们可以利用 Flutter 本身提供的丰富控件,做好 UI 渲染。
底层能力 + 应用层渲染,看似我们已经搞定了搭建一个复杂 App 的所有内容。但,真的是这样吗?

构建一个复杂 App 都需要什么?

别急,在下结论之前,我们先按照四象限分析法,把能力和渲染分解成四个维度,分析构建一个复杂 App 都需要什么。
图 1 四象限分析法
取消
完成
0/1000字
划线
笔记
复制
© 版权归极客邦科技所有,未经许可不得传播售卖。 页面已增加防盗追踪,如有侵权极客邦将依法追究其法律责任。
该试读文章来自付费专栏《Flutter核心技术与实战》,如需阅读全部文章,
请订阅文章所属专栏。
立即订阅
登录 后留言

精选留言(6)

  • 舒大飞
    反过来,可以在原生页面中嵌入一小块Flutter视图吗

    作者回复: 可以,Activity内嵌flutterView其实就是这种方式,只是这个视图大小是整个屏幕

    2019-10-10
    1
  • 思考题实现思路

    dart层设置颜色参数的方法:
    changeBackgroundColor(int r, int g, int b) async
      {
        _channel.invokeMethod('changeBackgroundColor', {"r":r, "g":g, "b":b});
      }

    dart层调用:
    controller.changeBackgroundColor(0, 255, 255)

    android native层实现:
    if (methodCall.method.equals("changeBackgroundColor")) {
          int r = methodCall.argument("r");
          int g = methodCall.argument("g");
          int b = methodCall.argument("b");
          view.setBackgroundColor(Color.rgb(r, g, b));
          result.success(0);
        }else {
          result.notImplemented();
        }

    作者回复: 赞👍

    2019-09-02
    1
  • kennen
    iOS中的frame参数并没有用到,flutter是怎么把宽高传给iOS来展示的呢?

    作者回复: 你回忆一下iOS中autolayout和autorelease中父容器的布局变化对于组件布局的影响

    2019-11-26
  • Miracle_
    请问下,嵌入了原生视图后,如果嵌入的是较为复杂的视图,视图带走点击等交互事件,应该在哪边设置监听或者处理呢?

    作者回复: 看具体场景。我的建议是,如果点击交互的事件处理是能够在原生视图内搞定的,原生视图自己监听就好。否则就需要传出来让flutter处理

    2019-10-23
  • 和小胖
    思考题如下:

    //声明修改原生控件背景的方法
      changeBgColor() async {
        try {
          _methodChannel.invokeMethod("changeBgColor", {
            "color1": Random().nextInt(255),
            "color2": Random().nextInt(255),
            "color3": Random().nextInt(255)
          });
        } catch (e) {
          print(e);
        }
      }

    override fun onMethodCall(p0: MethodCall, p1: MethodChannel.Result) {
                when (p0.method) {
                    "changeBgColor" -> {
                        view.setBackgroundColor(Color.rgb(p0.argument<Int>("color1")!!, p0.argument<Int>("color2")!!, p0.argument<Int>("color3")!!))
                        p1.success(0)
                    }
                    //如果是别的方法则返回未实现
                    else -> p1.notImplemented()
                }
            }

    作者回复: 厉害👍

    2019-10-14
  • 许童童
    妙啊,通过平台视图,Flutter就可以使用原生视图了,这样,基本所有需求都可以实现了。如果社区再繁荣一点,许多组件都可以拿来即用,那开发需求的速度就是相当快了。
    2019-08-29
收起评论
6
返回
顶部