首战 之 Flutter 1.0 久违了（Mac）

LZ-Says：风雨欲来花满楼。。。

前言

Android，前端，跨平台。。。学无止境，学无止境，学海无涯。

跨平台，比较优秀的有 React Native（Facebook）以及 Weex（阿里巴巴），当然，还有其他例如微软提供以及其他就不一一列举了。

对于移动端 Android 而言，日新月异变更的同时，随之而来的是更多的挑战，大前端、跨平台，到底如何才能在这科技的洪流中保持自身不败，LZ 暂时也是懵逼、瞎子过河中。

好啦，闲话不多说，一起开始 Flutter 首战吧～

Flutter 1.0 久违了

首先引用官方关于 Flutter 介绍：

Flutter 是 Google 用以帮助开发者在 iOS 和 Android 两个平台开发高质量原生 UI 的移动 SDK。Flutter 兼容现有的代码，免费并且开源，在全球开发者中广泛被使用。

讲真的，一句话，Flutter 是 Google 提供的跨平台方案。

而关于其优势，LZ 简单了解到有如下几点 截取自百度，点我查看：

1. 高效热重载（Hot Reload）;
2. 一切皆为 Widget 的理念，对于 Flutter 来说，手机应用里的所有东西都是 Widget，通过可组合的空间集合、丰富的动画库以及分层课扩展的架构实现了富有感染力的灵活界面设计。
3. 借助可移植的 GPU 加速的渲染引擎以及高性能本地代码运行时以达到跨平台设备的高质量用户体验。 简单来说就是：最终结果就是利用 Flutter 构建的应用在运行效率上会和原生应用差不多。

今天，我们不讲高深，不装 B，不开玩笑，那么我们如何玩转 Flutter 呢？

万物起为真，今天，我们一起来完成 Flutter 基本环境配置，以及瞧瞧 Flutter 的 Hello World 长啥样。

一、启程，配置 Flutter

Flutter 安装配置教程：https://flutter.io/docs/get-started/install

首先，各位老铁根据当前电脑环境自行选择安装步骤，如下所示：

当然，贴心的谷歌专门为中国开发者提供了一些配置建议，访问外国网站，应该都不是问题，这里无非就是设置一些国内的镜像源，我有鸡大我不愁。

Mac 的小伙伴如上所示，点击下载当前 Flutter SDK 最新版本，截止目前为止，Flutter SDK 最新版本为 1.0.0。

下载解压后，配置环境变量，这里如果有小伙伴和 LZ 一样对 Mac 环境不熟悉，可手动点击如下俩个地址自行学习配置即可：

• https://flutter.io/docs/get-started/install/macos#update-your-path；
• https://blog.csdn.net/u012400885/article/details/87016533；

这里 LZ 放置一张关于 LZ 解压以及环境变量配置图：

不放心的小伙伴，输入 flutter doctor 进行检测 Flutter 所需环境，如下所示：

啊哦，是不是很蒙圈呢？

不要怕，贴心的 Flutter 已经告诉我们如何解决这些问题，关键字请看上图中的各种 “ run ”，之后复制后续提供命令进行安装即可。

漫漫修复路，俩眼泪儿流～！

千万记得访问外国网站～！

千万记得访问外国网站～！

千万记得访问外国网站～！

首先，在 iTerm 2 中键入如下命令，进行修复第一个 issues：

flutter doctor --android-licenses

这个过程，貌似需要各种 y（同意同意同意）大约 4 次？? 天，具体忘记了，截取部分截图如下：

接下来这个对于 LZ 就比较崩溃了，还好，昨天，嗖嗖嗖嗖嗖嗖的完成了。

brew update
 brew install --HEAD usbmuxd
 brew link usbmuxd
 brew install --HEAD libimobiledevice
 brew install ideviceinstaller 
 brew install ios-deploy
 brew install cocoapods
 pod setup

拷贝，复制，回车，嗖嗖嗖～

放个小兔兔?～

enmmm，前几条嗖嗖嗖，框框框，唯独最后一条，enmmm，卡壳了。???

皇天不负苦心人呐～！下图为证～！

上图中，LZ 在等待的过程中为 AS 以及 VS Code 配置好 Flutter 插件，而关于 IDEA 直接卸了兔子，磨磨唧唧，Fuck！

截至目前为止，只需要安装 Flutter 即可包含 Dart 相关插件，感谢背后猿猿～！

在执行以上完成之后，再次执行 flutter doctor 命令，如下：

终于好了，没有 issues，可以愉快的拥抱 Flutter ～ ???

二、来，Flutter，让我好好瞅瞅你

Step 1： 打开 Android Studio，创建 Flutter 项目

小手轻轻一点，进入选择创建项目类型，如下所示：

紧接着，填写如下有关项目内容：

• 设置项目名称；
• Flutter SDK 地址默认自动填充；
• 设置项目存放地址；
• 添加当前项目描述

这里需要注意，设置 Flutter 项目名称只能为小写英文字母下划线，不信看下图：

接下来，设置当前包名以及导入 Android 以及 iOS 代码：

点击 Finish，稍等片刻～

binggo～ 就问酷不酷～～～

点击右上角，选择要开启的设备：

随后分别运行在俩端，如下效果：

哦可，剩下嘛，看啥时候有时间咯。

噗哈哈哈，希望自己表懒了，2019，放下，努力，奋进，加油～！