Flutter 官方文档 : https://docs.flutter.dev/install/quick

使用出现网络问题 , 参考 在中国网络环境下使用 Flutter 文档 ;





一、Flutter 环境版本选择




1、Flutter 开发环境


Flutter 开发环境 :

  • Flutter SDK ( 含 Dart SDK、编译工具、引擎 ) Flutter
  • IDE : Android Studio ( 推荐,全平台 )VS Code ( 轻量 )
  • Android 工具链 : Android SDK、Build Tools、模拟器、JDK、Gradle、AGP ( Android Gradle Plugin )
  • macOS 额外 : Xcode ( iOS/macOS 编译 ) 、CocoaPods/Swift PM
  • 必备命令行工具 : Git、PowerShell/Bash/Zsh

2、Flutter 开发环境与版本选择


推荐 Flutter 开发环境 稳定组合 : 开发环境版本选择 , 兼顾稳定、新特性、跨平台兼容 ;

  • Flutter : 3.41.7 ( Channel stable ) , 比 3.44 更稳、第三方包兼容更好 , Windows/macOS 行为一致 , 可无缝升级到 3.44 ;
    • 注意 : Flutter 3.41.x 最低要求 AGP 8.3、Gradle 8.3、JDK 17 ;
    • Flutter 3.29+ → Android Studio Ladybug ( 2024.2.1 ) +、JDK 17
    • Flutter 3.44 → 推荐 Android Studio Panda ( 2025.3.x ) 、JDK 17
  • Android Studio : Android Studio Ladybug ( 2024.2.2 ) , 与 Flutter 3.41.x 官方最佳适配;Windows/macOS 安装包独立、配置可同步;JDK 17 内置,无需额外配置 ;
  • JDK : 17 , 这是 AGP 8.x 强制使用的版本 , 使用 Android Studio Ladybug 自带的 Embedded JDK 17 即可 , 不需要额外安装 , 在 app/build.gradle 中配置 :
android {
    compileOptions {
        sourceCompatibility JavaVersion.VERSION_17
        targetCompatibility JavaVersion.VERSION_17
    }
    kotlinOptions {
        jvmTarget = '17'
    }
}
  • AGP ( Android Gradle Plugin ) 版本 : 8.8.2 , Android Studio Ladybug 2024.2.2 支持 AGP 3.2 ~ 8.8 , Android Studio Ladybug 默认捆绑 AGP 8.8.2 版本 ;
  • Gradle 版本 : 8.8 , AGP 8.8.x → 必须搭配 Gradle 8.8 , 在 gradle-wrapper.properties 中配置 :
distributionUrl=https\://services.gradle.org/distributions/gradle-8.8-all.zip
  • Kotlin 版本 : 1.9.0 ( Flutter 3.41.x 默认 ) , 在 android/build.gradle 中进行如下配置 ;
buildscript {
    ext.kotlin_version = '1.9.0'

    repositories {
        google()
        mavenCentral()
    }

    dependencies {
        // AGP 推荐 8.8.2 ( Ladybug 捆绑版 ) 
        classpath 'com.android.tools.build:gradle:8.8.2'
    }
}




二、Android Studio Ladybug 下载安装




1、Android Studio Ladybug 下载


https://developer.android.google.cn/studio/archive?hl=zh-cn 页面 , 直接下载 " Android Studio Ladybug Feature Drop | 2024.2.2 补丁 1 2025 年 2 月 13 日 " 版本 , 如下图所示 :

在这里插入图片描述

这是 Android Studio Ladybug 的 最新稳定版本 ,


2、Android Studio Ladybug 安装


下载完毕后 , 点击 android-studio-2024.2.2.14-windows.exe 安装 ;

在这里插入图片描述

环境界面 , 下一步 ;

在这里插入图片描述

模拟器不要 , 取消模拟器勾选 ;

在这里插入图片描述

选择一个安装目录 :

在这里插入图片描述

选择开始菜单目录 :
在这里插入图片描述

等待安装完毕 ;

在这里插入图片描述

安装完成 , 点击 Next 下一步 ;

在这里插入图片描述

点击 Finish , 首次启动 AS ;

在这里插入图片描述

选择 Don’t Send , 不要向 AS 发送信息 , 国内网卡 , 发不过去 浪费时间 ;
在这里插入图片描述

启动后的效果如下 :

在这里插入图片描述


3、JDK 安装 ( 仅作参考 )


Android Studio LadyBug 自带的是 21 版本的 JDK , 这里需要 自己下载 17 版本的 JDK ;

在这里插入图片描述

推荐下载 Eclipse Temurin 17 ( LTS ) 版本 ;

在这里插入图片描述


