在AndroidStudio创建Flutter项目并运行到模拟器

1.Flutter简介

Flutter是Google开源的构建用户界面(UI)工具包,帮助开发者通过一套代码库高效构建多平台精美应用,支持移动、Web、桌面和嵌入式平台。Flutter 开源、免费,拥有宽松的开源协议,适合商业项目。

官网:

Flutter中文网 官网

2.安装AndroidStudio并下载Flutter插件

AndroidStudio安装方法可以参考这篇文章:2023最新版Android studio安装入门教程(非常详细)从零基础入门到精通,看完这一篇就够了-CSDN博客

我的安装AndroidSDK地址保存在D:\PubData\Android\SDK。如下图所示:

在AndroidStudio开发工具中File>Settings>Plugins中搜索Flutter安装。第一次安装Flutter会提示安装Dart插件,点击Install按钮。最后重启IDE使插件生效。

查看到安装好了Flutter和Dart。

3.Flutter SDK安装

官网地址:

Archive | Flutter

根据自己的环境下载最新稳定版本(Stable channel),当前最新版是3.19.6

下载完成后,解压到某一位置,D:\PubData\flutter_windows_3.19.2-stable

4.设置环境变量

设置系统环境变量:

添加用户环境变量的Path:

设置完成后,在cmd命令行执行flutter doctor来检查flutter环境是否正常。如果有问题会显示红色的X,根据具体情况自行解决,再进行检查。如下图中的X问题的解决方法:

4.1问题1---缺少安装插件 cmdline-tools component is missing

描述:

[!] Android toolchain - develop for Android devices (Android SDK version 34.0.0)

X cmdline-tools component is missing

Run `path/to/sdkmanager --install "cmdline-tools;latest"`

See https://developer.android.com/studio/command-line for more details.

解决办法:根据路径Settings>Languages&frameworks>SDK Tools>Android SDK Command-line Tools(latest)勾选点Apply按钮安装。

4.2问题2Android license status unknown.

描述:

X Android license status unknown.

Run `flutter doctor --android-licenses` to accept the SDK licenses.

解决办法:

执行 flutter doctor --android-licenses ,如果报错版本问题一般是Android Studio自带了jdk版本与JAVA_HOME配置的jdk版本冲突了,可以检查 JAVA_HOME 环境变量,将路径设置为D:\\Android Studio\\jre 再执行 flutter doctor --android-licenses 并同意各种协议。

4.2问题3 Network resources网络资源访问超时

描述:

[!] Network resources

X A network error occurred while checking "https://maven.google.com/": 信号灯超时时间已到

X A network error occurred while checking "https://github.com/": 信号灯超时时间已到

解决办法:按如下步骤修改

a.修改flutter安装路径下packages\flutter_tools\lib\src\路径下的http_host_validator.dart文件中的kMaven配置:

const String kMaven = 'https://maven.aliyun.com/repository/google/';

b.删除flutter安装目录/bin/cache 文件夹

c.重新执行flutter doctor

5.Android 开发环境设置

5.1 创建android模拟器

在菜单 Tools > Device Manager 点击 Create device 创建设备 。

默认提供了一些设备,我这里选择一个pixel 3a.

选择镜像并下载,建议选择 x86 或 x86_64,点击finish创建模拟器。

点击运行,效果如下:

5.2创建Flutter项目

在 Android Studio 打开 File > New > New Flutter Project,选择SDK路径:

点击Next,填写项目名称,配置Android和ios语言,点击 Create:

报错提示Projectname的命名方式不对,我改为my_test_app后就可以了,如下是创建好的项目:

选择安卓模拟器,发现是灰色的,点run按钮,提示:not applicable for the "main.dart" configuration,解决办法,在Project Structure中要配置SDK。如下配置后,重启生效:

运行报错:

换成默认的jdk试下:

经过一段长时间的等待,终于可以在模拟器上看到运行的程序了。

console窗口的信息如下:

bash 复制代码
Launching lib\main.dart on sdk gphone64 x86 64 in debug mode...
Running Gradle task 'assembleDebug'...
Checking the license for package Android SDK Tools in D:\PubData\Android\SDK\licenses
License for package Android SDK Tools accepted.
Preparing "Install Android SDK Tools (revision: 26.1.1)".
"Install Android SDK Tools (revision: 26.1.1)" ready.
Installing Android SDK Tools in D:\PubData\Android\SDK\tools
"Install Android SDK Tools (revision: 26.1.1)" complete.
"Install Android SDK Tools (revision: 26.1.1)" finished.
Checking the license for package Android SDK Build-Tools 30.0.3 in D:\PubData\Android\SDK\licenses
License for package Android SDK Build-Tools 30.0.3 accepted.
Preparing "Install Android SDK Build-Tools 30.0.3 (revision: 30.0.3)".
"Install Android SDK Build-Tools 30.0.3 (revision: 30.0.3)" ready.
Installing Android SDK Build-Tools 30.0.3 in D:\PubData\Android\SDK\build-tools\30.0.3
"Install Android SDK Build-Tools 30.0.3 (revision: 30.0.3)" complete.
"Install Android SDK Build-Tools 30.0.3 (revision: 30.0.3)" finished.
√  Built build\app\outputs\flutter-apk\app-debug.apk.
Installing build\app\outputs\flutter-apk\app-debug.apk...
Debug service listening on ws://127.0.0.1:64507/QBYNZVjlvMs=/ws
Syncing files to device sdk gphone64 x86 64...

至此,在Androidstudio上创建Flutter项目成功。

相关推荐
lqj_本人17 小时前
flutter_鸿蒙next_Dart基础②List
flutter
lqj_本人17 小时前
flutter_鸿蒙next_Dart基础①字符串
flutter
The_tuber_sadness17 小时前
【Flutter】- 基础语法
flutter
helloxmg18 小时前
鸿蒙harmonyos next flutter通信之BasicMessageChannel获取app版本号
flutter
linpengteng1 天前
使用 Flutter 开发数字钱包应用(Dompet App)
前端·flutter·firebase
云兮Coder2 天前
鸿蒙 HarmonyNext 与 Flutter 的异同之处
flutter·华为·harmonyos
lqj_本人2 天前
flutter_鸿蒙next(win)环境搭建
flutter·华为·harmonyos
yuanlaile2 天前
Windows上面搭建Flutter Android运行环境
android·flutter