内容
description bug_report

Android Studio 和 IntelliJ

内容

安装和设置

按照 设置编辑器 说明安装 Dart 和 Flutter 插件。

更新插件

插件更新会定期发布。当有更新可用时，IDE 中会提示您。

要手动检查更新

  1. 打开首选项（macOS 上的 Android Studio > 检查更新，Linux 上的 帮助 > 检查更新）。
  2. 如果列出了 dart 或 flutter，请更新它们。

创建项目

您可以通过多种方式创建新项目。

创建新项目

在 Android Studio 和 IntelliJ 中，从 Flutter 初学者应用模板创建新 Flutter 项目的方式不同。

在 Android Studio 中

  1. 在 IDE 中，从 欢迎窗口中单击 新建 Flutter 项目，或从主 IDE 窗口中单击 文件 > 新建 > 新建 Flutter 项目。
  2. 指定 Flutter SDK 路径，然后单击 下一步。
  3. 输入所需的 项目名称、描述和 项目位置。
  4. 如果您可能发布此应用，请设置公司域名。
  5. 单击 完成。

在 IntelliJ 中

  1. 在 IDE 中，从 欢迎窗口中单击 新建项目，或从主 IDE 窗口中单击 文件 > 新建 > 项目。
  2. 从左面板中的 生成器列表中选择 Flutter
  3. 指定 Flutter SDK 路径，然后单击 下一步。
  4. 输入所需的 项目名称、描述和 项目位置。
  5. 如果您可能发布此应用，请设置公司域名。
  6. 单击 完成。

从现有源代码打开项目

要打开现有 Flutter 项目

  1. 在 IDE 中，从 欢迎窗口中单击 打开，或从主 IDE 窗口中单击 文件 > 打开。
  2. 浏览到包含现有 Flutter 源代码文件的目录。

  3. 单击打开。

编辑代码和查看问题

Flutter 插件执行代码分析，以启用以下功能

  • 语法突出显示。
  • 基于丰富类型分析的代码补全。
  • 导航到类型声明（导航 > 声明），并查找类型用法（编辑 > 查找 > 查找用法）。
  • 查看所有当前源代码问题（视图 > 工具窗口 > Dart 分析）。任何分析问题都显示在 Dart 分析窗格中
    Dart Analysis pane

运行和调试

运行和调试由主工具栏控制

Main IntelliJ toolbar

选择目标

当在 IDE 中打开 Flutter 项目时，你应该在工具栏的右侧看到一组 Flutter 特定的按钮。

  1. 找到Flutter 目标选择器下拉按钮。这将显示可用目标的列表。
  2. 选择要启动应用的目标。连接设备或启动模拟器时，将出现其他条目。

在没有断点的情况下运行应用

  1. 单击工具栏中的播放图标，或调用运行 > 运行。底部的运行窗格显示日志输出。

在有断点的情况下运行应用

  1. 如果需要，在源代码中设置断点。
  2. 单击工具栏中的调试图标，或调用运行 > 调试。
    • 底部的调试器窗格显示堆栈帧和变量。
    • 底部的控制台窗格显示详细的日志输出。
    • 调试基于默认启动配置。要自定义此配置，请单击设备选择器右侧的下拉按钮，然后选择编辑配置。

快速编辑和刷新开发周期

Flutter 提供了同类最佳的开发者周期，使你能够通过有状态热重载功能几乎立即看到更改的效果。要了解更多信息，请查看热重载。

显示性能数据

要查看性能数据（包括小部件重建信息），请在调试模式下启动应用，然后使用视图 > 工具窗口 > Flutter 性能打开性能工具窗口。

Flutter performance window

要查看有关哪些小部件正在重建以及重建频率的统计信息，请在性能窗格中单击显示小部件重建信息。此帧的重建的确切数量显示在从右数起的第二列中。对于大量的重建，将显示一个黄色的旋转圆圈。最右侧的列显示自进入当前屏幕以来小部件被重建的次数。对于未重建的小部件，将显示一个实心灰色圆圈。否则，将显示一个灰色旋转圆圈。

此功能的目的是让你在小部件重建时意识到这一点——你可能在仅仅查看代码时并未意识到这一点。如果你重建了未预料的小部件，这可能表明你应该通过将大型构建方法拆分为多个小部件来重构代码。

此工具可以帮助你调试至少四个常见的性能问题

  1. 整个屏幕（或其大块部分）由单个 StatefulWidget 构建，导致不必要的 UI 构建。将 UI 拆分为更小的带有较小 build() 函数的小部件。

  2. 正在重建屏幕外小部件。例如，当 ListView 嵌套在延伸到屏幕外的较长 Column 中时，可能会发生这种情况。或者当未为延伸到屏幕外的列表设置 RepaintBoundary 时，会导致重新绘制整个列表。

  3. AnimatedBuilder 的 build() 函数绘制不需要动画的子树，导致静态对象的重建不必要。

  4. Opacity 小部件不必要地放置在小部件树中较高位置。或者，通过直接操作 Opacity 小部件的不透明度属性来创建不透明度动画，导致小部件本身及其子树重建。

你可以单击表格中的一行，导航到创建小部件的源代码行。随着代码运行，旋转图标也会显示在代码窗格中，帮助你直观地了解发生了哪些重建。

请注意，大量重建并不一定表示存在问题。通常，只有在你已在配置文件模式下运行应用并验证性能不是你想要的效果时，才应担心重建过多。

请记住，小部件重建信息仅在调试版本中可用。在配置文件版本中测试真实设备上的应用性能，但在调试版本中调试性能问题。

Flutter 代码编辑提示

如果你有其他提示需要我们分享，请告诉我们！

辅助工具和快速修复

