1. 使用镜像
由于在国内访问Flutter有时可能会受到限制,Flutter官方为中国开发者搭建了临时镜像
大家可以将如下环境变量加入到用户环境变量中:
打开终端:运行下面两行代码:
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
**注意:** 此镜像为临时镜像,并不能保证一直可用,读者可以参考详情请参考 [Using Flutter in China](https://github.com/flutter/flutter/wiki/Using-Flutter-in-China) 以获得有关镜像服务器的最新动态。
系统要求
要安装并运行Flutter,您的开发环境必须满足以下最低要求:
操作系统: macOS (64-bit)
磁盘空间: 700 MB (不包括Xcode或Android Studio的磁盘空间).
工具: Flutter 依赖下面这些命令行工具.
bash, mkdir, rm, git, curl, unzip, which
2. 获取Flutter SDK
去Flutter官网下载最新版本
下载成功后,把FlutterSDK 放到指定的目录中
运行 flutter doctor
## iOS 设置
### 安装 Xcode
要为iOS开发Flutter应用程序,您需要Xcode 7.2或更高版本:
1. 安装Xcode 7.2或更新版本(通过[链接下载](https://developer.apple.com/xcode/)或[苹果应用商店](https://itunes.apple.com/us/app/xcode/id497799835)).
2. 配置Xcode命令行工具以使用新安装的Xcode版本 `sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer` 对于大多数情况,当您想要使用最新版本的Xcode时,这是正确的路径。如果您需要使用不同的版本,请指定相应路径。
3. 确保Xcode许可协议是通过打开一次Xcode或通过命令`sudo xcodebuild -license`同意过了.
使用Xcode,您可以在iOS设备或模拟器上运行Flutter应用程序。
### 设置iOS模拟器
要准备在iOS模拟器上运行并测试您的Flutter应用,请按以下步骤操作:
1. 在Mac上,通过Spotlight或使用以下命令找到模拟器:
使用terminal(终端)
$:open -a Simulator
2. 通过检查模拟器 硬件>设备 菜单中的设置,确保您的模拟器正在使用64位设备(iPhone 5s或更高版本).
3. 根据您的开发机器的屏幕大小,模拟的高清屏iOS设备可能会使您的屏幕溢出。在模拟器的 Window> Scale 菜单下设置设备比例
4. 运行 flutter run启动您的应用.
安装到iOS设备
要将您的Flutter应用安装到iOS真机设备,您需要一些额外的工具和一个Apple帐户,您还需要在Xcode中进行设置。
- 安装 homebrew (如果已经安装了brew,跳过此步骤).
- 打开终端并运行这些命令来安装用于将Flutter应用安装到iOS设备的工具
brew update
brew install --HEAD libimobiledevice
brew install ideviceinstaller ios-deploy cocoapods
pod setup
Android Studio
## Android Studio 安装
*Android Studio:* 为Flutter提供完整的IDE体验
### 安装Android Studio
* [Android Studio](https://developer.android.com/studio/index.html), 3.0或更高版本.
或者,您也可以使用IntelliJ:
* [IntelliJ IDEA Community](https://www.jetbrains.com/idea/download/), version 2017.1或更高版本.
* [IntelliJ IDEA Ultimate](https://www.jetbrains.com/idea/download/), version 2017.1 或更高版本.
### 安装Flutter和Dart插件
需要安装两个插件:
* `Flutter`插件: 支持Flutter开发工作流 (运行、调试、热重载等).
* `Dart`插件: 提供代码分析 (输入代码时进行验证、代码补全等).
要安装这些:
1. 启动Android Studio.
2. 打开插件首选项 (**Preferences>Plugins** on macOS, **File>Settings>Plugins** on Windows & Linux).
3. 选择 **Browse repositories…**, 选择 Flutter 插件并点击 `install`.
4. 重启Android Studio后插件生效.
*Android Studio:* 为Flutter提供完整的IDE体验.
## 创建新应用
1. 选择 **File>New Flutter Project**
2. 选择 **Flutter application** 作为 project 类型, 然后点击 Next
3. 输入项目名称 (如 `myapp`), 然后点击 Next
4. 点击 **Finish**
5. 等待Android Studio安装SDK并创建项目.
上述命令创建一个Flutter项目,项目名为myapp,其中包含一个使用[Material 组件](https://material.io/guidelines/)的简单演示应用程序。
在项目目录中,您应用程序的代码位于 `lib/main.dart`.
## 运行应用程序
1. 定位到Android Studio 工具栏:
![Main IntelliJ toolbar](https://img.haomeiwen.com/i1712705/d637f9fd42febee3.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
2. 在 **target selector** 中, 选择一个运行该应用的Android设备. 如果没有列出可用,请选择 **Tools>Android>AVD Manager** 并在那里创建一个
3. 在工具栏中点击 **Run图标**, 或者调用菜单项 **Run > Run**.
4. 如果一切正常, 您应该在您的设备或模拟器上会看到启动的应用程序:
![Starter App on Android](https://img.haomeiwen.com/i1712705/a937d5c4fdea9695.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
## 体验热重载
Flutter 可以通过 *热重载(hot reload)* 实现快速的开发周期,热重载就是无需重启应用程序就能实时加载修改后的代码,并且不会丢失状态(译者语:如果是一个web开发者,那么可以认为这和webpack的热重载是一样的)。简单的对代码进行更改,然后告诉IDE或命令行工具你需要重新加载(点击reload按钮),你就会在你的设备或模拟器上看到更改。
1. 将字符串
`'You have pushed the button this many times:'` 更改为
`'You have clicked the button this many times:'`
2. 不要按“Stop”按钮; 让您的应用继续运行。
3. 要查看您的更改, 只需调用 **Save All** (`cmd-s` / `ctrl-s`), 或点击 **热重载按钮** (带有闪电⚡️图标的按钮).
你就会立即看到更新后的字符串。
网友评论