Flutter环境搭建

android studio 教程 | 2018-12-31 11:06

我使用的是mac电脑,基于Android Studio开发工具,介绍如何搭建Flutter开发环境,其他IDE可根据官方文档自行配置。

1. 环境搭建

2. 配置IDE

安装 Flutter 和 Dart 插件

打开Android Studio,开始我们的Flutter学习之旅〜

1. 选择 Start a new Flutter project

3. 配置 Flutter 项目

(1) Project name: 项目名称必须是小与的,以下划线分隔,不然会提示如下信息:

(2) Flutter SDK path: 选择下载到本地的 sdk 路径;

(3) Project location: 项目保存路径;

(4) Description: 描述信息;

4. 设置包名

这里多说一句:如果你使用 Kotlin 开发 Android,使用 Swift 开发 iOS,记得勾选相应多选框。点击 Finish 等待项目创建完成。

5. 工程主界面

1. 顶部工具条, 从左到右,依次是:1. 设备,2.入口文件,3.运行按钮,4.调试按钮。

2. 左侧项目结构,从上到下,1. lib目录存放dart文件,默认生成的main.dart,即为入口文件。 3. 代码编辑区,顶部是导包,main()方法为工程的入口,与Java类似。

1. 启动模拟器

点击 <no devices> 右侧的箭头,点 Open iOS Simulator 启动模似器。

2. 运行项目

点击运行按钮,等待项目启动。终端会打印以下信息,表示启动成功:

Launching lib/main.dart on iPhone XR in debug mode... Starting Xcode build... Xcode build done.                                           10.4s Syncing files to device iPhone XR...

1. 打开 lib/main.dart

2. 将字符串 'You have ~~pushed~~ the button this many times' 改为 'You have clicked the button this many times'

3. 保存修改,或执行热加载,查看模似器。

注意: 热更新,只有在 app 启动的状态下才会生效。