Flutter核心技术与实战 / 来自Google的高性能跨平台开发框架
陈航
美团点评高级技术专家
 
  • 课程目录
  • 课程介绍
  • 开篇词 | 为什么每一位大前端从业者都应该学习Flutter?

    我会对比其他框架的特性与你讲述Flutter的核心特性及背后原理,让你在既有终端技术栈的基础上做能力叠加,而非从零开始。

  • 01 | 预习篇 · 从0开始搭建Flutter工程环境

    今天这篇文章要达到的目的是,帮助你完成Flutter开发测试环境的安装配置。

  • 02 | 预习篇 · Dart语言概览

    今天,我带你了解了Dart出现的历史背景,从Flutter开发者的视角详细介绍了它的各种特性,并分析了它的未来。

  • 03 | 深入理解跨平台方案的历史发展逻辑

    根据实现方式的不同,业内常见的观点是将主流的跨平台方案划分为三个时代:Web容器时代、泛Web容器时代和自绘引擎时代。

  • 04 | Flutter区别于其他方案的关键技术是什么?

    除了讲述Flutter的实现原理外,我还向你介绍了构建Flutter底层的关键技术:Skia与Dart。

  • 05 | 从标准模板入手,体会Flutter代码是如何运行在原生系统上的

    我会带你体验一个有着基本功能的Flutter应用是如何运转的,从而加深对构建Flutter应用的关键概念和技术的理解。

  • 06 | 基础语法与类型变量:Dart是如何表示信息的?

    我将通过一个示例,带你学习Dart的基本语法和类型系统,来帮助你在已有编程语言经验的基础上快速上手。

  • 07 | 函数、类与运算符:Dart是如何处理信息的?

    今天这篇文章,我会从函数、类与运算符的角度,来和你讲述Dart面向对象设计的基本思路。

  • 08 | 综合案例:掌握Dart核心特性

    我用一个综合案例,帮你把前面学习的关于Dart的零散知识串起来,希望你可以动手试验一下这个案例,借此掌握Dart编程。

  • 09 | Widget,构建Flutter界面的基石

    今天,我会与你一起学习Widget在Flutter中的设计思路和基本原理,以帮助你深入理解Flutter的视图构建过程。

  • 10 | Widget中的State到底是什么?

    避免StatefulWidget的滥用,是最简单直接地提升应用渲染性能的手段。

  • 11 | 提到生命周期,我们是在说什么?

    只要你分别记住创建、更新与销毁这三条主线的调用规则,就一定能把这些方法的调用顺序串起来,并在实际开发中写出合理的组件。

  • 12 | 经典控件(一):文本、图片和按钮在Flutter中怎么用?

    Flutter的经典组件在自定义样式上,提供的强大而简洁的扩展能力,使得我们可以快速开发出功能复杂、样式丰富的页面。

  • 13 | 经典控件(二):UITableView/ListView在Flutter中是什么?

    ListView既支持单一视图下可滚动Widget的交互模型及UI控制模型,又支持需要嵌套多重可滚动Widget的场景。

  • 14 | 经典布局:如何定义子控件在父容器中排版位置?

    我选取了几类在Flutter中最具代表性,也最常用的布局Widget,与你介绍构建一个界面精美的App会用到的布局概念。

  • 15 | 组合与自绘,我该选用何种方式自定义Widget?

    Flutter提供了组装与自绘两种自定义Widget的方式,来满足我们对视图的自定义需求。

  • 16 | 从夜间模式说起,如何定制不同风格的App主题?

    今天,我主要分享的是,如何实现这三种情况的主题定制:全局统一的视觉风格、局部独立的视觉风格、分平台设置主题。

  • 17 | 依赖管理(一):图片、配置和字体在Flutter中怎么用?

    Flutter中,资源可以是任意类型的文件,可以被放到任意目录下,但需要通过pubspec.yaml文件显式地声明路径。

  • 18 | 依赖管理(二):第三方组件库在Flutter中要如何管理?

    在Flutter中,资源与工程代码依赖属于包管理范畴,采用包的配置文件pubspec.yaml进行统一管理。

  • 19 | 用户交互事件该如何响应?

    今天这篇文章,我会着重与你讲述Flutter是如何监听和响应用户的手势操作的。

  • 20 | 关于跨组件传递数据,你只需要记住这三招

    InheritedWidget、Notification和EventBus,是Flutter提供的另外三种数据传递方式。

  • 21 | 路由与导航,Flutter是这样实现页面切换的

    Flutter提供了基本路由和命名路由两种方式,来管理页面间的跳转。

  • 22 | 如何构造炫酷的动画效果?

    在今天的这篇文章中,我会向你介绍Flutter中动画的实现方法,看看如何让我们的页面动起来。

  • 23 | 单线程模型怎么保证UI运行流畅?

    今天,我会通过几个小例子,带你理解后续如何在工作中使用Future与Isolate,优化我们的项目。

  • 24 | HTTP网络编程与JSON解析

    今天,我会带你学习Flutter应用与服务端通信的三种方式,以及JSON解析的相关内容。

  • 25 | 本地存储与数据库的使用和优化

    根据需要持久化数据的大小和方式,Flutter提供了三种持久化方法,即文件、SharedPreferences与数据库。

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

    今天,我与你介绍了方法通道,这种在Flutter中实现调用原生Android、iOS代码的轻量级解决方案。

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

    平台视图提供了一种方法,允许开发者在Flutter里嵌入原生视图,并加入到渲染树中,实现一致的交互体验。

  • 28 | 如何在原生应用中混编Flutter工程?

    原生工程混编Flutter的方案是:将Flutter工程作为原生工程共用的子模块,由原生工程各自管理的三端工程分离模式。

  • 29 | 混合开发,该用何种方案管理导航栈?

    原生工程混编Flutter开发时,应用中会同时存在原生和Flutter页面,所以我们需要妥善处理跨渲染引擎的页面跳转。

  • 30 | 为什么需要做状态管理,怎么做?

    Provider通过数据资源封装、数据注入和数据读写这3个步骤,为我们实现了跨组件(跨页面)之间的数据共享。

  • 31 | 如何实现原生推送能力?

    总结来讲,消息的推送流程,包括插件工程、Dart接口实现、Android接口实现、iOS接口实现和应用工程配置。

  • 32 | 适配国际化,除了多语言我们还需要注意什么?

    在Flutter中进行国际化的整体思路,就是语言差异配置抽取+国际化代码生成。

  • 33 | 如何适配不同分辨率的手机屏幕?

    以多窗格布局的方式为平板电脑、手机的横屏和竖屏模式,提供不同的页面呈现形态,能够大大降低编写独立布局所带来的重复工作。

  • 34 | 如何理解Flutter的编译模式?

    Flutter支持Debug与Release的编译模式,并且这两种模式在构建时是完全独立的。

  • 35 | Hot Reload是怎么做到的?

    Flutter的热重载流程可以分为5步,包括:扫描工程改动、增量编译、推送更新、代码合并、Widget重建。

  • 36 | 如何通过工具链优化开发调试效率?

    在Flutter中,调试代码主要分为输出日志、断点调试和布局调试3类。

  • 37 | 如何检测并优化Flutter App的整体性能表现?

    Flutter的性能问题分为GPU线程问题和UI线程问题,都需要在真机上以分析模式启动应用,并通过性能图层来定位、分析。

  • 38 | 如何通过自动化测试提高交付质量?

    今天,我通过代码示例,与你分享了Flutter中单元测试与UI测试用例的编写方法。

  • 39 | 线上出现问题,该如何做好异常捕获与信息采集?

    我与你讲述了如何捕获Flutter应用的代码异常与Framework异常,并以Bugly为例讲述了如何上报异常信息。

  • 40 | 衡量Flutter App线上质量,我们需要关注这三个指标

    今天我们一起学习了衡量Flutter应用线上质量的3个指标,即页面异常率、页面帧率和页面加载时长,以及分别如何收集。

  • 41 | 组件化和平台化,该如何组织合理稳定的Flutter工程结构?

    今天这篇文章,我重点与你分享的是组件化与平台化这两种架构设计的思路,并没有讲解它们的具体实现。

  • 42 | 如何构建高效的Flutter App打包发布环境?

    在今天的分享中,我与你介绍了如何通过Travis CI,为我们的项目引入了持续交付能力。

  • 43 | 如何构建自己的Flutter混合开发框架(一)?

    对于Flutter混合开发而言,如何处理好原生与Flutter之间的关系,需要从工程架构与工作模式上定义清晰的分工边界。

  • 44 | 如何构建自己的Flutter混合开发框架(二)?

    今天,我会通过一个案例,与你详细说明在业务落地中,我们需要重点考虑哪些技术细节。

  • 结束语 | 勿畏难,勿轻略

    勿畏难,勿轻略,让我们在技术路上继续扩大自己的边界,保持学习,持续成长。结束语 | 勿畏难,勿轻略

