FIDL：Flutter與原生通訊的新姿勢，不侷限於基礎資料型別

小玩童發表於2020-03-17
Flutter資料型別

大家好！今天給大家安利一個自認為比較重磅的Flutter開源專案。

Flutter的產品定義是一個高效能的跨平臺的移動UI框架，能夠用一套程式碼同時構建出Android/iOS/Web/MacOS應用。作為一套UI框架，它不具備一些系統的介面，自然還是避免不了跟原生打交道。於是乎，它提出了名為platform channel的東西，用於flutter和原生靈活的交換資料。以下為了描述方便，用Android代指原生。

FIDL：Flutter與原生通訊的新姿勢，不侷限於基礎資料型別

燃鵝，燃鵝，燃鵝，它只支援一些基礎的資料型別和資料結構的傳輸，例如bool/int/long/byte/char/String/byte[]/List/Map等。

因此，當你想傳輸複雜點的資料，你只能包裝成Map，類似這樣：

await _channel.invokeMethod('initUser',
    {'name': 'Oscar', 'age': 16, 'gender': 'MALE', 'country': 'China'});
複製程式碼

然後再在Android層hard code，解析出不同的key對應的不同資料。如果你是一個純fluter專案，且以後也沒有和原生打交道的打算，或者只是需要進行簡單的互動，那這種做法也無可厚非。而當你的專案已經有很大的一部分原生程式碼或者你需要使用第三方不支援flutter的lib庫的時候，就意味著你需要編寫大量向上面那樣的模板程式碼。可見效率低下，且可維護性差。這時，你會想，能傳輸物件就好了！

而當你想傳輸物件時：

FIDL：Flutter與原生通訊的新姿勢，不侷限於基礎資料型別

抱歉，沒門，只能給你一個尷尬又不是禮貌的危笑。當然，也不是不可以，我們可以在原生上層把物件序列化成json物件，然後在flutter層再把json轉成flutter的物件，同樣效率很差。

FIDL是什麼

學過Android的應該都知道AIDL(Android Interface Defination Language)，即Android介面定義語言。Android中有一種高階的跨程式通訊方式——Binder，但是想要使用Binder需要了解一些Binder的機制和API，需要編寫大量的模板程式碼。Android為了解決這個問題，嘗試把使用Binder的方法做的小白一點。於是定義了AIDL，告訴開發者，你的介面檔案必須按照我規定的來寫，你要跨程式傳輸的物件必須實現Parcelable介面。然後，Android給你生成了一個Service.Stub類，偷偷的在背後把物件的序列化、反序列化的工作都給做了。開發者使用這個Stub類就能輕鬆上手Binder這種高階的跨程式通訊方法。（???我編的，差不多啦）

FIDL(Flutter Interface Defination Language)即Flutter介面定義語言，它的使命和AIDL很類似，悄悄把物件的序列化、反序列化、自動生成程式碼這種“髒活累活”給做了。開發者在原生程式碼中看到的類，能通過@FIDL註解標記，自動在Dart側生成和原生程式碼中一樣的類。FIDL是一面鏡子，把各種原生平臺的類影射到Dart中，把Dart中的類影射到各個原生平臺。

少囉嗦，先看東西

FIDL：Flutter與原生通訊的新姿勢，不侷限於基礎資料型別

1、首先是Java類：

public class User {
  String name;
  int age;
  String country;
  Gender gender;
}
enum Gender {
  MALE, FEMALE
}
複製程式碼

2、定義FIDL介面

@FIDL
public interface IUserService {
	void initUser(User user);
}
複製程式碼

3、執行幾個命令

4、Android側在合適的地方開啟IUserServiceStub通道（IUserServiceStub是IUserService的實現類，自動生成的）

