使用最新的 Flutter SDK 3.22.1 构建 HarmonyOS 应用

徐建国

发布于 2025-04-11 08:13:34

26600

代码可运行

文章被收录于专栏：个人路线个人路线

运行总次数：0

代码可运行

使用最新的 Flutter SDK 3.22.1 构建 HarmonyOS 应用

大家都知道目前鸿蒙的开源 tpc 和 sig 仓都迁移到了 gitcode 平台了，本次更新对 Flutter SDK 也有所涉及，所以我们就用最新的 Flutter SDK 来一起看一下如何构建 HarmonyOS 应用

最新的仓库是https://gitcode.com/openharmony-sig/flutter_flutter

这个仓库里面有两个版本，一个是3.7版本，一个是3.22版本

所以大家需要哪个版本，就根据自己的情况就好

首先

下载 flutter_flutter

 git clone git@gitcode.com:openharmony-sig/flutter_flutter.git

或者

git clone https://gitcode.com/openharmony-sig/flutter_flutter.git

切换分支 3.22.0-ohos

然后切换

git checkout -b 3.22.0-ohos origin/3.22.0-ohos

配置环境变量

然后打开~/.bash_profile配置文件，更改目录。

open ~/.bash_profile

export PATH=/Users/jianguo/huawei/flutter/bin:$PATH
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
export FLUTTER_GIT_URL=https://gitcode.com/openharmony-sig/flutter_flutter.git

刷新

source ~/.bash_profile

然后我们再去检查环境

jianguo@nutpi ~ % flutter --version
Flutter 3.22.1-ohos-0.1.1 • channel [user-branch] • git@gitcode.com:openharmony-sig/flutter_flutter.git
Framework • revision ff3e031966 (3 days ago) • 2025-04-07 10:25:16 +0800
Engine • revision f6344b75dc
Tools • Dart 3.4.0 • DevTools 2.34.1
jianguo@nutpi ~ %

现在我们就可以看到的是3.22啦

项目配置

1.进入项目根目录，如果项目尚未创建，则使用flutter create命令创建项目

flutter create my_app

assets   chapter11  chapter15  chapter5  chapter9  styles
jianguo@jianguodeMacBook-Pro-2 gitbook_flutter % flutter create my_app
Flutter assets will be downloaded from https://storage.flutter-io.cn. Make sure you trust this source!
Downloading Material fonts...                                    1,271ms
Downloading Gradle Wrapper...                                       28ms
Downloading package sky_engine...                                  635ms
Downloading flutter_patched_sdk tools...                           301ms
Downloading flutter_patched_sdk_product tools...                   152ms
Downloading darwin-arm64 tools...                                  909ms
Downloading libimobiledevice...                                     28ms
Downloading usbmuxd...                                              26ms
Downloading libplist...                                             27ms
Downloading openssl...                                              84ms
Downloading ios-deploy...                                           31ms
Downloading darwin-arm64/font-subset tools...                      115ms
Developer identity "Apple Development: Shu Shu (669W3557MK)" selected for iOS code signing
Creating project my_app...
Resolving dependencies in `my_app`...
Downloading packages...
Got dependencies in `my_app`.
Wrote 161 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 my_app
  $ flutter run

Your application code is in my_app/lib/main.dart.

2.如果项目已经创建，已经添加鸿蒙平台支持，则使用以下命令添加鸿蒙平台支持。有的话，就不用执行下面的命令。

flutter create --platforms ohos .

其中，.代表当前目录。

目录结构类似如下所示