特别放送

2019年最新Flutter学习全攻略

Flutter是Google推出的全新跨平台移动开发框架。因为出色的性能、高效的开发方式等原因,Flutter正被越来越多的开发者和组织采用,比如阿里巴巴、腾讯、京东、美团等。

加之Google的强大号召力,Flutter极有可能成为跨平台开发的终极解决方案,随之将是企业对Flutter开发人才的强烈需求。如果你能够尽早掌握Flutter开发,便能在未来的竞争中领先一步,让自己的职业生涯更上一层楼。

但据众多开发者反馈,Flutter从语言到开发框架都是全新的,技术栈的积累也要从头开始,有点儿学不动了。

其实,Flutter并没有开创新的概念,它背后的框架原理和底层设计思想,与原生Android/iOS开发并没有本质区别,甚至从React Native中吸收了不少优秀的设计理念。同时,它使用的Dart语言,也吸纳了其他编程语言(比如Java、JavaScript)的优秀思想。

陈航,美团点评高级技术专家,现任美团外卖商家业务大前端技术负责人,致力于提升终端团队的研发效率与交付质量。近十年来,他一直工作于大前端相关领域,且曾分别探索并大规模落地了以React Native和Flutter为代表的跨平台方案,还是美团点评最早落地Flutter线上大规模应用的发起者和推动者之一。

