Flutter简单介绍
Flutter是Google打造的UI工具包,帮助开发者通过一套代码同时在iOS和Android上构建媲美原生体验的精美应用。
开发者可以使用Flutter开始一个全新的应用,也可以把Flutter理解为应用内置的一个引擎,把这个引擎引入到现有的工程中。
Flutter框架图如下:
如上图所示,Flutter 框架被组织为多层结构,每个层都建立在前一层之上。上面统称 Framework,下面的一切都叫做 Engine。Framework完全使用 Dart 编程语言编写。Engine的绝大部分使用 C++ 编写,专属 Android 的部分用 Java 编写,专属 iOS 的部分则用 Objective-C 编写。Flutter的平台相关层很低,平台只是提供一个画布,剩余的所有渲染相关的逻辑都在Flutter内部,这就使得它具有了很好的跨端一致性。
Dart主要由Google负责开发和维护的一种强类型、跨平台的开发语言。具有高生产力、快速高效、可移植、易学的OO编程风格和原生支持响应式编程等优秀特性。
网易新闻项目本身很庞大,业务繁多,全部改为Flutter实现肯定是不现实的,在使用Flutter的前期阶段,我们挑选了相对独立的几个模块,在现有工程的基础上对其进行Flutter改造,以循序渐进的改造方式保证项目稳健,下面以Android为例,从以下几个方面介绍下此混合开发实践过程:
集成方式
开发模式
工程管理
原生端与Dart端通信
混合栈及路由
调试
遇到的问题及解决方案
稳定性保证
如上介绍说明,开发者可以使用Flutter开始一个全新的应用,也可以把Flutter作为应用的一个module,把这个module引入到现有的工程中,因此有如下图的两种接入方式:
网易新闻采用上图右所示的方式,以现有工程为主端的Flutter Module的方式集成到现有工程中去,具体集成方法可参考https://github.com/flutter/flutter/wiki/Add-Flutter-to-existing-apps,开发者在lib文件下使用Dart语言编写相应的业务代码。
在网易新闻开发中的debug和release两种模式下,Flutter的构建和编译模式如下:
debug模式下:Flutter的编译是支持JIT的, 对于Dart开发者在主工
Google发布了一个实验性项目Hummingbird,要让Google的UI工具包Flutter也能在网页上执行。虽然受限于网页浏览器沙盒化网页应用程序,限制了部分功能,但是Flutter网页引擎仍提供了Flutter引擎包括小工具与布局等多数的功能。Google预计在Hummingbird代码稳定后,便会在GitHub上开源。
Flutter的版图已经从原本的移动设备操作系统扩散,朝全平台发展,Google正在进行的Flutter Desktop Embedding项目,虽然还在早期阶段,但目标是要将Flutter带上三大桌面操作系统,另外,Google也在树莓派上测试Flutter,以展示对于不完整桌面的嵌入支持方法。而Google同时也发布了实验性项目Hummingbird,尝试在网页上执行Flutter。
Flutter是一个多层系统,对开发者来说,越高层越容易使用,并能以很少的代码,完成很多工作,而低层的系统虽然比较复杂,但是却赋给开发者更多的控制能力。开发者可以访问Flutter引擎以上每一层的系统,当高层所提供的控制力不足时,便可以使用较低层的系统。Flutter引擎以最低端的函数库dart:ui向外开放功能,该函数库能够完全的控制小工具(Widgets)、物理、动画和布局,把这些元素组合到屏幕中成为像素。
要让Flutter在网页上执行,Google提到,有三件事情要做,第一需要编译Dart代码,因为Flutter是用Dart编写的,要让Flutter在网页上执行,就需要在网页上执行Dart。再来,便是选择要在网页上执行的Flutter子集,Flutter中有许多代码是专用于特定平台,对于网页平台无用。第三件事,选择足够的网页功能子集,Google提到,随着发展网页平台会累加功能产生新功能,像是开发者能使用HTML+CSS、SVG、Canvas和WebGL搭建图形。Google表示,决定支持特定Flutter系统层,便决定了要用的网页技术。
最初Google制作了三个层次的原型,包括只支持小工具、小工具加上自定义布局以及Flutter网页引擎。最后Google留下了第三种原型Flutter网页引擎,该原型保留了dart:ui之上的所有层,并提供了在浏览器中运行的dart:ui实例。Google认为,Flutter最有价值的功能之一,便是可以跨平台移植,允许