功能概述
Flutter 海外版的 UIKit 支持鸿蒙(HarmonyOS NEXT)平台,基于鸿蒙系统支持的 Flutter 3.22 版本开发。
环境要求
环境 | 版本 |
Flutter |
源码集成
1. 从 Github 上下载 UIKit 源码,让组件与自己的工程文件夹同级,例如:

2. 在项目根目录中(如示例中的 MyApplication)创建鸿蒙平台。
flutter create --platforms ohos .# OR (using FVM)# fvm flutter create --platform oho .
注意:
不要忘记后面的符号点“.”,该符号指当前目录。
3. 添加 UIKit 组件以及第三方库的依赖。
在项目根目录下的 pubspec.yaml 中依赖本地的组件库如下:
dependencies:flutter:sdk: fluttertencent_cloud_chat_common:path: ../TIMCommontencent_cloud_chat_intl:path: ../TUIInternationaltencent_cloud_chat_conversation:path: ../TUIConversationtencent_cloud_chat_message:path: ../TUIMessagetencent_cloud_chat_contact:path: ../TUIContacttencent_cloud_chat_sticker:path: ../TUIEmojitencent_cloud_chat_message_reaction:path: ../TUIEmojiPlugintencent_cloud_chat_search:path: ../TUISearchtencent_cloud_chat_text_translate:path: ../TUITranslationPlugintencent_cloud_chat_sound_to_text:path: ../TUIVoiceToTextPlugintencent_cloud_chat_push: ^8.4.6667
依赖重写 UIKit 使用的且鸿蒙官方已经适配的第三方库如下:
dependency_overrides:path_provider:git:url: "https://gitee.com/openharmony-sig/flutter_packages.git"path: "packages/path_provider/path_provider"shared_preferences:git:url: "https://gitee.com/openharmony-sig/flutter_packages.git"path: "packages/shared_preferences/shared_preferences"file_picker_ohos:git:url: "https://gitee.com/openharmony-sig/fluttertpc_file_picker.git"path: "ohos"image_picker:git:url: "https://gitee.com/openharmony-sig/flutter_packages.git"path: "packages/image_picker/image_picker"permission_handler:git:url: "https://gitee.com/openharmony-sig/flutter_permission_handler.git"path: "permission_handler"video_thumbnail_ohos:git:url: "https://gitee.com/openharmony-sig/fluttertpc_video_thumbnail.git"path: "ohos"record:git:url: "https://gitee.com/openharmony-sig/fluttertpc_record.git"path: "record"audioplayers:git:url: "https://gitee.com/openharmony-sig/flutter_audioplayers.git"path: "packages/audioplayers"video_player:git:url: "https://gitee.com/openharmony-sig/flutter_packages.git"path: "packages/video_player/video_player"# extended_text 和 extended_text_field 需要替换为 Flutter 3.22 适配的版本extended_text: ^13.0.0extended_text_field: ^15.0.0
4. 由于第三方库 extended_text_field 中判断平台使用的
switch case
语句没有加 default
导致在鸿蒙上编译报错:
需要本地修改下 extended_text_field 的代码逻辑。首先找到报错的库位置,建议用 VS Code 打开 extended_text_field-15.0.0 文件夹:

搜索并替换
switch case
出现的地方。4.1 搜索框(选择正则表达式)填正则表达式:
^( +?)case TargetPlatform.android:
替换框填:
$1case TargetPlatform.android:$1case TargetPlatform.ohos:
替换后的效果:

4.2 搜索框(右边选择全字匹配)填:
TargetPlatform.android ||
替换框填:
TargetPlatform.android || TargetPlatform.ohos ||
替换后的效果:

5. 修改完后,执行下
flutter pub get
,然后再编译运行到真机上。注意:
建议使用鸿蒙系统真机测试。