FidlChannel.openChannel(getFlutterEngine().getDartExecutor(), new IUserServiceStub() {
  @Override
  void initUser(User user){
    System.out.println(user.name + " is " + user.age + "years old!");
  }
}
複製程式碼

5、Flutter側使用IUserService 通道

// 繫結通道（IUserService類是自動生產的哦）
await Fidl.bindChannel(IUserService.CHANNEL_NAME, _channelConnection);
// 使用User類（`User類`以及它使用的`Gender列舉`是自動生成的哦）
User user = User();
user.name = 'Oscar';
user.age = 18;
user.gender = Gender.MALE;
user.country = 'China';
// 呼叫通道方法
await IUserService.initUser(user);
複製程式碼

編譯，執行，你將能在Logcat中看到Oscar is 18 years old!。

FIDL使用詳解

這一部分是對少囉嗦，先看東西部分的補充解釋，觀眾姥爺們可以自行跳過。

上面的例子中的Map，一般來說，在Java中會對應一個類：

public class User {
  String name;
  int age;
  String country;
  Gender gender;
}
enum Gender {
  MALE, FEMALE
}
複製程式碼

如果想讓flutter傳輸這個物件而不用在flutter層手動去編寫User這個類，以及編寫fromJson/toJson方法，你可以這樣做：

1、定義一個介面，新增註解@FIDL。這個註解將告知annotationProcessor生成一些介面和類的描述檔案。

@FIDL
public interface IUserService {
	void initUser(User user);
}
複製程式碼

2、Android Studio點選sync，或者執行：

./gradlew assembleDebug
複製程式碼

然後就會產生一堆json檔案，如下：

FIDL：Flutter與原生通訊的新姿勢，不侷限於基礎資料型別

這些json檔案就是FIDL和類的描述檔案。沒錯，也會同時生成User引用的Gender類的描述檔案。

同時，還會生成IUserService的實現IUserServiceStub。即：

  • com.infiniteloop.fidl_example.IUserService.fidl.json
  • com.infiniteloop.fidl_example.User.json
  • com.infiniteloop.fidl_example.Gender.json
  • com.infiniteloop.fidl_example.IUserServiceStub.java

3、進入到你的flutter專案，在lib目錄下建立fidl目錄，把上面的json檔案拷貝到這個目錄，然後執行：

flutter packages pub run fidl_model
複製程式碼

然後就能在fidl目錄下自動生成相關的dart類：

FIDL：Flutter與原生通訊的新姿勢，不侷限於基礎資料型別

即：

  • User.dart
  • Gender.dart
  • IUserService.dart

4、使用

a. Android側在合適的地方開啟IUserServiceStub通道

FidlChannel.openChannel(getFlutterEngine().getDartExecutor(), new IUserServiceStub() {
  @Override
  void initUser(User user){}
}
複製程式碼

b. Flutter側繫結IUserService通道

await Fidl.bindChannel(IUserService.CHANNEL_NAME, _channelConnection);
複製程式碼

c、Flutter呼叫通道方法

await IUserService.initUser(User());
複製程式碼

d、Flutter可以在合適的時候接觸繫結

await Fidl.unbindChannel(IUserService.CHANNEL_NAME, _channelConnection);
複製程式碼

e、Android側可以在合適的時候關閉通道

FidlChannel.closeChannel(userServiceStub);
複製程式碼

當然，FIDL的功能不止於此

1、多個引數的FIDL介面

void init(String name, Integer age, Gender gender, Conversation conversation);
複製程式碼

2、帶返回值的FIDL介面

UserInfo getUserInfo();
複製程式碼

3、支援泛型類的生成

public class User<T> {
  T country;
}
public class AUser<String>{}
複製程式碼

FIDL介面：

void initUser(AUser user);
複製程式碼

將能在dart側生成AUser和User類，且能保持繼承關係。

4、傳遞列舉

void initEnum0(EmptyEnum e);
String initEnum1(MessageStatus status);
複製程式碼

5、傳遞集合、Map

void initList0(List<String> ids);
void initList1(Collection<String> ids);
void initList7(Stack<String> ids);
void initList10(BlockingQueue ids);
複製程式碼

6、傳遞複雜物件。繼承、抽象、泛型、列舉和混合類，來一個打一個。

當然，FIDL能做的不止於此

現在，FIDL專案只實現了從Dart側呼叫Android側的方法。還有以下工作要做：

  • Android側呼叫Dart側的方法
  • 其它平臺和Flutter方法的互相呼叫
  • EventChannel，EventChannel本質上是可以通過MethodChannel實現的，問題不大

搞定了物件傳輸，這些問題，都是小case啦。

對於物件的序列化和反序列化

為了能滿足大佬們的定製化需求，我分別在Java側和Flutter側定義了序列化/反序列化的介面類。

Java:

public interface ObjectCodec {
    List<byte[]> encode(Object... objects);
    <T> T decode(byte[] input, TypeLiteral<T> type);
}
複製程式碼

Dart:

abstract class ObjectCodec {
  dynamic decode(Uint8List input);
  List<Uint8List> encode(List objects);
}
複製程式碼

目前使用的是JsonObjectCodec，經過JSON的編解碼，效能會稍差。後面還希望和小夥伴們一起努力，實現更高效的編解碼。

專案進度

上述提到的功能，只要是從Flutter側呼叫Java側的方法相關的，大部分都已經實現了。

我做了一個Demo，模擬了一個在Android側依賴了IM(即時通訊)SDK，需要在Flutter側聊天、獲取訊息、發訊息的場景。以下是Demo的截圖：

1、首頁，點選按鈕呼叫Android側方法，開啟聊天服務

FIDL：Flutter與原生通訊的新姿勢，不侷限於基礎資料型別

2、聊天頁面

FIDL：Flutter與原生通訊的新姿勢，不侷限於基礎資料型別

3、發一條訊息給Lucy並獲取和Lucy的聊天記錄

FIDL：Flutter與原生通訊的新姿勢，不侷限於基礎資料型別

4、呼叫Android側方法傳送N條訊息給Wilson並獲取聊天記錄

FIDL：Flutter與原生通訊的新姿勢，不侷限於基礎資料型別

最後

上次做開源專案已經是3年前了，那是一個Android原生重新整理控制元件，TwinklingRefreshLayout，github 3.7k stars。後來由於工作的原因，整天跟Android Framework、C/C++打交道，精力也都是放到了公司的業務上，也沒有時間和精力維護下去。

那麼今天我想釋出的這個Flutter開源專案，是想通過社群的力量，和大家一起把專案維護下去。我在GayHub上建立了一個組織，github.com/flutterFIDL。稍晚一點時間，我會把專案開源出來，一兩天內，程式碼會放在這裡，github.com/flutterFIDL…。大家記得投幣、點贊、收藏，一鍵3連（大家如果覺得這個專案能很好解決跨平臺通訊問題，給個star可以嘛?）。阿不，我需要一個團隊跟我一起發展這個專案，希望你熟悉Flutter開發，瞭解Android和Java開發，熱愛開源，熟悉Flutter+iOS / Flutter + Web其中的一種，並有相關專案經歷，加我vx: w354850839。

這樣一個庫，香嗎？告訴我，有多香。?

歡迎留言評論，告訴我你的Flutter和原生通訊的使用場景，以及遇到的痛點和問題~

相關文章