让Flutter运行起来

前言

介绍

• Flutter 是由 Google 的工程师团队打造的，用于创建高性能、跨平台的移动应用的框架
• Flutter 专注于 Android and iOS 低延迟的输入和高帧率
• Flutter的设计跟react-native很像，比RN更直接一点
• Flutter的开发语言是Dart

历史演变

从我接触移动app开发开始, 从Hybrid开发依赖于WebView, 众所周知webView最大的问题就是性能问题,交互体验想当的不好.RN抛开了WebView，利用JavaScriptCore来做桥接，将js调用转为native调用。解决了性能问题,可以说是迈进了一大步.但是仔细想想还是需要中间量去做这件事情.这就相当与 厂家供货 -> 卖家出货 的联系变成 厂家供货 -> 供销员 -> 卖家 多个中间环节,多少也是会影响性能.flutter更加彻底,不用桥接,不用webview.直接通过生成一个UI库,给原生使用,这也是用Dart语言的原因吧.

与RN比较

• 都是跨平台开发
• 通过状态机控制局部变化
• 支持热更新

安装环境

首先

git clone -b beta 

然后设置环境变量

vi ~/.bash_profile
export  //国内用户需要设置
export  //国内用户需要设置
export PATH= PATH_TO_FLUTTER_GIT_DIRECTORY/flutter/bin:$PATH

PATH_TO_FLUTTER_GIT_DIRECTORY为自己克隆flutter的文件目录
之后运行source $HOME/.bash_profile 刷新一下

运行ide

我用的是vscode 打开之后vscode,安装一下插件

如遇到安装不成功可以去看看官方文档, 然而也会有错误提示,处理一下即可
最后vscode的调试即可

创建一个应用

最后

可以看到图片是pink颜色的, 默认是blue颜色的. 试了一下热加载功能保存一下就可以了.