辅助功能是与特定代码标识符相关的代码更改。当光标放置在 Flutter 小部件标识符上时，会提供许多此类功能，如黄色灯泡图标所示。可以通过单击灯泡或使用键盘快捷键（Linux 和 Windows 上的 Alt+Enter，macOS 上的 Option+Return）来调用辅助功能，如下所示

IntelliJ editing assists

快速修复类似，但仅在代码片段出错时显示，并且可以帮助更正错误。它们用红色灯泡表示。

用新的小部件辅助功能包装

当您有一个想要用周围小部件包装的小部件时可以使用此功能，例如，如果您想用 Row 或 Column 包装一个小部件。

用新的小部件辅助功能包装小部件列表

与上述辅助功能类似，但用于包装现有的小部件列表，而不是单个小部件。

将子项转换为子项辅助功能

将子项参数更改为子项参数，并将参数值包装在列表中。

实时模板

实时模板可用于加速输入典型代码结构。通过键入其前缀，然后在代码完成窗口中选择它来调用它们

IntelliJ live templates

Flutter 插件包括以下模板

  • 前缀 stless：创建 StatelessWidget 的新子类。
  • 前缀 stful：创建 StatefulWidget 的新子类及其关联的 State 子类。
  • 前缀 stanim：创建 StatefulWidget 的新子类及其关联的 State 子类，包括用 AnimationController 初始化的字段。

您还可以在设置 > 编辑器 > 实时模板中定义自定义模板。

键盘快捷键

热重载

在 Linux（键映射Default for XWin）和 Windows 上，键盘快捷键是 Control+Alt+; 和 Control+Backslash。

在 macOS（键映射Mac OS X 10.5+ copy）上，键盘快捷键是 Command+Option 和 Command+Backslash。

可以在 IDE 首选项/设置中更改键盘映射：选择键映射，然后在右上角的搜索框中输入flutter。右键单击您要更改的绑定，然后添加键盘快捷键。

IntelliJ settings keymap

热重载与热重启

热重载通过将更新的源代码文件注入到正在运行的 Dart VM（虚拟机）中来工作。这不仅包括添加新类，还包括向现有类添加方法和字段以及更改现有函数。不过，有几种类型的代码更改无法热重载

  • 全局变量初始化程序
  • 静态字段初始化程序
  • 应用程序的 main() 方法

对于这些更改，您可以完全重新启动应用程序，而无需结束调试会话。要执行热重启，请不要单击停止按钮，只需重新单击运行按钮（如果处于运行会话中）或调试按钮（如果处于调试会话中），或按住 Shift 键单击“热重载”按钮。

在 Android Studio 中编辑 Android 代码，并获得完整的 IDE 支持

打开 Flutter 项目的根目录不会将所有 Android 文件显示给 IDE。Flutter 应用程序包含一个名为 android 的子目录。如果您在 Android Studio 中将此子目录作为其自己的独立项目打开，则 IDE 将能够完全支持编辑和重构所有 Android 文件（如 Gradle 脚本）。

如果您已经在 Android Studio 中将整个项目作为 Flutter 应用程序打开，则有两种等效的方法可以在 IDE 中打开 Android 文件以进行编辑。在尝试此操作之前，请确保您使用的是最新版本的 Android Studio 和 Flutter 插件。

  • 在 “项目视图” 中，您应该会看到一个子目录，位于 Flutter 应用程序根目录的正下方，名为 android。右键单击它，然后选择 Flutter > 在 Android Studio 中打开 Android 模块。
  • 或者，您可以打开 android 子目录下的任何文件进行编辑。然后，您应该会在编辑器的顶部看到一个“Flutter 命令”横幅，其中有一个标记为 在 Android Studio 中打开以进行编辑 的链接。单击该链接。

对于这两个选项，Android Studio 都允许您在打开第二个项目时使用单独的窗口或用新项目替换现有窗口。任一选项都可以。

如果您尚未在 Android Studio 中打开 Flutter 项目，则可以从一开始就将 Android 文件作为其自己的项目打开

  1. 在欢迎启动画面上单击 打开现有 Android Studio 项目，或者如果 Android Studio 已打开，则单击 文件 > 打开。
  2. 打开位于 Flutter 应用程序根目录正下方的 android 子目录。例如，如果该项目名为 flutter_app，则打开 flutter_app/android。

如果您尚未运行 Flutter 应用程序，则在您打开 android 项目时，您可能会看到 Android Studio 报告一个构建错误。在应用程序的根目录中运行 flutter pub get，并通过选择 构建 > 构建 来重建项目以修复它。

在 IntelliJ IDEA 中编辑 Android 代码

要在 IntelliJ IDEA 中启用 Android 代码编辑，您需要配置 Android SDK 的位置

  1. 在 首选项 > 插件 中，如果您尚未启用，则启用 Android 支持。
  2. 在项目视图中右键单击 android 文件夹，然后选择 打开模块设置。
  3. 在 源 选项卡中，找到 语言级别 字段，然后选择 8 级或更高级别。
  4. 在 依赖项 选项卡中，找到 模块 SDK 字段，然后选择一个 Android SDK。如果没有列出任何 SDK，请单击 新建 并指定 Android SDK 的位置。务必选择与 Flutter 使用的 SDK 匹配的 Android SDK（如 flutter doctor 所报告的）。
  5. 单击 确定。

提示和技巧

故障排除

已知问题和反馈

可能影响您体验的重要已知问题记录在 Flutter 插件自述文件 中。

所有已知错误都在问题跟踪器中跟踪

我们欢迎对错误/问题和功能请求的反馈。在提交新问题之前

  • 在问题跟踪器中进行快速搜索，以查看问题是否已被跟踪。
  • 确保您已 更新 到插件的最新版本。

在提交新问题时，包括 flutter doctor 的输出。