HarmonyOS next之Flutter插件支持鴻蒙系統(tǒng)實踐
問題
Flutter Plugin主要用來橋接原生代碼往声，調(diào)用原生系統(tǒng)SDK， 比如拍照戳吝，選擇相冊浩销，文件選擇等。
目前 [pub.dev/]中的插件听哭，都沒有對鴻蒙系統(tǒng)的支持慢洋，不過鴻蒙現(xiàn)在也做了部分常用第三方插件的支持(例如：[gitee.com/openharmony…] 如果鴻蒙官方做了，我們可以直接使用陆盘，但是會存在不少插件普筹，鴻蒙官方來不及做或者優(yōu)先級比較低，但是我們的項目中又需要隘马，這就要求我們要學(xué)會在已有插件的基礎(chǔ)上新增支持鴻蒙系統(tǒng)原生代碼太防。
搭建環(huán)境(macOS M2為例)
下載鴻蒙支持的Flutter
下載結(jié)束之后切換到dev分支；鴻蒙針對Flutter的支持酸员，是在基于的官方Flutter版本3.7.12上修改的蜒车，總體來說，這個版本穩(wěn)定性比較高幔嗦。然后就是配置Flutter命令行環(huán)境變量酿愧，把Flutter命令行指向鴻蒙支持的Flutter版本。保證在終端可以正常執(zhí)行flutter doctor -v命令邀泉。
當(dāng)然更加建議使用[fvm]來管理Flutter版本嬉挡，可以把鴻蒙支持的Flutter版本代碼git clone到fvm管理目錄的versions文件夾下钝鸽，并flutter_flutter改名為3.7.12-ohos
這樣就可以直接使用fvm global 3.7.12-ohos 命令在切換本地不同的Flutter版本了
下載鴻蒙開發(fā)工具和配置環(huán)境變量
我這邊目前下載的DevEco Studio版本是5.0.3.502, 大家可以下載最新版本就行。
commandline-tools(可選):commandline-tools-mac-arm64-5.0.3.404.zip棘伴， 最新的DevEco開發(fā)工具內(nèi)部其實已經(jīng)包含了commandline-tools工具集
配置環(huán)境變量
export TOOL_HOME=/Applications/DevEco-Studio.app/Contents # mac環(huán)境 export DEVECO_SDK_HOME=$TOOL_HOME/sdk # command-line-tools/sdk export PATH=$TOOL_HOME/tools/ohpm/bin:$PATH # command-line-tools/ohpm/bin export PATH=$TOOL_HOME/tools/hvigor/bin:$PATH # command-line-tools/hvigor/bin export PATH=$TOOL_HOME/tools/node/bin:$PATH # command-line-tools/tool/node/bin
如何在已有插件中新增鴻蒙系統(tǒng)支持
舉一個例子寞埠，在Flutter中，我們想把圖片保存到相冊焊夸，一般會到這個庫image_gallery_saver仁连，現(xiàn)在我們期望這個庫也支持在鴻蒙系統(tǒng)中把圖片保存到相冊中。
我這邊建議使用以下步驟
fork源碼
fork一下源碼阱穗，fork結(jié)束之后饭冬，代碼就到自己賬號下的倉庫中，我操作結(jié)束之后的[地址]揪阶。
clone到本地
git clone https://github.com/zingwin/image_gallery_saver
新增ohos插件
執(zhí)行以下命令(不推薦)昌抠，表明在已存在的插件中新增鴻蒙系統(tǒng)。
flutter create -t plugin *--platforms ohos*
但是有些項目可能改過名或者以下配置鲁僚，執(zhí)行失敗也沒有關(guān)系炊苫，而且個人也不太建議按照以上方式新增插件，因為他會給iOS和Android也生成部分代碼冰沙，以及插件接口代碼侨艾，對之前的插件項目有一定程度的干擾，不嫌麻煩的話拓挥，直接刪除也行唠梨。
【推薦】更推薦的做法是在一個空目錄執(zhí)行創(chuàng)建插件命令
flutter create -t plugin *--platforms ohos,ios,android image_gallery_saver*
上面的命令會生成一個全新的插件当叭，里面包含了iOS,android, ohos文件夾，代表插件支持的平臺原生代碼蚁鳖。然后把生成兩個的ohos文件夾復(fù)制到原項目（第2步）中對應(yīng)的目錄糠雨，一定別搞錯了。
修改pubspes.yaml文件
使用Android Studio打開第二步中clone的項目琅攘。雙擊pubspes.yaml文件松邪。
新增ohos插件支持坞琴。其中的package可以同android的package,
pluginClass: 不要填錯了。一般情況都是這個目錄中可以找到（image_gallery_saver``/ohos/src/main/ets/components/plugin/ImageGallerySaverPlugin.ets）逗抑。
ohos:
package: com.example.image_gallery_saver
pluginClass: ImageGallerySaverPlugin
執(zhí)行Flutter pub get
接下來剧辐，就可以執(zhí)行flutter pub get寒亥，成功之后鏈接鴻蒙模擬器或者鴻蒙系統(tǒng)真機(jī)執(zhí)行flutter run進(jìn)行調(diào)試了
準(zhǔn)備鴻蒙插件代碼
接下來使用DevEco打開example/ohos下面的鴻蒙項目。
進(jìn)入oh_modules目錄下荧关，找到剛生產(chǎn)的插件原生代碼溉奕，目前可以在這編輯代碼，但是記住忍啤，這個目前每次flutter run都會重新生成加勤，請確保編輯的代碼及時同步到image_gallery_saver``/ohos/src/main/ets/components/plugin/目錄中未檩，不然可能會變成消失的代碼戴尸。
因為oh_modules目錄下面得代碼就鴻蒙項目存放第三方模塊的目錄，flutter run每次執(zhí)行都會覆蓋這里面的代碼冤狡。
比如我目前寫完代碼孙蒙，會使用以下命令把代碼自動復(fù)制到插件的真實目錄
cp *.ets /個人目錄前綴/image_gallery_saver/ohos/src/main/ets/components/plugin/
相信在未來的版本中，鴻蒙官方會解決這個問題悲雳。
上圖中我們可以看到生成到的鴻蒙插件代碼怜奖，并且在插件中還實現(xiàn)了getPlatformVersion默認(rèn)方法。
另外一個細(xì)節(jié)翅阵，請確保鴻蒙插件中的MethodChannel和Flutter側(cè)中的MethodChannel字符串一致滥崩。
開始編寫插件代碼
發(fā)現(xiàn)這個插件就兩個方法
static FutureOr<dynamic> saveImage(Uint8List imageBytes,
{int quality = 80,
String? name,
bool isReturnImagePathOfIOS = false})
static Future saveFile(String file,
{String? name, bool isReturnPathOfIOS = false})
我們參考其他平臺，取插件接口參數(shù)讹语，然后做相應(yīng)的邏輯
git push
修改完之后，把代碼push到自己的git倉庫
使用插件
把image_gallery_saver這個庫短条，指向我們自己的地址即可才菠，就是第1步fork之后的地址赋访。
image_gallery_saver:
git:
url: https://gitee.com/openharmony-sig/flutter_flutter.git
ref: 431cf6867ba533770292f2e42305e58a8474b0ae
總結(jié)
以上就是在已有Flutter插件中新增鴻蒙系統(tǒng)支持的大致流程。
