这篇博客我们介绍了 Flutter, 并且对比了 H5,React Native,Flutter.
由于 Flutter 是跨平台的开发框架, 开发一次可以同时运行在 Android 和 iOS 上面, 所以我们开发时最好使用 Mac 系统, 这样我们可以同时测试两个平台的运行效果.
本文我们就来介绍在 Mac 系统下安装与配置 Flutter 开发环境, 并且运行我们的第一个 Flutter 应用!
为了 Flutter 的安装配置顺利, 请科学上网.
安装 Flutter SDK
首先, 我们需要首先下载 Flutter 的 SDK, 通过官网的这个链接可以找到每个版本的下载链接, 找到最新稳定版下载. 写这篇文章时的最新版是 v1.2.1 版本, 我们就以这个版本来举例.
下载完成后我们对 SDK 进行解压, 可以解压到任何位置. 我们这里解压到用户主目录下的 development 目录. 下面我们打开终端执行以下命令:
- mkdir ~/development
- cd ~/development
- unzip ~/Downloads/flutter_macos_v1.2.1-stable.zip
将解压后的路径加入到环境变量中.
打开用户目录下的. bash_profile 文件, 如果没有则新建这个文件:
> ~/.bash_profile
在这个文件的最后添加 SDK 的路径到 PATH 中:
export PATH="用户路径 / development/flutter/bin:$PATH"
然后执行 source 让配置生效:
source ~/.bash_profile
检查 Flutter 安装状态
配置好后, Flutter 提供了一个检查安装状态的命令:
flutter doctor
运行以终端会输出当前的 Flutter 环境是否正确, 还需要安装什么等等, 比如 Android SDK,iOS 的开发环境等等.
配置 iOS 开发环境
如果在 Mac 系统上开发 Flutter 应用, 笔者推荐使用 iOS 模拟器进行开发调试, 因为 iOS 模拟器相比 Android 模拟器要更加快速与流畅.
安装 Xcode
从 Mac App Store 搜索并安装 Xcode.
安装完成后在终端里执行以下命令配置最新的命令行工具:
sudo xcode-select --switch /Applications/Xcode.App/Contents/Developer
打开一次 Xcode 并接受许可协议, 或者通过命令行运行下面命令:
sudo xcodebuild -license
配置 iOS 模拟器
通过命令行打开一个模拟器:
open -a Simulator
选择模拟器, 然后通过 Hardware -> Device 菜单查看确保当前模拟的是 iPhone5s 之后的机型.
配置 Android 开发环境
下面我们来介绍安装 Android 的开发环境.
安装 Android Studio
从官网下载 https://developer.android.com/studio 最新版的 Android Studio.
打开 Android Studio, 根据安装向导提示安装最新版的 Android SDK,Android SDK Platform-Tools,Android SDK Build-Tools.
配置 Android 模拟器
打开 Android Studio 后选择 Tools> Android> AVD Manager, 然后选择 Create Virtual Device(创建虚拟设备).
填入设备的信息然后下一步, 选择镜像的时候最好选择架构 x86 或者 x86_64, 因为和电脑的架构一致, 否则如果选择 ARM 架构的话模拟器运行后会非常卡顿.
(可选) 选择 Hardware - GLES 2.0 来进行硬件加速, 以使模拟器获得更好的运行速度.
一切都选好后点击 Finish 即完成配置.
配置代码编辑器 (IDE)
虽然 Flutter 开发可以使用很多 IDE, 比如 Android Studio,IntelliJ IDEA,VS Code 等等, 你可以根据喜好进行选择.
但是笔者建议使用 Android Studio, 因为它对 Flutter 开发支持的最好, 并且谷歌官方也是推荐使用它.
下面我们就来介绍 Android Studio 的配置.
打开 Android Studio.
安装 Flutter 插件. 选择菜单 Preferences> Plugins 然后点击 Browse repositories 搜索 Flutter, 找到后开始安装.
当跳出安装 Dart 插件的界面时, 也点击 Yes 进行安装.
安装完成后重启 Android Studio.
上面我们已经完成了 Flutter 开发环境的配置, 下面我们就开始创建我们的第一个应用吧!
Flutter 初识, 第一个应用!
我们打开 Android Studio, 然后选择开始创建 Flutter 工程:
然后选择 Flutter Application, 并点击下一步:
在这个几面填入你的工程名, SDK 位置与保存位置等信息:
点击下一步后, 需要输入你的包名, 也就是你的域名, 没有域名的话输入自己的名字一类的域名, 目的就是为了保证你的应用的唯一性.
信息输入完成后我们点击 "Finish" 按钮即可完成工程的创建.
当我们的工程编译完成后, 可以选择不同的平台运行, 如图所示:
默认的工程是一个简单的计数器, 选择不同的平台运行后可以看到运行后的界面:
恭喜! 第一个程序运行成功地运行起来了!
接下来我们就可以深入研究 Flutter 的强大特性了!
总结
本篇文章 http://examplecode.cn/2019/03/22/flutter-setup/ -Flutter 的安装配置并不复杂. 另外还需要安装配置 iOS 开发环境和 Android 开发环境. 当然如果只是学习的话安装 iOS 即可, 如果你的电脑是 Windows 或者 Linux 的话, 此时只能安装配置 Android 开发环境了, 因为 iOS 的开发环境只能在 Mac 上配置. 还有 Flutter 的热部署也会使开发效率提升很多, 大家可以试着改一些代码体验一下.
我的博客中关于 Flutter 的所有文章可以点击这里 http://examplecode.cn/categories/Flutter/ 找到, 欢迎关注!
如果有问题可以留言, 或者给我发邮件 lloyd@examplecode.cn, 期待我们共同学习与成长!
来源: https://www.cnblogs.com/lloyd-zh/p/10575966.html