Flutter插件開發(fā)指南01: 通道Channel的編寫與實現(xiàn)
視頻
https://www.bilibili.com/video/BV1ih4y1E7E3/
前言
本文將會通過一個加法計算，來實現(xiàn) Channel 的雙向通訊碟刺，讓大家有個一個體會。
Flutter插件
Flutter插件是Flutter應用程序與原生平臺之間的橋梁，使得Flutter應用程序可以與原生代碼進行交互，從而擴展Flutter應用程序的功能和能力。Flutter插件通常包括Dart和原生代碼（例如Java恩沛、Kotlin或Objective-C、Swift等）缕减，并可以通過Flutter插件框架來注冊雷客、管理和調(diào)用。
在整個Flutter架構(gòu)中桥狡，F(xiàn)lutter插件具有非常重要的作用和重要性搅裙。以下是Flutter插件在Flutter架構(gòu)中的一些重要作用：
- 擴展Flutter應用程序的功能：Flutter插件可以提供許多原生平臺的功能和能力，例如訪問原生設備API总放、訪問原生UI組件等呈宇。通過使用Flutter插件，F(xiàn)lutter應用程序可以獲得更多的功能和能力局雄，從而可以更好地滿足用戶需求甥啄。
- 提高Flutter應用程序的性能：通過使用Flutter插件，F(xiàn)lutter應用程序可以通過原生平臺API來執(zhí)行某些任務炬搭，從而可以提高應用程序的性能和響應速度蜈漓。例如，使用原生平臺的圖像處理庫來處理大量圖像數(shù)據(jù)宫盔。
- 與原生代碼進行交互：Flutter插件可以使Flutter應用程序與原生代碼之間進行雙向通信融虽，從而可以讓Flutter應用程序與原生平臺進行無縫集成。這對于需要與現(xiàn)有原生應用程序集成的Flutter應用程序來說尤為重要灼芭。
- 促進Flutter生態(tài)系統(tǒng)的發(fā)展：Flutter插件可以提供許多不同類型的功能和能力有额，例如訪問原生設備傳感器、訪問原生廣告庫等彼绷。通過將這些插件共享給其他Flutter開發(fā)者巍佑，F(xiàn)lutter插件可以促進Flutter生態(tài)系統(tǒng)的發(fā)展和壯大，使得更多的開發(fā)者能夠使用Flutter來構(gòu)建高質(zhì)量的應用程序寄悯。
Channel 通道
Channel是Flutter應用程序與原生平臺之間進行通信的橋梁萤衰。Flutter應用程序和原生平臺可以通過Channel來交換消息和數(shù)據(jù)，從而實現(xiàn)雙向通信猜旬。Flutter插件通常包含一個或多個Channel脆栋，用于與原生代碼交互倦卖。
Channel在Flutter插件開發(fā)中的作用有以下幾個方面：
- 提供雙向通信：Channel提供了Flutter應用程序與原生平臺之間進行雙向通信的能力。Flutter應用程序可以向原生平臺發(fā)送消息和數(shù)據(jù)椿争，原生平臺也可以向Flutter應用程序發(fā)送消息和數(shù)據(jù)怕膛。
- 管理方法調(diào)用：Channel可以用于管理Flutter應用程序和原生平臺之間的方法調(diào)用。Flutter應用程序可以通過Channel調(diào)用原生平臺的方法丘薛，原生平臺也可以通過Channel調(diào)用Flutter應用程序的方法嘉竟。
- 實現(xiàn)數(shù)據(jù)傳輸：Channel可以用于在Flutter應用程序和原生平臺之間傳輸數(shù)據(jù)。Flutter應用程序可以通過Channel向原生平臺發(fā)送數(shù)據(jù)洋侨，原生平臺也可以通過Channel向Flutter應用程序發(fā)送數(shù)據(jù)舍扰。
- 擴展Flutter應用程序的功能：通過使用Channel，F(xiàn)lutter應用程序可以訪問原生平臺的功能和能力希坚，例如訪問原生設備API边苹、訪問原生UI組件等。這可以擴展Flutter應用程序的功能和能力裁僧，從而可以更好地滿足用戶需求个束。
參考
https://docs.flutter.dev/packages-and-plugins/developing-packages
步驟
第一步：創(chuàng)建插件
使用 Android Studio 創(chuàng)建插件
項目類型 plugin
選的語言是 java object-c
平臺選了所有 all
創(chuàng)建完成后
| 目錄、文件名 | 說明 |
|---|---|
| ios | 原生 |
| android | 原生 |
| linux | 原生 |
| macos | 原生 |
| windows | 原生 |
| lib/flutter_plugin_add_platform_interface.dart | 功能接口定義 |
| lib/flutter_plugin_add_method_channel.dart | 原生功能接口實現(xiàn) |
| lib/flutter_plugin_add_web.dart | Web功能接口實現(xiàn) |
| lib/flutter_plugin_add.dart | flutter 接口調(diào)用類 |
第二步：編寫 android 代碼
首先我們用模擬器把 android 項目運行下聊疲，讓 android gradle 自動拉取依賴茬底。
選擇 example 來運行。
打開項目的正確目錄是 example/android获洲，而不是根目錄的 android阱表，否則依賴包認不出。
打開后能正常認出
如果認不出可以清下緩存
選取清除歷史和緩存文件
編寫加法計算
android/src/main/java/com/ducafecat/flutter_plugin_add/FlutterPluginAddPlugin.java
@Override
public void onMethodCall(@NonNull MethodCall call, @NonNull Result result) {
if (call.method.equals("getPlatformVersion")) {
result.success("Android " + android.os.Build.VERSION.RELEASE);
}
// add
else if (call.method.equals("add")) {
int a = call.argument("a");
int b = call.argument("b");
int sum = add(a, b);
result.success(sum);
}
else {
result.notImplemented();
}
}
- Flutter應用程序通過MethodChannel向原生平臺發(fā)送方法調(diào)用請求時贡珊。
- 原生平臺收到Flutter應用程序的方法調(diào)用請求后最爬，根據(jù)請求的方法名執(zhí)行相應的方法后，將執(zhí)行結(jié)果返回給Flutter應用程序门岔。
private int add(int a, int b) {
return a + b;
}
第三步：編寫 flutter 接口代碼
接口配置
pubspec.yaml
plugin:
platforms:
android:
package: com.ducafecat.flutter_plugin_add
pluginClass: FlutterPluginAddPlugin
ios:
pluginClass: FlutterPluginAddPlugin
linux:
pluginClass: FlutterPluginAddPlugin
macos:
pluginClass: FlutterPluginAddPlugin
windows:
pluginClass: FlutterPluginAddPluginCApi
web:
pluginClass: FlutterPluginAddWeb
fileName: flutter_plugin_add_web.dart
platforms 部分定義了 Flutter 插件在以下不同平臺上的支持：
- android：定義了Flutter插件在Android平臺上的支持爱致，包括插件的Java包名和插件的類名。
- ios：定義了Flutter插件在iOS平臺上的支持寒随，包括插件的類名糠悯。
- linux：定義了Flutter插件在Linux平臺上的支持，包括插件的類名妻往。
- macos：定義了Flutter插件在macOS平臺上的支持互艾，包括插件的類名。
- windows：定義了Flutter插件在Windows平臺上的支持蒲讯，包括插件的類名和插件的C API實現(xiàn)。
- web：定義了Flutter插件在Web平臺上的支持灰署，包括插件的類名和插件的文件名判帮。
編寫接口定義
lib/flutter_plugin_add_platform_interface.dart
Future<int?> add(int a, int b) {
throw UnimplementedError('add() has not been implemented.');
}
原生端接口調(diào)用
lib/flutter_plugin_add_method_channel.dart
@override
Future<int?> add(int a, int b) async {
final val = await methodChannel.invokeMethod<int>(
'add',
<String, int>{
'a': a,
'b': b,
},
);
return val;
}
flutter 接口調(diào)用類
lib/flutter_plugin_add.dart
Future<int?> add(int a, int b) {
return FlutterPluginAddPlatform.instance.add(a, b);
}
第四步：編寫測試例子
example/lib/main.dart
class _MyAppState extends State<MyApp> {
int addResult = 0;
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text('Plugin example app'),
),
body: Center(
child: Column(
children: [
Text('Running on: $_platformVersion\n'),
// 加法
Text('add: $addResult'),
ElevatedButton(
onPressed: () async {
int? val = await _flutterPluginAddPlugin.add(addResult, 1);
setState(() {
addResult = val ?? -1;
});
},
child: const Text('add'),
),
],
),
),
),
);
}
_flutterPluginAddPlugin.add 的方式調(diào)用我們寫的接口
第五步：編寫 ios 代碼
運行下 ios 自動拉取包局嘁，或者手動 pod 拉包
$ cd ios
$ pod install
使用 xcode 打開 example / ios 目錄
打開插件代碼
寫入加法代碼
ios/Classes/FlutterPluginAddPlugin.m
- (void)handleMethodCall:(FlutterMethodCall*)call result:(FlutterResult)result {
if ([@"getPlatformVersion" isEqualToString:call.method]) {
result([@"iOS " stringByAppendingString:[[UIDevice currentDevice] systemVersion]]);
}
else if ([@"add" isEqualToString:call.method]) {
int a = [call.arguments[@"a"] intValue];
int b = [call.arguments[@"b"] intValue];
result(@(a + b));
}
else {
result(FlutterMethodNotImplemented);
}
}
運行測試
代碼
https://github.com/ducafecat/flutter_develop_tips/tree/main/flutter_plugin_add
小結(jié)
Flutter插件在Flutter應用程序開發(fā)中具有非常重要的作用和重要性，F(xiàn)lutter開發(fā)者應該熟悉和掌握Flutter插件的開發(fā)和使用晦墙。
大家需要注意這幾點：
- 插件 channel 執(zhí)行過程
- 如何正確的打開原生項目
- android ios 源碼位置
- 哪些重要的函數(shù)
- flutter 中如何配置接口
- flutter 中編寫接口定義代碼
感謝閱讀本文
如果我有什么錯悦昵？請在評論中讓我知道。我很樂意改進晌畅。
? 貓哥
ducafecat.com
end