jianguo@nutpi my_app %  tree -L 3
.
├── README.md
├── analysis_options.yaml
├── android
│   ├── app
│   │   ├── build.gradle
│   │   └── src
│   ├── build.gradle
│   ├── gradle
│   │   └── wrapper
│   ├── gradle.properties
│   ├── gradlew
│   ├── gradlew.bat
│   ├── local.properties
│   ├── my_app_android.iml
│   └── settings.gradle
├── ios
│   ├── Flutter
│   │   ├── AppFrameworkInfo.plist
│   │   ├── Debug.xcconfig
│   │   ├── Generated.xcconfig
│   │   ├── Release.xcconfig
│   │   └── flutter_export_environment.sh
│   ├── Runner
│   │   ├── AppDelegate.swift
│   │   ├── Assets.xcassets
│   │   ├── Base.lproj
│   │   ├── GeneratedPluginRegistrant.h
│   │   ├── GeneratedPluginRegistrant.m
│   │   ├── Info.plist
│   │   └── Runner-Bridging-Header.h
│   ├── Runner.xcodeproj
│   │   ├── project.pbxproj
│   │   ├── project.xcworkspace
│   │   └── xcshareddata
│   ├── Runner.xcworkspace
│   │   ├── contents.xcworkspacedata
│   │   └── xcshareddata
│   └── RunnerTests
│       └── RunnerTests.swift
├── lib
│   └── main.dart
├── linux
│   ├── CMakeLists.txt
│   ├── flutter
│   │   ├── CMakeLists.txt
│   │   ├── generated_plugin_registrant.cc
│   │   ├── generated_plugin_registrant.h
│   │   └── generated_plugins.cmake
│   ├── main.cc
│   ├── my_application.cc
│   └── my_application.h
├── macos
│   ├── Flutter
│   │   ├── Flutter-Debug.xcconfig
│   │   ├── Flutter-Release.xcconfig
│   │   ├── GeneratedPluginRegistrant.swift
│   │   └── ephemeral
│   ├── Runner
│   │   ├── AppDelegate.swift
│   │   ├── Assets.xcassets
│   │   ├── Base.lproj
│   │   ├── Configs
│   │   ├── DebugProfile.entitlements
│   │   ├── Info.plist
│   │   ├── MainFlutterWindow.swift
│   │   └── Release.entitlements
│   ├── Runner.xcodeproj
│   │   ├── project.pbxproj
│   │   ├── project.xcworkspace
│   │   └── xcshareddata
│   ├── Runner.xcworkspace
│   │   ├── contents.xcworkspacedata
│   │   └── xcshareddata
│   └── RunnerTests
│       └── RunnerTests.swift
├── my_app.iml
├── ohos
│   ├── AppScope
│   │   ├── app.json5
│   │   └── resources
│   ├── build-profile.json5
│   ├── entry
│   │   ├── build-profile.json5
│   │   ├── hvigorfile.ts
│   │   ├── oh-package.json5
│   │   └── src
│   ├── hvigor
│   │   └── hvigor-config.json5
│   ├── hvigorfile.ts
│   ├── local.properties
│   └── oh-package.json5
├── pubspec.lock
├── pubspec.yaml
├── test
│   └── widget_test.dart
├── web
│   ├── favicon.png
│   ├── icons
│   │   ├── Icon-192.png
│   │   ├── Icon-512.png
│   │   ├── Icon-maskable-192.png
│   │   └── Icon-maskable-512.png
│   ├── index.html
│   └── manifest.json
└── windows
    ├── CMakeLists.txt
    ├── flutter
    │   ├── CMakeLists.txt
    │   ├── generated_plugin_registrant.cc
    │   ├── generated_plugin_registrant.h
    │   └── generated_plugins.cmake
    └── runner
        ├── CMakeLists.txt
        ├── Runner.rc
        ├── flutter_window.cpp
        ├── flutter_window.h
        ├── main.cpp
        ├── resource.h
        ├── resources
        ├── runner.exe.manifest
        ├── utils.cpp
        ├── utils.h
        ├── win32_window.cpp
        └── win32_window.h

46 directories, 79 files
jianguo@nutpi my_app %

ohos目录，这里面存放的就是鸿蒙平台的相关代码。

代表

1.在运行项目之前，先对项目进行签名，否则在运行过程中会出现这样的错误

图像-20250410094436357

请通过DevEco Studio打开ohos工程后配置调试签名(File -> Project Structure -> Signing Configs 勾选Automatically generate signature)

图像-20241105103358856

图像-20250410093739323

2.用DevEco打开上面的ohos目录，注意不是项目目录，是项目下面的ohos鸿蒙目录，然后根据提示依次打开File -> Project Structure -> Signing Configs，点击自动签名即可。

3.签名成功后，文件ohos/build-profile.json5会自动更新，里面的字段signingConfigs出现相应的签名配置信息。

运行

使用 Flutter Run

