由于Flutter会同时构建Android和IOS两个平台的发布包，所以Flutter同时依赖Android SDK和iOS SDK，在安装Flutter时也需要安装响应平台的构建工具和
SDK。

1、获取Flutter SDK

去Flutter官网下载其最新可用的安装包，官网地址：https://flutter.io/sdk-archive/#macos

官网下载SDK.png

下载之后解压，存放到一个目录之下，我存放的目录是/Users/xietao/Documents

2、使用镜像和配置环境变量

由于在国内访问Flutter有时可能会受到限制，Flutter官方为中国开发者搭建了临时镜像，大家可以将如下环境变量加入到用户环境变量中：

使用命令：vi ~/.bash_profile

export PUB_HOSTED_URL=https://pub.flutter-io.cn export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn export PATH=/Users/xietao/Documents/flutter/bin:$PATH 

最后一个环境变量是flutter sdk的目录

然后保存:wq退出vi环境

运行 source $HOME/.bash_profile 刷新当前终端窗口。这时候新增加的环境变量就生效了

可以使用echo $PATH来验证flutter/bin是否已在PATH中。

3、运行flutter doctor来查看是否还需要安装其它依赖

运行后会发现缺少一些其他依赖，就按照提示一个个安装好就行

运行doctor检查.png

安装好之后如下显示就可以了，我这里没有管IntelliJ IDEA

安装依赖完成.png

4、更新flutter

查看Flutter各个分支，使用命令Flutter channel

图片.png

带*号的分支即你本地的Flutter SDK 跟踪的分支，要切换分支，可以使用flutter channel beta 或 flutter channel master，Flutter官方建议跟踪稳定分支，但你也可以跟踪master分支，这样可以查看最新的变化，但这样稳定性要低的多。

要升级flutter sdk，只需一句命令：flutter upgrade

该命令会同时更新Flutter SDK和你的flutter项目依赖包。如果你只想更新项目依赖包（不包括Flutter SDK），可以使用如下命令：

flutter packages get 获取项目所有的依赖包。 flutter packages upgrade 获取项目所有依赖包 

的最新版本。

5、IDE配置与使用

理论上可以使用任何文本编辑器与命令行工具来构建Flutter应用程序，比如上边没有配置的IntelliJ IDEA也可以。 不过，Flutter官方建议使用Android Studio和VS Code之一以获得更好的开发体验。Flutter官方提供了这两款编辑器插件，通过IDE和插件可获得代码补全、语法高亮、widget编辑辅助、运行和调试支持等功能，可以帮助我们极大的提高开发效率。下边介绍一下Android Studio的配置

安装两个插件：Dart和Flutter

• Flutter插件： 支持Flutter开发工作流 (运行、调试、热重载等)。
• Dart插件： 提供代码分析 (输入代码时进行验证、代码补全等)

安装步骤：

• 启动Android Studio。
• 打开插件首选项 (Preferences>Plugins)。
• 选择 Browse repositories…，选择 flutter 插件并点击 install。
• 重启Android Studio后插件生效。

接下来，让我们用Android Studio创建一个Flutter项目，然后运行它，并体验“热重载”。

6、创建Flutter项目

安装好插件之后，重启Android Studio在面板上就会多了一个创建Flutter的选项，点击创建一个Flutter项目

• 选择 File>New Flutter Project 。
• 选择 Flutter application 作为 project 类型, 然后点击 Next。
• 输入项目名称 (如 first_flutter_app)，然后点击 Next。
  点击 Finish。
• 等待Android Studio安装SDK并创建项目。

上述命令创建一个Flutter项目，项目名为first_flutter_app，其中包含一个使用Material 组件的简单演示应用程序。

在项目目录中，您应用程序的代码位于 lib/main.dart。

创建Flutter项目.png 创建应用.png

一步一步进行

创建应用2.png 代码部分.png

iPhone上运行效果

iPhone上效果.png

Android上运行效果

Android上效果.png
本页内容由塔灯网络科技有限公司通过网络收集编辑所得，所有资料仅供用户学习参考，本站不拥有所有权，如您认为本网页中由涉嫌抄袭的内容，请及时与我们联系，并提供相关证据，工作人员会在5工作日内联系您，一经查实，本站立刻删除侵权内容。本文链接:http://dengtar.com/18387.html