移动互联网
随着移动互联网的兴起,移动端跨平台编程框架层出不穷,如:react native、weex、ionic、cordova等。但是这些框架都个有缺点,一个很大的弊端就是性能不如原生应用的性能好。这时google的跨平台UI框架Flutter出场了,Flutter可以快速在iOS和Android上构建高质量的原生用户界面。我们来看一下flutter框架的架构图:
Flutter架构
Flutter是一个UI框架,Framework层使用Dart语言作为编程语言,提了底层UI库、动画、手势、绘制、渲染、组件库等。
Engine层是使用C/C++实现的SDK,主要包括Skia、Dart和Text,Skia是一个开源的二维图形库,提供了适用于多种软硬件平台的通用API。
Embedder层是一个嵌入层,即把Flutter嵌入到各个平台中去。
我们一般编写程序主要在Framework层,使用Dart语言编写。下一篇文章中会介绍Dart开发环境的搭建和Dart语言编译成机器码运行。
Dart Native
我们接着介绍Flutter开发环境的搭建。
以mac os为例,首先要安装好下面的工具:
bash、curl、git、mkdir、rm、unzip、which、zip
在安装flutter中会用到这些命令。
由于在国内google的flutter依赖库可能用不了,所以google提供了官方镜像地址。
执行命令如下:
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
接着我们执行以下命令安装获取flutter
git clone https://github.com/flutter/flutter.git -b stable
之后执行如下命令把flutter添加到环境变量:
export PATH="$PATH:`pwd`/flutter/bin"
接着执行如下命令安装ios和android开发中用到一些二进制工具
flutter precache
在执行如下命令
flutter doctor
flutter doctor
判断你的环境是否可以正确运行flutter,ios和android开发工具中要至少安装好一个才可以正常运行flutter。
Dart
我们可以看到主文件是.dart,整个Framework层都是用Dart语言来实现的。
接着我们来看下运行之后的效果。
这样我们的第一个Flutter程序就完成了。