Flutter 三方库鸿蒙化实战:shared_preferences 从接入到适配全流程

本文以 shared_preferences(Flutter 官方轻量级存储库)为例,完整覆盖 OpenHarmony/HarmonyOS 下三方库的接入、适配、排查与工具结合实践,全程将 DevEco Studio、FVM 等工具融入实操步骤,同时对比 pub.dev 原生库OpenHarmony TPC 适配库 的差异,提供可直接落地的操作指南,避免工具与实操割裂。

一、核心背景与环境搭建(工具实操嵌入)

1. 选库理由

- shared_preferences 是 Flutter 官方推荐的键值对存储库,覆盖 90%+ 轻量存储场景(用户配置、缓存、登录态等)。

- 已在 OpenHarmony TPC 社区仓库 完成适配(`shared_preferences_ohos`),同时 pub.dev 原生版 可通过改造支持鸿蒙,适配逻辑通用,可迁移至其他三方库。

2. 工具准备与搭建(全程实操,不单独输出)

本次实战需用到 DevEco Studio、FVM、Flutter-OH SDK 等工具,所有工具操作均嵌入环境搭建步骤,确保每一步可落地:

第一步:安装并配置 DevEco Studio(鸿蒙开发核心工具)

1. 下载 DevEco Studio 6.0.2+ 版本(官网地址:https://developer.harmonyos.com/cn/develop/deveco-studio/),安装时勾选「HarmonyOS SDK」,并选择安装 API 10+ 版本(鸿蒙原生能力依赖此 API 版本)。

2. 安装完成后,打开 DevEco Studio,进入「Settings」→「Appearance & Behavior」→「System Settings」→「HarmonyOS SDK」,确认 SDK 路径已配置,且 API 10 相关组件全部安装(若未安装,点击「Apply」完成安装)。

第二步:安装并配置 FVM(多版本 Flutter 管理工具,避免环境冲突)

1. 打开终端(Windows 用命令提示符,macOS/Linux 用终端),执行命令安装 FVM:


# macOS/Linux 命令 dart pub global activate fvm # Windows 命令(需提前安装 Chocolatey) choco install fvm

2. 安装完成后,验证 FVM 是否可用,执行命令 fvm --version,若输出 3.0.0+ 版本号,说明安装成功。

3. 安装并配置 Flutter-OH 版本(鸿蒙特供 Flutter 分支),执行以下终端命令,全程用 FVM 管理版本,避免与原生 Flutter 冲突:


# 安装 Flutter-OH 3.27.0 版本(适配 API 10,稳定性最佳) fvm install 3.27.0 # 进入 FVM 安装目录,克隆鸿蒙适配的 Flutter 分支 cd ~/fvm/versions/3.27.0 git clone -b oh-3.27.4-dev https://gitcode.com/openharmony/flutter.git

4. 配置环境变量,将 Flutter-OH 和鸿蒙 HDC 工具路径加入系统环境(确保后续命令可直接执行):


# macOS/Linux 配置(编辑 ~/.bash_profile 或 ~/.zshrc) export FLUTTER_HOME=~/fvm/versions/3.27.0/flutter export PATH=$PATH:$FLUTTER_HOME/bin:$HDC_HOME # Windows 配置(右键「此电脑」→「属性」→「高级系统设置」→「环境变量」) # 新增 FLUTTER_HOME 变量,值为 C:\fvm\versions\3.27.0\flutter # 在 Path 变量中添加 %FLUTTER_HOME%\bin 和 %HDC_HOME%(HDC 为鸿蒙 SDK toolchains 路径)

第三步:验证环境(结合 DevEco Studio 和终端工具)

1. 打开 DevEco Studio,启动鸿蒙模拟器(点击顶部「模拟器」按钮,选择 API 10 版本的模拟器,等待启动完成)。

2. 终端执行命令 flutter devices,若输出鸿蒙模拟器信息(标注 ohos),说明 Flutter-OH 与鸿蒙模拟器适配成功;同时在 DevEco Studio 中查看模拟器状态,确保模拟器正常运行。

二、实战一:接入 OpenHarmony TPC 适配版 `shared_preferences_ohos`(工具全程融入)

本实战全程结合 FVM、DevEco Studio 操作,实现从项目创建到运行验证的全流程,工具操作与实操步骤深度绑定,不单独输出工具使用说明。

1. 用 FVM 新建 Flutter-OH 项目

1. 终端执行命令,用 FVM 切换到已安装的 Flutter-OH 版本,避免版本冲突:


fvm use 3.27.0

2. 执行命令新建 Flutter-OH 项目,指定平台为 ohos,确保项目默认适配鸿蒙:


flutter create --platforms=ohos my_ohos_storage cd my_ohos_storage

3. 用 DevEco Studio 打开项目:打开 DevEco Studio,点击「Open Project」,选择新建的 my_ohos_storage 项目中的「android」目录(鸿蒙模块默认关联此目录),等待项目同步完成(底部同步进度条消失即可)。

2. 添加 TPC 适配库依赖(结合 DevEco Studio 编辑配置)

1. 在 DevEco Studio 中,找到项目根目录下的 `pubspec.yaml` 文件,双击打开编辑(DevEco Studio 支持 yaml 语法高亮,可快速排查语法错误)。

2. 在 `dependencies` 节点下添加 TPC 适配库依赖,两种方式可选择(推荐第一种,稳定且适配鸿蒙),编辑完成后保存文件:


name: my_ohos_storage description: A Flutter OHOS storage demo. version: 1.0.0+1 environment: sdk: '>=3.2.0 <4.0.0' flutter: '>=3.27.0' dependencies: flutter: sdk: flutter # 方式1:直接引用 TPC 适配库(推荐,稳定,已适配鸿蒙) shared_preferences_ohos: ^0.1.2 # 方式2:引用 Git 仓库(最新版,适合需要最新功能的场景) # shared_preferences: # git: # url: "https://gitcode.com/openharmony-sig/flutter_packages.git" # path: "packages/shared_preferences/shared_preferences" cupertino_icons: ^1.0.6 dev_dependencies: flutter_test: sdk: flutter flutter_lints: ^3.0.0 flutter: uses-material-design: true

3. 终端执行命令,安装依赖(也可点击 DevEco Studio 顶部「Pub get」按钮,快速安装依赖):


flutter pub get

4. 依赖安装完成后,在 DevEco Studio 中查看「External Libraries」,确认 `shared_preferences_ohos` 已成功引入,无报错提示。

3. 核心代码实现(用 DevEco Studio 编写与调试)

1. 在 DevEco Studio 中,找到 `lib/main.dart` 文件,双击打开,编写存储/读取/删除/清除功能代码(DevEco Studio 支持 Dart 语法提示、错误校验,可快速定位代码问题):


import 'package:flutter/material.dart'; import 'package:shared_preferences_ohos/shared_preferences_ohos.dart'; void main() => runApp(const MyApp()); class MyApp extends StatefulWidget { const MyApp({super.key}); @override State<MyApp> createState() => _MyAppState(); } class _MyAppState extends State<MyApp> { final TextEditingController _keyController = TextEditingController(); final TextEditingController _valueController = TextEditingController(); String _result = "未操作"; // 存储字符串 Future<void> _setString() async { final prefs = SharedPreferencesOhos.getInstance(); final key = _keyController.text.trim(); final value = _valueController.text.trim(); if (key.isEmpty || value.isEmpty) { setState(() => _result = "键/值不能为空"); return; } final success = await prefs.setString(key, value); setState(() => _result = success ? "存储成功" : "存储失败"); } // 读取字符串 Future<void> _getString() async { final prefs = SharedPreferencesOhos.getInstance(); final key = _keyController.text.trim(); final value = await prefs.getString(key); setState(() => _result = "读取结果:${value ?? "null"}"); } // 删除键值对 Future<void> _remove() async { final prefs = SharedPreferencesOhos.getInstance(); final key = _keyController.text.trim(); final success = await prefs.remove(key); setState(() => _result = success ? "删除成功" : "删除失败"); } // 清除所有数据 Future<void> _clear() async { final prefs = SharedPreferencesOhos.getInstance(); final success = await prefs.clear(); setState(() => _result = success ? "清除成功" : "清除失败"); } @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar(title: const Text("OHOS 存储 Demo")), body: Padding( padding: const EdgeInsets.all(16.0), child: Column( children: [ TextField(controller: _keyController, decoration: const InputDecoration(labelText: "键")), TextField(controller: _valueController, decoration: const InputDecoration(labelText: "值")), const SizedBox(height: 20), Row(mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: [ ElevatedButton(onPressed: _setString, child: const Text("存储")), ElevatedButton(onPressed: _getString, child: const Text("读取")), ]), const SizedBox(height: 10), Row(mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: [ ElevatedButton(onPressed: _remove, child: const Text("删除")), ElevatedButton(onPressed: _clear, child: const Text("清除")), ]), const SizedBox(height: 20), Text(_result, style: const TextStyle(fontSize: 16, color: Colors.blue)), ], ), ), ), ); } }

2. 代码编写完成后,点击 DevEco Studio 顶部「Format Code」按钮,格式化代码,确保代码规范;同时检查代码中是否有报错(红色波浪线),若有报错,根据提示修正(如依赖未引入、语法错误等)。

4. 运行与验证(结合 DevEco Studio 模拟器与终端)

1. 确保 DevEco Studio 中的鸿蒙模拟器已启动(若未启动,点击顶部「模拟器」按钮启动,等待模拟器完全加载)。

2. 终端执行运行命令,指定运行平台为 ohos,也可直接点击 DevEco Studio 顶部「Run」按钮(绿色三角形),选择鸿蒙模拟器运行:


flutter run -d ohos # 若有多个模拟器,可指定模拟器 ID:flutter run -d ohos-xxxx

3. 运行成功后,模拟器会显示 OHOS 存储 Demo 界面,操作步骤:输入键值 → 点击「存储」→ 点击「读取」,验证数据持久化;同时在 DevEco Studio 底部「Log」面板,可查看运行日志,若有异常,可通过日志定位问题。

三、实战二:适配 pub.dev 原生 `shared_preferences` 到鸿蒙(工具实操融入)

若需使用 pub.dev 最新版 `shared_preferences`,需通过 MethodChannel 封装鸿蒙原生能力,全程结合 DevEco Studio 编写原生代码、调试,FVM 管理环境,确保适配流程可落地。

1. 依赖配置(用 DevEco Studio 编辑 pubspec.yaml)

1. 在 DevEco Studio 中打开 `pubspec.yaml` 文件,修改依赖配置,引用 pub.dev 原生库并添加系统服务依赖,编辑完成后保存,点击「Pub get」安装依赖:


dependencies: flutter: sdk: flutter shared_preferences: ^2.2.2 # pub.dev 原生库 flutter/services.dart # 系统服务,用于 MethodChannel 通信

2. Dart 层封装(MethodChannel)(用 DevEco Studio 编写代码)

1. 在 DevEco Studio 中,右键点击 `lib` 目录,选择「New」→「Dart File」,创建 `ohos_storage_channel.dart` 文件,编写 MethodChannel 封装代码,实现与鸿蒙原生层的通信:


import 'package:flutter/services.dart'; class OHOSStorageChannel { // 定义 Channel 名称(需与鸿蒙原生层一致,避免通信失败) static const _channel = MethodChannel('com.ohos.storage.preferences'); // 存储字符串 static Future<bool> setString(String key, String value) async { try { return await _channel.invokeMethod('setString', {'key': key, 'value': value}); } on PlatformException catch (e) { print("存储失败:${e.message}"); return false; } } // 读取字符串 static Future<String?> getString(String key) async { try { return await _channel.invokeMethod('getString', {'key': key}); } on PlatformException catch (e) { print("读取失败:${e.message}"); return null; } } // 删除键值对 static Future<bool> remove(String key) async { try { return await _channel.invokeMethod('remove', {'key': key}); } on PlatformException catch (e) { print("删除失败:${e.message}"); return false; } } // 清除所有 static Future<bool> clear() async { try { return await _channel.invokeMethod('clear'); } on PlatformException catch (e) { print("清除失败:${e.message}"); return false; } } }

3. 鸿蒙原生层实现(ETS)(用 DevEco Studio 编写原生代码)

1. 在 DevEco Studio 中,找到鸿蒙模块 `entry/src/main/ets` 目录,右键点击该目录,选择「New」→「TypeScript File」,创建 `PreferencesHelper.ts` 文件,编写鸿蒙原生 Preferences 操作代码:


import { preferences } from '@ohos.data.preferences'; import { hilog } from '@ohos.hilog'; // 日志标签(用于 DevEco Studio 日志过滤,方便排查问题) const TAG = 'OHOS_Storage'; // 偏好存储名称(全局唯一,避免与其他应用冲突) const PREFERENCES_NAME = 'flutter_ohos_storage'; // 初始化偏好存储(确保每次操作前初始化,避免空指针异常) async function getPreferences() { return await preferences.getPreferences(globalThis.context, PREFERENCES_NAME); } // 注册 MethodChannel 方法(与 Dart 层 Channel 名称一致,实现通信) export function registerStorageChannel(registrar: any) { const channel = registrar.methodChannel('com.ohos.storage.preferences'); // 处理 Dart 层调用的方法 channel.setMethodCallHandler(async (call: any, result: any) => { const prefs = await getPreferences(); switch (call.method) { case 'setString': const key = call.arguments['key']; const value = call.arguments['value']; await prefs.put(key, value); await prefs.flush(); result.success(true); break; case 'getString': const getKey = call.arguments['key']; const resultValue = await prefs.get(getKey, ''); result.success(resultValue); break; case 'remove': const removeKey = call.arguments['key']; await prefs.delete(removeKey); await prefs.flush(); result.success(true); break; case 'clear': await prefs.clear(); await prefs.flush(); result.success(true); break; default: result.error('Unsupported method', call.method, null); break; } }); }

2. 注册原生插件(在 DevEco Studio 中修改入口文件):找到 `entry/src/main/ets/MainAbility/MainAbility.ts` 文件,双击打开,导入并注册存储 Channel,确保 Dart 层能正常调用原生方法:


import { registerStorageChannel } from '../PreferencesHelper'; import { hilog } from '@ohos.hilog'; const TAG = 'MainAbility'; export default class MainAbility extends Ability { onCreate(want, launchParam) { // 注册存储 Channel(关键步骤,未注册会导致 MethodChannel 调用失败) registerStorageChannel(this.registrar); hilog.info(0x0000, TAG, 'MainAbility onCreate'); } }

4. 替换 Dart 层调用(用 DevEco Studio 修改代码)

1. 打开 `lib/main.dart` 文件,替换原有导入和方法实现,使用自定义 Channel 替代原生库,修改完成后格式化代码,检查无报错:


// 替换原有导入(注释掉 TPC 适配库,引入自定义 Channel) // import 'package:shared_preferences_ohos/shared_preferences_ohos.dart'; import 'ohos_storage_channel.dart'; // 替换存储方法实现(其他方法类似,统一替换为自定义 Channel 调用) Future<void> _setString() async { final key = _keyController.text.trim(); final value = _valueController.text.trim(); if (key.isEmpty || value.isEmpty) { setState(() => _result = "键/值不能为空"); return; } final success = await OHOSStorageChannel.setString(key, value); setState(() => _result = success ? "存储成功" : "存储失败"); }

5. 运行验证(结合 DevEco Studio 与终端)

1. 确保鸿蒙模拟器已启动,在 DevEco Studio 中点击「Run」按钮,或终端执行 `flutter run -d ohos`,运行项目。

2. 若运行失败,打开 DevEco Studio 底部「Log」面板,过滤「OHOS_Storage」标签,查看报错信息(如 Channel 未注册、原生代码报错等),根据日志提示修正问题;运行成功后,验证与实战一一致的功能,确保数据存储正常。

四、常见问题与排查(结合工具实操解决)

以下问题均结合 DevEco Studio、终端、FVM 等工具排查解决,避免单纯描述问题,重点体现工具在排查中的作用:

问题现象

原因分析

工具排查与解决方案

运行时出现 MissingPluginException

原生插件未注册/依赖未正确安装

1. 用终端执行 `flutter clean && flutter pub get`,清除缓存并重新安装依赖;2. 在 DevEco Studio 中检查 `MainAbility.ts` 文件,确认 Channel 已注册;3. 检查 `pubspec.yaml` 文件,确保依赖路径正确(OHOS 插件需本地路径时,用 DevEco Studio 编辑路径)。

数据读取为 null

1. 写入未 await;2. 键名不一致;3. 未初始化 Preferences

1. 在 DevEco Studio 中检查 Dart 代码,确保存储操作加 `await`;2. 统一键名常量,避免拼写错误;3. 在 DevEco Studio 中查看 `PreferencesHelper.ts`,确认 `getPreferences()` 方法在调用前已执行,可添加日志打印(用 hilog 输出),在 Log 面板查看初始化状态。

构建失败(hvigor 路径错误)

依赖使用 git 地址,OHOS 要求本地路径

1. 在 DevEco Studio 中编辑 `pubspec.yaml`,将 git 依赖改为本地 path;2. 示例配置:shared_preferences: path: packagesshared_preferences/shared_preferences;3. 编辑完成后,点击「Pub get」重新安装依赖,在 DevEco Studio 中查看依赖是否正常引入。

权限不足,存储失败

鸿蒙设备/模拟器需授予存储权限

1. 在 DevEco Studio 中找到 `module.json5` 文件,双击打开,在「abilities」节点下添加权限:"permissions": ["ohos.permission.WRITE_USER_KITS"];2. 保存文件后,重新运行项目,模拟器会弹出权限申请提示,点击允许即可。

版本冲突,构建失败

Flutter-OH 与库版本不兼容

1. 用 FVM 切换到推荐版本(`fvm use 3.27.0`),锁定 Flutter 版本;2. 在 DevEco Studio 中编辑 `pubspec.yaml`,使用 TPC 适配库并固定版本(如 shared_preferences_ohos ^0.1.2);3. 终端执行 `flutter pub get`,重新安装依赖,排查版本冲突。

五、工具结合进阶实践(深度融入实操)

1. FVM 多版本管理(实战场景应用)

在实际开发中,不同项目可能依赖不同版本的 Flutter-OH,用 FVM 可快速切换版本,避免环境冲突,具体操作融入项目开发流程:

1. 新增项目时,用 FVM 安装对应版本的 Flutter-OH:`fvm install 3.28.0`(适配 API 11)。

2. 切换项目版本:进入项目目录,执行 `fvm use 3.28.0`,即可将当前项目切换到指定版本,终端执行 `fvm list` 可查看已安装版本,确认当前使用版本。

3. 全局版本设置:若多个项目使用同一版本,执行 `fvm global 3.27.0`,设置全局默认版本,减少切换操作。

2. DevEco Studio 调试技巧(提升排查效率)

1. 原生代码调试:在 DevEco Studio 中,在 `PreferencesHelper.ts` 中需要调试的行点击左侧,设置断点,然后点击顶部「Debug」按钮(虫子图标),运行项目,程序会在断点处暂停,可逐步调试,查看变量值、调用流程。

2. 日志过滤:在 DevEco Studio 底部「Log」面板,输入过滤条件(如 TAG 为 OHOS_Storage),可快速筛选出目标日志,排除无关日志干扰,快速定位问题。

3. 代码跳转:在 DevEco Studio 中,按住 Ctrl 键(macOS 按 Command 键),点击代码中的类、方法,可快速跳转到定义处,方便查看源码、修改代码。

3. 鸿蒙 SDK 与库版本兼容(工具辅助校验)

1. 在 DevEco Studio 中,进入「Settings」→「HarmonyOS SDK」,可查看当前安装的 SDK 版本,根据项目需求切换 API 版本(如 API 10/11)。

2. 结合 FVM 管理 Flutter-OH 版本,确保 Flutter-OH 版本与鸿蒙 SDK 版本兼容,具体兼容关系如下:

鸿蒙 API 版本

推荐 Flutter-OH 版本

适配库版本

API 10

3.27.0+(用 FVM 安装)

shared_preferences_ohos ^0.1.2

API 11

3.28.0+(用 FVM 安装)

OpenHarmony TPC 仓库最新适配库

六、选型对比:TPC 适配库 vs pub 原生库(结合工具使用体验)

对比维度

OpenHarmony TPC 适配库

pub.dev 原生库

API 一致性

100% 与原生一致,无需改造,用 DevEco Studio 编辑代码时可直接复用原有逻辑

需通过 MethodChannel 封装,需在 DevEco Studio 中编写原生代码,API 需重新适配

开发效率

开箱即用,10 分钟接入,结合 DevEco Studio 的 Pub get 功能,快速完成依赖安装

需编写原生代码(ETS/Java),在 DevEco Studio 中调试原生与 Dart 层通信,开发周期长

稳定性

社区维护,适配鸿蒙最佳实践,在 DevEco Studio 中运行时报错少,日志清晰

无官方鸿蒙支持,存在兼容性风险,需在 DevEco Studio 中反复调试排查冲突

维护成本

低(社区持续更新),用 FVM 锁定版本后,无需频繁适配,DevEco Studio 可快速同步依赖

高(需自行维护原生层),鸿蒙 SDK 升级后,需在 DevEco Studio 中修改原生代码,重新调试

工具适配性

完美适配 DevEco Studio、FVM,依赖安装、代码调试、运行验证均流畅,无额外配置

需手动配置 MethodChannel、注册原生插件,在 DevEco Studio 中需额外配置原生模块,工具操作繁琐

七、总结

本文以 shared_preferences 为例,将 DevEco Studio、FVM 等工具全程融入 Flutter 三方库鸿蒙化实操,从环境搭建、项目创建、代码编写、运行验证到问题排查,实现工具与实操的深度绑定,避免工具单独输出。实际开发中,优先选择 OpenHarmony TPC 适配库,可大幅提升开发效率,减少工具配置和调试成本;若需使用 pub.dev 原生库,需借助 DevEco Studio 完成原生层封装和调试,结合 FVM 管理环境,确保适配流程顺畅。

Logo

开源鸿蒙跨平台开发社区汇聚开发者与厂商,共建“一次开发,多端部署”的开源生态,致力于降低跨端开发门槛,推动万物智联创新。

更多推荐