JDK 17 选择 : 仅作参考 ;

  • Eclipse Temurin 17 ( LTS ) : 最推荐
    • 优点 : OpenJDK 官方合规构建、TCK 认证、长期支持 ( 到 2029+ ) 、跨平台、免费无版权
    • Flutter 3.41.7 + AGP 8.x + Gradle 8.x 完美匹配、社区踩坑最少
    • 国内镜像多、下载快、稳定
  • JetBrains Runtime 17.0.14 ( JBR )
    • 优点 : Android Studio 自带,专门给 IDE 运行用,UI/HiDPI/ 字体渲染优化好
    • 不适合 : 不要用来做 Flutter Android 编译 ( Gradle 容易报版本不匹配、JCEF 冲突 )
    • 用途 : 只给 Android Studio 自己启动用
  • JetBrains Runtime (JCEF) 17.0.14 : 比普通 JBR 多了内嵌浏览器 ( JCEF ) , Flutter 编译完全没必要,反而更容易出问题,直接不推荐

创建 Flutter 项目时 可以下载 内置的 Eclipse Temurin 17 ( LTS ) 版本 JDK ;

在这里插入图片描述

在这里插入图片描述

注意 : JDK 推荐下载 Eclipse Temurin 17 ( LTS ) 版本 ;

在这里插入图片描述

选择如下设置 , Android 代码选择 Kotlin , 使用 Gradle 构建 , JDK 选择 Eclipse Temurin 17 ( LTS ) 版本 , Gradle 版本选择 8.8 ;
在这里插入图片描述

在 Android Studio 无法创建 Flutter 项目 , 上面创建的是 Android 项目 , 必须使用 flutter create project_name 命令 创建 Flutter 项目 ;





三、Flutter 安装



参考 【Flutter】Flutter 开发环境搭建 ( Android Studio 下 Flutter / Dart 插件安装 | Flutter SDK 安装 | 环境变量配置 | 开发环境检查 ) 博客 ;


1、安装 Dart 插件


在 相同的位置 , 搜索 Dart , 也 更新一下 , 更新完毕后 重启 Android Studio ;

在这里插入图片描述

安装完毕后的效果 ;

在这里插入图片描述


2、安装 Flutter 插件


在 欢迎界面的 Plugins 插件面板中 , 选择 Marketplace , 搜索 Flutter 插件 , 可以看到该插件 , 之前安装过 Flutter , 这里选择 Update 更新插件 ;

在这里插入图片描述

更新完毕后 , 会要求重启 IDE ;

在这里插入图片描述

安装完 Flutter 插件后 , 重启 Android Studio , 进入 菜单栏 | File → Settings 设置界面中 的 Languages & Frameworks 设置下 , 才会有 Flutter 设置 ; 现在还不能配置 , 下个章节 下载 Flutter SDK 解压后 , 将解压的 flutter 目录配置进去 ;

在这里插入图片描述


3、安装 Flutter SDK


Flutter SDK 下载地址 : https://docs.flutter.dev/install/archive ;

在这里插入图片描述

官方提供的 3.41.7 SDK 下载链接 : https://storage.googleapis.com/flutter_infra_release/releases/stable/windows/flutter_windows_3.41.7-stable.zip

使用出现网络问题 , 参考 在中国网络环境下使用 Flutter 文档 , 可以使用下面的链接下载 Flutter SDK ;

国内镜像下载链接 : https://storage.googleapis.com/flutter_infra_release/releases/stable/windows/flutter_windows_3.41.7-stable.zip

下载后的 Flutter SDK ;
在这里插入图片描述

解压到一个目录中 , 注意该目录不能有中文或者空格 ;

在这里插入图片描述

查看该目录内容 ;
在这里插入图片描述


4、配置 Flutter SDK 环境变量


在环境变量中配置上述 Flutter SDK 的 bin 目录 " D:\001_Develop\026_Flutter_3.41.7\flutter\bin " ;

在这里插入图片描述
然后再配置两个 环境变量 :

  • 变量名 : PUB_HOSTED_URL

  • 变量值 : https://pub.flutter-io.cn
    在这里插入图片描述

  • 变量名 : FLUTTER_STORAGE_BASE_URL

  • 变量值 : https://storage.flutter-io.cn

在这里插入图片描述


5、重启电脑


配置完毕后 , 重启电脑 , 令 环境变量 生效 ;

在命令行中执行 flutter --version 命令 , 查看是否安装成功 ;

C:\Users\octop>flutter --version
Flutter 3.41.7 • channel stable • https://github.com/flutter/flutter.git
Framework • revision cc0734ac71 (6 weeks ago)2026-04-15 21:21:08 -0700
Engine • hash 7a53c052bc4b472cf780b199087e1368e4a9aa8c (revision 59aa584fdf) (1 months ago)2026-04-16 02:32:16.000Z
Tools • Dart 3.11.5 • DevTools 2.54.2

C:\Users\octop>

在这里插入图片描述


6、Android Studio 配置 Flutter SDK