jianguo@nutpi my_app % hdc tconn 192.168.1.16:41667
Connect OK
jianguo@nutpi my_app % flutter run
Connected devices:
127.0.0.1:5555 (mobile)         • 127.0.0.1:5555        • ohos-arm64     • Ohos OpenHarmony-5.0.4.150 (API 16)
192.168.1.16:41667 (mobile)     • 192.168.1.16:41667    • ohos-arm64     • Ohos OpenHarmony-5.0.4.150 (API 16)
macOS (desktop)                 • macos                 • darwin-arm64   • macOS 13.4.1 22F82 darwin-arm64
Mac Designed for iPad (desktop) • mac-designed-for-ipad • darwin         • macOS 13.4.1 22F82 darwin-arm64
Chrome (web)                    • chrome                • web-javascript • Google Chrome 135.0.7049.42

No wireless devices were found.

 (127.0.0.1:5555)
 (192.168.1.16:41667)
 (macos)
 Designed for iPad (mac-designed-for-ipad)
 (chrome)
Please choose one (or "q" to quit): 2
Launching lib/main.dart on 192.168.1.16:41667 in debug mode...
start hap build...
Running Hvigor task assembleHap...                                 14.1s
✓ Built ohos/entry/build/default/outputs/default/entry-default-signed.hap.

图像-20241105103741912

等待就可以。

flutter_01

这不是出来了，赞赞赞。

 flutter run --debug -d 9CN0223901000559

  ╔════════════════════════════════════════════════════════════════════════════╗
  ║                 Welcome to Flutter! - https://flutter.dev                  ║
  ║                                                                            ║
  ║ The Flutter tool uses Google Analytics to anonymously report feature usage ║
  ║ statistics and basic crash reports. This data is used to help improve      ║
  ║ Flutter tools over time.                                                   ║
  ║                                                                            ║
  ║ Flutter tool analytics are not sent on the very first run. To disable      ║
  ║ reporting, type 'flutter config --no-analytics'. To display the current    ║
  ║ setting, type 'flutter config'. If you opt out of analytics, an opt-out    ║
  ║ event will be sent, and then no further information will be sent by the    ║
  ║ Flutter tool.                                                              ║
  ║                                                                            ║
  ║ By downloading the Flutter SDK, you agree to the Google Terms of Service.  ║
  ║ The Google Privacy Policy describes how data is handled in this service.   ║
  ║                                                                            ║
  ║ Moreover, Flutter includes the Dart SDK, which may send usage metrics and  ║
  ║ crash reports to Google.                                                   ║
  ║                                                                            ║
  ║ Read about data we send with crash reports:                                ║
  ║ https://flutter.dev/docs/reference/crash-reporting                         ║
  ║                                                                            ║
  ║ See Google's privacy policy:                                               ║
  ║ https://policies.google.com/privacy                                        ║
  ║                                                                            ║
  ║ To disable animations in this tool, use                                    ║
  ║ 'flutter config --no-cli-animations'.                                      ║
  ╚════════════════════════════════════════════════════════════════════════════╝


Launching lib/main.dart on 9CN0223901000559 in debug mode...
start hap build...
Running Hvigor task assembleHap...                                 12.8s
✓ Built ohos/entry/build/default/outputs/default/entry-default-signed.hap.
installing hap. bundleName: com.example.my_app

在模拟器上运行时闪退，不知道大家知道什么原因不？

图像-20250410094927223

Flutter 医生-v

jianguo@nutpi ~ % flutter doctor -v
[!] Flutter (Channel [user-branch], 3.22.1-ohos-0.1.1, on macOS 13.4.1 22F82 darwin-arm64, locale zh-Hans-CN)
    ! Flutter version 3.22.1-ohos-0.1.1 on channel [user-branch] at /Users/jianguo/huawei/flutter
      Currently on an unknown channel. Run `flutter channel` to switch to an official channel.
      If that doesn't fix the issue, reinstall Flutter by following instructions at https://flutter.dev/docs/get-started/install.
    ! Upstream repository git@gitcode.com:openharmony-sig/flutter_flutter.git is not the same as FLUTTER_GIT_URL
    • FLUTTER_GIT_URL = https://gitcode.com/openharmony-sig/flutter_flutter.git
    • Framework revision ff3e031966 (3 days ago), 2025-04-07 10:25:16 +0800
    • Engine revision f6344b75dc
    • Dart version 3.4.0
    • DevTools version 2.34.1
    • Pub download mirror https://pub.flutter-io.cn
    • Flutter download mirror https://storage.flutter-io.cn
    • If those were intentional, you can disregard the above warnings; however it is recommended to use "git" directly to perform update checks and upgrades.

