前语

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

一: 创立Flutter示例项目

1.1 Android Studio创立Flutter项目

运行Flutter示例项目

  • 挑选Flutter之后,输入项目信息,挑选finish完结创立。

运行Flutter示例项目

1.2 终端创立Flutter项目

  • 翻开终端,进入想要创立Flutter项目的目录。

运行Flutter示例项目

  • 运用终端创立Flutter项目也能够指定言语、渠道、模板等,运用如下指令能够检查终端创立项目的一些选项指令。
flutter create --help

运行Flutter示例项目

iOS默许运用Swift言语,android默许运用kotlin言语,创立项目时,咱们能够经过-i-a来指定相应的言语。其他一些指令,有爱好的能够自己研讨。

  • 运用如下指令创立iOS言语为OCFlutter项目。
flutter create -i objc flutter_demo

运行Flutter示例项目

二: 运转Flutter项目

2.1 终端运转项目

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

  • 进入Flutter项目目录,翻开iOS模拟器,经过如下指令运转项目。
// 进入项目目录
cd flutter_demo
// 翻开iOS模拟器
open -a Simulator
// 运转Flutter项目
flutter run

运行Flutter示例项目

Flutter run key commands为调试指令:

  • r:热重载。修正代码后从头载入,以显现更改。
  • R:热重启。从头发动项目,使项目回到初始状况。
  • h:列出所有可用的交互式指令。
  • d:分离(停止”flutter run”,但让应用程序持续运转)。即模拟器上运转的程序与项目断开调试,独自运转。
  • c:清除屏幕。
  • q:退出(停止设备上的应用程序)。

输入h能够检查所有可用的交互式指令,有爱好的能够自己研讨。

运行Flutter示例项目

2.1.2 终端运转项目到iOS真机

  • 总所周知,iOS项目想要在真机上运转是需求签名的,所以先翻开项目目录下iOS对应的Runner.xcworkspace修正Bundle Identifier,指定Team

运行Flutter示例项目

  • 连接真机,运用Xcode运转项目(每个项目第一次在真机上运转,都需求运用Xcode运转,以进行签名,后续就能够运用Android StudioVS Code或终端进行运转了。之所以不运用Xcode进行开发调试,是因为Xcode不支持Dart语法和热重载热重启,可是Android Studio支持)。

运行Flutter示例项目

  • Xcode停止运转,回到终端,履行如下指令运转项目。
flutter run

运行Flutter示例项目

  • 有多个设备的情况下,会给咱们列出来,这儿挑选序号为1的真机(运转时真机不要处于锁屏状况,否则会运转失利)。

运行Flutter示例项目

2.2 Android Studio运转项目

  • 运用Android Studio翻开Flutter项目或直接将项目目录拖入Android Studio,将项目类型改为Project

运行Flutter示例项目

  • 真机连接电脑,发动模拟器,改写之后,挑选设备运转项目(想要将项目运转到iOS真机上的话,也需求先运用Xcode进行签名)。

运行Flutter示例项目

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

运行Flutter示例项目

  • 点击热重启,检查模拟器APP变化,会发现数字从头变为了0

运行Flutter示例项目

总结

到这儿,关于示例程序运转的介绍就结束了。下篇文章将开始介绍Dart的根底语法。敬请期待。