为有牺牲多壮志,敢教日月换新天。

flutter创建项目

★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★

➤微信公众号:个人独立开发者
➤博主域名:https://www.zengqiang.org
➤GitHub地址:https://github.com/strengthen/LeetCode
➤原文地址:https://www.cnblogs.com/strengthen/p/16304813.html
➤如果链接不是山青咏芝的博客园地址,则可能是爬取作者的文章。
➤原文已修改更新!强烈建议点击原文地址阅读!支持作者!支持原创!
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★

热烈欢迎,请直接点击!!!

进入博主App Store主页,下载使用各个作品!!!

注:博主将坚持每月上线一个新app!!!

一、终端方式
1、创建flutter项目:
$ flutter create nfc_reader
// 指定iOS 为 swift, 安卓为 kotlin
$ flutter create -i swift -a kotlin nfc_reader
出现:
All done!
In order to run your application, type:

$ cd nfc_reader
$ flutter run

Your application code is in nfc_reader/lib/main.dart.
2、先直接打开Xcode自带iOS模拟器,否则会运行在macOS (macos)或Chrome (chrome)上。
$ open -a Simulator
3、运行项目,进入flutter 交互环境, 执行之前保证没有其他模拟器, 没有手机连接电脑, 这样项目就会直接运行在iOS 模拟器上:
nfc_reader文件夹下输入:
$ flutter run
按下 q, 可以退出 flutter 交互环境,其他命令项:
Flutter run key commands.
r Hot reload. 🔥🔥🔥
R Hot restart.
h List all available interactive commands.
d Detach (terminate "flutter run" but leave application running).
c Clear the screen
q Quit (terminate the application on the device).
4、查看看create命令的帮助信息, 找到 -i 和 -a 这两个参数:‘
$ flutter create -i objc -a java flutter_new
-i 表示 ios 项目语言, 默认为 Swift
-a 表示安卓项目语言, 默认炎 kotlin
5、在1中,创建flutter项目时指定语言:
// 指定iOS 为 swift, 安卓为 kotlin
$ flutter create -i swift -a kotlin nfc_reader
// 指定iOS 为 OC, 安卓为 java
$ flutter create -i objc -a java nfc_reader
二、真机运行
1、 在 Xcode 中进行真机运行,打开iOS工程, 在Xcode中配置一下开发证书,配置成功后就可以正常运行。
2、在终端命令行中运行到真机:
到nfc_reader文件夹下,
执行flutter run命令, 此时检测到有三种运行环境以及设备的id, 后边我们就可以加上参数, 直接指定运行的设备;
终端同时会给出我们4个选项, 以便我们继续执行命令,选择真机运行。
3、带上设备 id 或者 名称直接运行在真机设备上:
$ flutter run -d iphone_uuid
$ flutter run -d iphone_name
三、改变项目路径注意事项
1、 终端命令运行:
把nfc_reader项目拖到桌面上. 然后执行flutter run -d iphone_uuid运行到真机, 一切正常, 没有发生任何问题。
2、 Xcode运行:
把nfc_reader项目拖到桌面上. 然后执行flutter run -d iphone_uuid运行到真机, 报错。
在Xcode项目中有一个全局通用的配置文件:
Generated.xcconfig
该文件中有项目相关的绝对路径, 可以找到错误提示中的路径, 经过全局搜索, 也只有这个文件里有这个路径.
我们把这三个相关的路径改为新项目路径,即可正常运行。
3、 小结
在改变项目路径后:
用 Xcode 直接运行, 会发生路径错误, 需要把相关的路径配置修改正确.
用命令行运行, 可以正常运行, 猜测应该是命令每次都会更新全局配置文件.
注意: 这里只能用的是绝对路径, 这个路径会以变量的形式传入 flutter 引擎中, 所以不能用相对路径
四、Android Studio创建项目

Android Studio 安装了 flutter 相关的插件之后, 在打开的时候会有创建 flutter 项目的的选项.

  1. 选择 Create New Flutter Project 创建 flutter 项目

    image.png

  2. 选择 Flutter Application

    image.png

  3. 填写项目名称, SDK 路径, 项目保存路径, 描述信息, SDK 路径一般配置好就不需要管了, 项目保存路径一般也是有默认的, 当然也可以自定义,在家目录下不是很方便, 注意路径不要有中文, 不要有驼峰命名, 不要有大写, 否则 next 按钮是不能点击的, 重名, 命名不规则下面都会有红色 ! 提示的.

    image.png

  4. 填写 Bundle ID, 安卓叫包名, 选择开发语言, iOS 默认是 swift, 安卓默认是 kotlin, 如果需要改变默认语言, 在Platform channel language下勾选对应选项即可.

    image.png

    4.1 Android Studio 新版本更简单一些, 把所有需要填写的都放到一个界面了, 如下

    17D1D973-E962-48DA-A372-0B6EA3422EEC.png

  5. 运行项目, 想要在真机上运行的话, iOS 要用 Xcode 打开工程配置证书, 先 run 一次, 前边已经讲过了. 然后在 Android Studio 中点击绿色的大按钮启动项目, 各按钮已经标如下图.

image.png

五、热重载(r) 和 热重启(R)

概念解释

1. r: 热重载, Hot reload

我们调试项目时, 当我们项目运行起来, 想改个颜色, 字号什么的, 此时我们需要执行热重载, 只有我们修改的部分会发生相应的变化, 不会影响其他任何地方.

2. R: 热重启, Hot restart

我们调试项目时, 当我们项目运行起来, 想改个颜色, 字号什么的, 并且需要整体恢复到重新 run 起来时候的样子, 此时我们需要执行热重启, 除了我们修改的部分会发生相应的变化, 还有项目并不需要重新编译,安装就可以恢复到重新点击 run 的状态, 不会影响其他任何地方.

image.png

image.png

测试 r 和 R 效果

  1. 为了方便截图, 我这里使用模拟器, 先把项目运行起来, 点击 + 按钮, 让计数器数量到 5,然后将导航栏和+按钮背景色的蓝色改为 红色, 然后我们点击【热重载】按钮, 即闪电按钮, 结果如下图所示, 背景色变为红色, 计数器数量5没有发生变化.

    image.png

    image.png

    image.png

  2. 此时我们再改变原来的蓝色, 执行【热重启】, 结果除了背景色发生了变化之外, 计数器数量5变为 0, 项目相当于直接 run, 但是又没有重新编译.

    image.png

    image.png

小结: 热重载(r) 和 热重启(R) 对我们调试项目节约时间, 提高效率有非常大的帮助.

总结:

  1. 创建项目时, 注意路径命名规则, 是否需要指定开发语言.

  2. 终端运行项目可以直接指定设备 id.

  3. 改变项目路径时, 全局通用配置文件的路径变量要同时修改.

  4. 终端创建项目与Android Studio 创建项目的默认语言是不同的.

posted @ 2022-05-24 11:10  为敢技术  阅读(282)  评论(0编辑  收藏  举报