Android Flutter实践--安装(Windows)
2018-03-13 本文已影响396人
_凌浩雨
Flutter 官网
Flutter 中文网
Flutter 社区中文资源
Flutter 第三方资源包查找
Flutter 文档
1. 下载源码
git clone -b beta https://github.com/flutter/flutter.git

或者下载压缩包v1.0.0
2. 配置环境变量
I. 命令配置
export PUB_HOSTED_URL=https://pub.flutter-io.cn //国内用户需要设置
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn //国内用户需要设置
// 配置环境变量
export PATH=`pwd`/flutter/bin:$PATH
II. 右键我的电脑->属性->高级系统设置->环境变量->用户变量
- 在“用户变量”下检查是否有名为“Path”的条目:
- 如果该条目存在, 追加
D:\Program\flutter\bin
(此处路径为自己本地存储地址+\flutter\bin
)的全路径,使用 ; 作为分隔符. - 如果条目不存在, 创建一个新用户变量 Path ,然后将 flutter\bin的全路径作为它的值.
- 如果该条目存在, 追加
-
在“用户变量”下检查是否有名为”PUB_HOSTED_URL”和”FLUTTER_STORAGE_BASE_URL”的条目,如果没有,也添加它们。
图2.png
图3.png
3. 运行flutter doctor
打开命令提示符,运行命令:
flutter doctor
用于下载Dart SDK和更新Flutter Tool.

4. 打开 Android Studio
安装插件:
- Flutter插件: 支持Flutter开发工作流 (运行、调试、热重载等).
- Dart插件: 提供代码分析 (输入代码时进行验证、代码补全等).
File->Settings->Plugins->Browse Repositories,
输入Flutter,点击Install(安装).由于Flutter插件依赖于Dart插件,因此在下载Flutter时会同时下载Dart插件

3). 重启.
5. 创建项目
1). New Flutter Project

2). 选择 Flutter application 作为 project 类型, 然后点击 Next

3). 配置工程名


4). 工程目录

- android: Android 工程
- ios: ios工程
- lib: dart文件所在文件夹
- test: 测试文件
5). 运行

6). 热重载
在lib/main.dart文件中修改文字:
将You have pushed the button this many times
修改You have clicked the button this many times
,并点击保存。(调用 Save All (cmd-s / ctrl-s), 或点击 热重载按钮 (带有闪电⚡️图标的按钮).)
Flutter 交流QQ群: 【717034802】
