AS VS VS Code
VS
- 比较轻量级
- 前端开发利器
- 无法调试 Android
AS
- google 亲儿子，会率先适配 Flutter 的新特性
- Android 开发利器
- 支持 Flutter 调试
Android Studio
安装 Flutter 和 Dart 插件
- 打开 Android Studio
- 打开 Preference > Plugins(MACOS),File(Windows) > Settings > Plugins
- 选择 Browse repositories ，搜索 Flutter plugin 然后点击安装
- 安装完后，重新启动 Android Studio
使用技巧
- flutter run -d "模拟器名称" //来在指定的模拟器上运行
-
在使用 AndroidStudio 时，如果弹出说明文档卡住了，需要在 AndroidStudio -> preferences 中搜索 popup 如下图选中未知取消选择
image.png
代码块
- 可以通过AS中的 preferences -> Editor -> Live Templates 设置自己的代码块
- stless: 创建一个StatelessWidget子类
- stful: 创建一个创建一个 StatefulWidget 的子类，并关联 State 子类
- itar 或 iter: 快速生成 for 循环
- stanim：创建一个 StatefulWidget 的子类，并关联 State 子类，包含一个 AnimationController 的初始化字段
快捷键
- Ctrl + r 编译运行
- cmd + shift + o： 全局搜索文件
- cmd + shift + f： 全局搜索内容
- cmd + D: 快速复制当前行
- cmd + delete: 删除当前行
- Ctrl+option+ O: 删除未使用的import
- option + Enter： 自动import未导入的文件，鼠标指向未导入的类，然后option + enter
- CMD + -/+ 折起/展开代码块
- CMD + . 折起/展开选中代码
- CMD + [ 光标回到上一次编辑的位置
- CMD + ] 光标回到下一次编辑的位置
- CMD + L 定位某一行，甚至某一个字符
- CMD + Y 查看选中类的属性
- option + Enter： 在不同的地方有不同的扩展功能，很方便
- CMD + option + L 格式化代码
- CMD + Option +B 显示所有继承自该类的子类
- Command + N 可以快速生成构造方法
- option + enter 将statelessWidget 转为statefulWidget
- 缩进：选中代码 按 Tab 健
- 反缩进： 选中代码 按 shift + tab 健
- CMD + Shit + R： 全局搜索替换
- cmd + optional + w 将widget 抽取成方法或者类，这个快捷键可能会被占用，需要自己修改
- AS中 CMD + option + 左右箭头返回上一层 /下一层
代码编辑提示
- option +enter： 嵌套辅助/去掉控件
- option +enter： child和children相互转换
- CMD + option + 左右箭头： 返回上一层或下一层文件
实用工具
- preferences -> Languages & Frameworks -> Flutter -> Format code on save：保存时自动格式化代码
- Dart Analysis: 这里所有的警告，如没用到的变量，重复导入的文件
- 右上边的Flutter outline： 可以清楚地看到所有的小部件，在UI中的排列情况，也可以看出小部件的嵌套情况。Flutter outline 中的 Extract Method。当我们编写来一个Widget，并且代码行数比较长，那可以考虑将这个widget相关的代码，提取到一个方法中
- 查找类型的引用： Edit > Find > Find Usages
其他设置
-
修改main.dart路径：如下图所示edit configurations 面板中导入Dart enterpoint： 中就是设置main.dart的位置的
image.png
Snip20200715_2.png
性能分析
在 Debug 模式下启动应用后，使用 View > Tool Windows > Flutter Performance打开性能工具窗口，以查看性能数据，以及 widget 的重载信息。
点击 Performance 窗口中的 Show widget rebuild information，查看正在重载的 widget 统计信息和重载频率。右边第二列显示了所在框架的重载次数。如果重载次数过多，会显示一个黄色旋转圆圈。最右一列显示了进入当前页面后 widget 的重载次数。对于未重载的小部件，将显示一个灰色圆圈，否则将显示一个灰色旋转圆圈。
该工具可以帮助你调试至少四个常见的性能问题：
1、整个屏幕（或大部分屏幕）由一个 StatefulWidget 构成，导致不必要的 UI 构建。可将 UI 拆分成多个具有较轻量 build() 方法的 widget。
2、未在屏幕上显示的 widget 发生了重载。例如，一个延伸到屏幕外的 ListView，或者未给延伸到屏幕外的列表设置 RepaintBoundary，会导致重绘整个列表。
3、AnimatedBuilder 的 build() 方法绘制了一个不需要动画的子树，导致不必要的静态对象重载。
4、一个 Opacity widget 在 widget tree 中使用了一个不必要的高度，或者通过直接操作 Opacity widget 的透明属性创建 Opacity 动画，导致 widget 和它的子树重载。
