第一個flutter插件的發布(leleping)

前言

用flutter開發時間也不短了,在開發過程當中不可避免的會用到插件包package,之前也進行過把第三方的插件下載下來然后修改發布到自己倉庫上的操作,但由于這一次沒有找到相應的插件,于是自己根據需求在https://pub.dartlang.org/上發布了自己的第一款插件,僅做記錄,供大家參考。

過程

先說需求,需求很簡單。我們想通過ping和traceroute的原理,對指定域名進行網絡診斷,并收集診斷日志。
關于這塊已經有很成熟的框架供我們使用,在這里感謝網易電商團隊的開源框架https://github.com/Lede-Inc/LDNetDiagnoService_IOS,分別有iOS和安卓的實現。
所以我們要做的就是開發一個能夠實現flutter與原生端交互的插件,原生端的代碼實現就是借助LDNetDiagnoService框架來實現

1.創建 package

自己創建一個文件夾,在終端cd到指定文件夾。
執行命令

flutter create --org com.example --template=plugin hello
  • --org 您組織的標識,用反向域名表示法。該值用于生成的Android和iOS代碼中的各種包和包標識符。
  • plugin xxxx 是您插件的名字 我這里用了leleping
  • 默認情況下,插件項目針對iOS代碼使用Objective-C,Android代碼使用Java。如果您更喜歡Swift或Kotlin,則可以使用-i 或 -a 為iOS或Android指定語言。例如:
flutter create --template=plugin -i swift -a kotlin hello

命令執行完后會在hello/文件夾下創建一個具有以下專用內容的插件工程(區別于新建的flutter工程):

  • lib/hello.dart:
    插件包的Dart API.
  • android/src/main/java/com/yourcompany/?hello/HelloPlugin.java:
    插件包API的Android實現.
  • ios/Classes/HelloPlugin.m:
    插件包API的ios實現.
  • example/:
    一個依賴于該插件的Flutter應用程序,來說明如何使用它(寫代碼調試是在這個文件夾下操作的)

2.0實現包 package

由于插件包中包含用多種編程語言編寫的多個平臺的代碼,因此需要一些特定的步驟來確保順暢的體驗。

  • 定義包API(.dart)
    插件包的API在Dart代碼中定義。打開主文件夾hello/ 。找到lib/hello.dart。在里面定義我們想要暴露出來的api。
  • 添加Android平臺代碼(.java / .kt)
    在Android Studio中編輯Android平臺代碼之前,首先確保代碼至少已經構建過一次(用AS在安卓模擬器或者真機上run一次)然后:
    1.啟動Android Studio
    2.在’Welcome to Android Studio’對話框選擇 ‘Import project’, 或者在菜單欄 ‘File > New > Import Project…‘,然后選擇hello/example/android/build.gradle文件.
    3.在’Gradle Sync’ 對話框, 選擇 ‘OK’.
    4.在’Android Gradle Plugin Update’ 對話框, 選擇 ‘Don’t remind me again for this project’.
    您插件的Android平臺代碼位于 hello/java/com.yourcompany.hello/?HelloPlugin.

您可以通過按下 ? 按鈕從Android Studio運行示例應用程序.

  • 添加iOS平臺代碼 (.h+.m/.swift)
    在編輯Xcode中的iOS平臺代碼之前,首先確保代碼至少已經構建過一次(例如,從Xcode中運行示例應用程序或終端執行cd hello/example; flutter build ios --no-codesign)。然后:
    1.啟動 Xcode
    2.選擇 ‘File > Open’, 然后選擇 hello/example/ios/Runner.xcworkspace 文件.
    您插件的iOS平臺代碼位于Pods/DevelopmentPods/hello/Classes/中。
    調試可以執行運行xcode來打斷點調試。
    tip:一般的插件只需要在.m文件中添加原生代碼即刻。這次我因為需要集成網易的ping框架,用法和正常iOS項目一樣,直接用pod集成即可。
  • 連接API和平臺代碼
    最后,您需要將用Dart代碼編寫的API與平臺特定的實現連接起來。這是通過platform channels完成的。這篇文章主要講插件,platform相關內容還請自行查閱。

3.0發布 packages

到了這里我們我們基本上就可以發布我們自己寫的插件到官方平臺Pub了。里面的一些文檔設置我會在文章底部貼出來鏈接,這里講主要流程。

在發布之前,檢查pubspec.yamlREADME.md以及CHANGELOG.md文件,以確保其內容的完整性和正確性。

首先運行 dry-run 命令以查看是否都準備OK了:

flutter packages pub publish --dry-run

如果遇見什么問題,照著錯誤提示去修改即可
當提示都ok的時候,我們就可以完成最后一步的發布了。執行

flutter packages pub publish

他會檢查你的文件結構,終端會提示:

Looks great! Are you ready to upload your package (y/n)? 

當你輸入y的時候會讓你進行google賬號的授權認證

Pub needs your authorization to upload packages on your behalf.
In a web browser, go to https://accounts.google.com/o/oauth2/auth?access_type=offline&approval_prompt=force&response_type=code&client_id=818368855108-8grd2eg9tj9f38os6f1urbcvsq399u8n.apps.googleusercontent.com&redirect_uri=http%3A%2F%2Flocalhost%3A55274&scope=https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fuserinfo.email
Then click "Allow access".

帶上梯子,按照提示完成認證后既可以等著終端上傳即可。

Waiting for your authorization...
Authorization received, processing...
Successfully authorized.
Uploading...
Successfully uploaded package.

到此全部過程已經完成,就闊以去官網去搜索你剛剛的插件啦。Pub

最后的最后提示leleping插件的地址,需要的小伙伴自行引用。

參考鏈接

https://flutterchina.club/developing-packages/

https://github.com/Lede-Inc/LDNetDiagnoService_IOS

?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 228,646評論 6 533
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,595評論 3 418
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 176,560評論 0 376
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,035評論 1 314
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,814評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,224評論 1 324
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,301評論 3 442
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,444評論 0 288
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 48,988評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,804評論 3 355
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,998評論 1 370
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,544評論 5 360
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,237評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,665評論 0 26
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,927評論 1 287
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,706評論 3 393
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,993評論 2 374

推薦閱讀更多精彩內容