在 Android Studio 中 创建一个 Android 项目 , 然后在 菜单栏 -> File -> Settings 中的 Languages & Frameworks 设置下 , 配置 Flutter , 配置完毕后 , 需要重启 才能生效 ;

在这里插入图片描述

注意 : 配置目录后 , 点击 Apply 按钮 , 本次不生效 , 再次进入 仍然没有 flutter 配置 , 重启 Android Studio 后 , 才能看到上面的配置成功效果 ;


7、验证 Flutter 是否正确


第一次执行 flutter doctor 命令 , 爆出了 2 个错误 ;

D:\002_Project\001_Flutter>flutter doctor
Flutter assets will be downloaded from https://storage.flutter-io.cn. Make sure you trust this source!
Doctor summary (to see all details, run flutter doctor -v):
[] Flutter (Channel stable, 3.41.7, on Microsoft Windows [版本 10.0.19045.6466], locale zh-CN)
[] Windows Version (10 家庭中文版 64, 22H2, 2009)
[!] Android toolchain - develop for Android devices (Android SDK version 35.0.0)
    X Flutter requires Android SDK 36 and the Android BuildTools 28.0.3
      To update the Android SDK visit https://flutter.dev/to/windows-android-setup for detailed instructions.
[] Chrome - develop for the web
[] Visual Studio - develop Windows apps (Visual Studio Community 2019 16.11.2)
[] Connected device (3 available)
[] Network resources (the doctor check crashed)
    X Due to an error, the doctor check did not complete. If the error message below is not helpful, please let us know
      about this issue at https://github.com/flutter/flutter/issues.
    X Exception: Network resources exceeded maximum allowed duration of 0:04:30.000000

! Doctor found issues in 2 categories.

在这里插入图片描述

安装 SDK 35 和 36 版本 :
在这里插入图片描述

更新 Android SDK Build-Tools 到 37 版本 :

在这里插入图片描述

挂上 梯子 ;

再次执行 flutter doctor 命令 , 验证通过 , Flutter 环境搭建完毕 ;

C:\Users\octop>flutter doctor
Flutter assets will be downloaded from https://storage.flutter-io.cn. Make sure you trust this source!
Doctor summary (to see all details, run flutter doctor -v):
[] Flutter (Channel stable, 3.41.7, on Microsoft Windows [版本 10.0.19045.6466], locale zh-CN)
[] Windows Version (10 家庭中文版 64, 22H2, 2009)
[] Android toolchain - develop for Android devices (Android SDK version 37.0.0)
[] Chrome - develop for the web
[] Visual Studio - develop Windows apps (Visual Studio Community 2019 16.11.2)
[] Connected device (3 available)
[] Network resources

• No issues found!

C:\Users\octop>

在这里插入图片描述





四、创建 Flutter 工程



特别注意 :

  • 只能使用 flutter create 命令 创建 Flutter 项目 ;

  • 不要在 Android Studio 中创建项目 , AS 创建出来是 Android 项目 ;


1、创建 Flutter 工程


在要创建工程的目录的上一级目录 , 执行

flutter create client_terminal

命令 , 创建 Flutter 项目 , 执行过程如下 :

D:\002_Project\001_Flutter>flutter create client_terminal
Flutter assets will be downloaded from https://storage.flutter-io.cn. Make sure you trust this source!
Creating project client_terminal...
Resolving dependencies in `client_terminal`...
Downloading packages... (2.3s)
Got dependencies in `client_terminal`.
Wrote 131 files.

All done!
You can find general documentation for Flutter at: https://docs.flutter.dev/
Detailed API documentation is available at: https://api.flutter.dev/
If you prefer video documentation, consider: https://www.youtube.com/c/flutterdev

In order to run your application, type:

  $ cd client_terminal
  $ flutter run

Your application code is in client_terminal\lib\main.dart.


D:\002_Project\001_Flutter>

在这里插入图片描述

创建的 Flutter 项目目录如下所示 :

在这里插入图片描述


2、命令行运行 Flutter 项目 - Web 版


执行 cd client_terminal 命令 , 进入 Flutter 项目 ,

执行 flutter run 命令 , 执行该 Flutter 项目 , 目前只支持 Windows 或者 浏览器 运行 ;

[1]: Windows (windows)
[2]: Chrome (chrome)
[3]: Edge (edge)

在这里插入图片描述

运行效果 :

在这里插入图片描述

在这里插入图片描述


3、命令行运行 Flutter 项目 - Android 版


首先 , 执行 flutter clean 清空缓存 ,

D:\002_Project\001_Flutter\client_terminal>flutter clean
Deleting build...                                                1,492ms
Deleting .dart_tool...                                             114ms
Deleting ephemeral...                                                1ms
Deleting Generated.xcconfig...                                       1ms
Deleting flutter_export_environment.sh...                            0ms
Deleting ephemeral...                                                1ms