在这个专栏里,陈航将通过对比其他框架的特性,着重为你剖析Flutter的核心知识点和背后原理,以及一些常见问题的解决思路。让你在既有终端技术栈的基础上做能力叠加,而非从零开始学习Flutter,沉浸在API的参数和实现细节中。

我们的最终目标是,带你构建出一套符合企业级开发标准的Flutter混合开发框架,从而帮助你将Flutter集成至现有企业应用中,用一套代码实现在iOS、Android平台上体验优良的应用。

专栏分为5大模块,共43讲。

  • Flutter开发起步模块,从跨平台方案发展历史出发,与你介绍Flutter的诞生背景、基本原理,并带你体验一下Flutter代码是如何在原生系统上运行的。
  • Dart基础模块,从Dart与其他编程语言的设计思想对比出发,与你讲述Dart设计的关键思路以及独有特性,并通过一个综合案例去实践一下。
  • Flutter基础模块,将通过Flutter与原生系统对应概念的对比,与你讲述Flutter独有的概念和框架设计思路。学完这个模块,你就可以开发出一个简单的App了。
  • Flutter进阶模块,与你讲述Flutter开发中的一些疑难问题、高级特性及其背后原理,帮助你在遇到问题时可以化被动为主动。
  • Flutter综合应用模块,着重和你分析在企业级应用迭代的生命周期中,如何从效率和质量这两个维度出发,构建自己的Flutter开发体系。

限时福利