运行Flutter示例项目

前言

前文介绍了Flutter开发环境的搭建，本文就来新建个示例demo运行玩玩。

一: 创建Flutter示例项目

1.1 Android Studio创建Flutter项目

• 打开Android Studio选择New Flutter Project。

• 选择Flutter之后，输入项目信息，选择finish完成创建。

1.2 终端创建Flutter项目

• 打开终端，进入想要创建Flutter项目的目录。

• 使用终端创建Flutter项目也可以指定语言、平台、模板等，使用如下指令可以查看终端创建项目的一些选项指令。

iOS默认使用Swift语言，android默认使用kotlin语言，创建项目时，我们可以通过-i和-a来指定相应的语言。其他一些指令，有兴趣的可以自己研究。

• 使用如下指令创建iOS语言为OC的Flutter项目。

二: 运行Flutter项目

2.1 终端运行项目

2.1.1 终端运行项目到iOS模拟器

• 进入Flutter项目目录，打开iOS模拟器，通过如下指令运行项目。

// 进入项目目录
cd flutter_demo
// 打开iOS模拟器
open -a Simulator
// 运行Flutter项目
flutter run

lutter run key commands为调试指令：

• r：热重载。修改代码后重新载入，以显示更改。
• R：热重启。重新启动项目，使项目回到初始状态。
• h：列出所有可用的交互式命令。
• d：分离（终止"flutter run"，但让应用程序继续运行）。即模拟器上运行的程序与项目断开调试，单独运行。
• c：清除屏幕。
• q：退出（终止设备上的应用程序）。

输入h可以查看所有可用的交互式命令，有兴趣的可以自己研究。

2.1.2 终端运行项目到iOS真机

• 总所周知，iOS项目想要在真机上运行是需要签名的，所以先打开项目目录下iOS对应的Runner.xcworkspace修改Bundle Identifier，指定Team。

• 连接真机，使用Xcode运行项目（每个项目第一次在真机上运行，都需要使用Xcode运行，以进行签名，后续就可以使用Android Studio、VS Code或终端进行运行了。之所以不使用Xcode进行开发调试，是因为Xcode不支持Dart语法和热重载、热重启，但是Android Studio支持）。

• Xcode停止运行，回到终端，执行如下指令运行项目。

flutter run

• 有多个设备的情况下，会给我们列出来，这里选择序号为1的真机（运行时真机不要处于锁屏状态，不然会运行失败）。

2.2 Android Studio运行项目

• 使用Android Studio打开Flutter项目或直接将项目目录拖入Android Studio，将项目类型改为Project。

• 真机连接电脑，启动模拟器，刷新之后，选择设备运行项目（想要将项目运行到iOS真机上的话，也需要先使用Xcode进行签名）。

• 修改导航栏title，点击热重载功能，会发现很快就将我们所修改的地方进行重载了。

• 点击热重启，查看模拟器APP变化，会发现数字重新变为了0。

总结

到这里，关于示例程序运行的介绍就结束了。下篇文章将开始介绍Dart的基础语法。敬请期待。