在这里插入图片描述

然后 , 执行 flutter pub get 重新获取依赖 ,

D:\002_Project\001_Flutter\client_terminal>flutter pub get
Resolving dependencies... (2.0s)
Downloading packages... (3.9s)
* async 2.13.1 (was 2.13.1)
* boolean_selector 2.1.2 (was 2.1.2)
* characters 1.4.1 (was 1.4.1)
* clock 1.1.2 (was 1.1.2)
* collection 1.19.1 (was 1.19.1)
* cupertino_icons 1.0.9 (was 1.0.9)
* fake_async 1.3.3 (was 1.3.3)
* flutter_lints 6.0.0 (was 6.0.0)
* leak_tracker 11.0.2 (was 11.0.2)
* leak_tracker_flutter_testing 3.0.10 (was 3.0.10)
* leak_tracker_testing 3.0.2 (was 3.0.2)
* lints 6.1.0 (was 6.1.0)
* matcher 0.12.19 (was 0.12.19) (0.12.20 available)
* material_color_utilities 0.13.0 (was 0.13.0)
* meta 1.17.0 (was 1.17.0) (1.18.2 available)
* path 1.9.1 (was 1.9.1)
* source_span 1.10.2 (was 1.10.2)
* stack_trace 1.12.1 (was 1.12.1)
* stream_channel 2.1.4 (was 2.1.4)
* string_scanner 1.4.1 (was 1.4.1)
* term_glyph 1.2.2 (was 1.2.2)
* test_api 0.7.10 (was 0.7.10) (0.7.12 available)
* vector_math 2.2.0 (was 2.2.0) (2.3.0 available)
* vm_service 15.2.0 (was 15.2.0)
Changed 24 dependencies!
4 packages have newer versions incompatible with dependency constraints.
Try `flutter pub outdated` for more information.

在这里插入图片描述
最后 , 执行 flutter build apk --release 命令 , 编译 APK 文件 ;

D:\002_Project\001_Flutter\client_terminal>flutter build apk --release
Font asset "MaterialIcons-Regular.otf" was tree-shaken, reducing it from 1645184 to 1368 bytes (99.9% reduction). Tree-shaking can be disabled by providing the --no-tree-shake-icons flag when building your app.
Running Gradle task 'assembleRelease'...                           97.5s
√ Built build\app\outputs\flutter-apk\app-release.apk (40.6MB)

在这里插入图片描述
编译成功后 , 在 D:\002_Project\001_Flutter\client_terminal\build\app\outputs\flutter-apk 目录中 , 执行

adb install app-release.apk

命令 , 安装 编译后的 apk 文件 ;


4、Android Studio 中运行 Flutter 项目 - Android 版


在 Android Studio 中 编译 Flutter 项目 ,

选择 " 菜单栏 | Builder | Flutter | Build APK " 选项 , 编译 APK 文件 ;

在这里插入图片描述

编译结果如下 , 加你个编译后的 apk 文件 安装到 手机中即可 ;

在这里插入图片描述

编译成功后 , 在 D:\002_Project\001_Flutter\client_terminal\build\app\outputs\flutter-apk 目录中 , 执行

adb install app-release.apk

命令 , 安装 编译后的 apk 文件 ;

D:\002_Project\001_Flutter\client_terminal\build\app\outputs\flutter-apk>adb install app-release.apk
Performing Streamed Install
Success

在这里插入图片描述

执行后 手机截图 :

在这里插入图片描述

也可以选中 Android 设备 , 点击运行按钮 , 直接在手机中运行项目 , 首次运行要花费很长时间 ,

在这里插入图片描述

首次运行 , 到 √ Built build\app\outputs\flutter-apk\app-debug.apk 这一步要运行 半小时到一小时左右 ;

在这里插入图片描述





四、AI 编辑器 Trae 安装还用



参考 https://docs.trae.cn/ide/get-started-with-trae 文档 进行使用 ;


1、下载 Trae


下载地址 https://www.trae.cn/ide/download

在这里插入图片描述

下载 Trae IDE 版本 :


2、安装 Trae


执行 下载的 TRAE_SOLO_CN-Setup-x64.exe 安装文件 ;

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

安装完毕后 , 运行 Trae IDE ;

在这里插入图片描述

首次启动 :

在这里插入图片描述

点击左侧的插件商店 , 把 Dart 插件给装上 , 这是 Flutter 使用的语言 ;

在这里插入图片描述


3、关联 Flutter 项目


在 TraeIDE 中 , 选择 菜单栏 | 文件 | 打开文件夹 , 直接打开 Flutter 项目的根目录 文件夹 ,

在这里插入图片描述

然后就会进入如下界面 , 在这里可以对项目源码进行编辑修改 ;

在这里插入图片描述

更多推荐