[✓] HarmonyOS toolchain - develop for HarmonyOS devices
    • OpenHarmony Sdk at /Users/jianguo/Library/OpenHarmony/Sdk, available api versions has [15:15, 14:14, 12:12]
    • Ohpm version 5.0.13
    • Node version v22.14.0
    • Hvigorw binary at /Applications/DevEco-Studio.app/Contents/tools/hvigor/bin/hvigorw

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/jianguo/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • ANDROID_HOME = /Users/jianguo/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231)
    • All Android licenses accepted.

[!] Xcode - develop for iOS and macOS (Xcode 14.3.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 14E300c
    ! Flutter recommends a minimum Xcode version of 15.
      Download the latest version or update via the Mac App Store.
    • CocoaPods version 1.16.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2022.3)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231)

[✓] VS Code (version 1.98.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.106.0

[✓] Connected device (5 available)
    • 127.0.0.1:5555 (mobile)         • 127.0.0.1:5555        • ohos-arm64     • Ohos OpenHarmony-5.0.4.150 (API 16)
    • 192.168.1.16:41667 (mobile)     • 192.168.1.16:41667    • ohos-arm64     • Ohos OpenHarmony-5.0.4.150 (API 16)
    • macOS (desktop)                 • macos                 • darwin-arm64   • macOS 13.4.1 22F82 darwin-arm64
    • Mac Designed for iPad (desktop) • mac-designed-for-ipad • darwin         • macOS 13.4.1 22F82 darwin-arm64
    • Chrome (web)                    • chrome                • web-javascript • Google Chrome 135.0.7049.42

Attempting to reach github.com...⣯

Flutter 命令

指令名称	指令描述	使用说明
医生	环境检测	颤动医生
配置	环境配置	颤动配置——
创造	總計	Flutter 创建 --平台 ohos、android、ios --org
创造	创建模块模板	flutter create -t module <模块名称>
创造	创建插件模板	flutter create -t plugin --platforms ohos,android,ios <plugin_name>
创造	创建plugin_ffi模板	flutter create -t plugin_ffi --platforms ohos,android,ios <插件名称>
设备	已连接设备	Flutter 设备
安装	应用安装	Flutter 安装 -d<hap 文件路径>
集合	资源打包	Flutter 组装
建造	测试应用程序构建	Flutter 构建 hap --debug [--target-platform ohos-arm64]
建造	正式应用构建	Flutter 构建 hap --release [--target-platform ohos-arm64]
跑步	运行	颤动运行
附	调试模式	颤动附着
截屏	截屏	Flutter 截图
酒吧	添加依赖	Flutter pub 获取
干净的	清晰的项目依赖	扑动清洁
缓存	缓存数据丢失	Flutter Pub 缓存清理

Flutter 三角库适配进度

具体可查看

https://gitcode.com/openharmony-sig/flutter_packages#openharmony%E5%B9%B3%E5%8F%B0%E5%B7%B2%E5%85%BC%E5%AE%B9%E5%BA%93

坚果派

鸿蒙派由坚果等热联合创作，其他领域的三十余位万粉博主运营。重点分享的技术包括 HarmonyOS/OpenHarmony，ArkUI-X，元服务，AI，仓颉，BlueOS 网络、团队成员聚集在北京、上海、广州、深圳、南京、杭州、苏州、宁夏等地。聚焦“鸿蒙近应用”、“智能物联”和“AI”赋能”、“人工智能”四大业务领域，依托华为开发者专家等强大的技术团队，以及主题需求、开发、测试、运维于一体的综合服务体系，赋能文旅、媒体、社交、家居、消费电子等行业客户，满足社区客户数字化升级转型的需求，帮助客户实现价值提升。目前架鸿蒙中断应用18款，三方库56个。