Flutter与Native通信示例及源码分析：搭建Flutter与原生的跨平台通讯桥梁

2023-12-07 11:00:20

1. Flutter与Native通信概述：为何Flutter需要与Native通信？

随着Flutter的不断壮大，越来越多的应用开始使用它来开发。但是，Flutter并不是万能的，它无法处理所有类型的任务。有些任务，比如访问原生系统功能（如设备传感器、相机和文件系统），Flutter就无能为力了。因此，Flutter需要与Native通信，以便访问这些功能。

2. Android和iOS的Flutter与Native通信方式

Flutter与Native通信的方式主要有两种：Method Channel和Event Channel。

Method Channel： Method Channel是一种同步通信方式，Flutter可以向Native发送请求，并等待Native的回复。这种方式非常适合需要获取Native数据或执行Native操作的情况。

Event Channel： Event Channel是一种异步通信方式，Flutter可以向Native注册一个监听器，当Native发生某些事件时，就会通过监听器通知Flutter。这种方式非常适合需要持续接收Native事件的情况。

3. 创建Flutter Module

为了实现Flutter与Native的通信，我们需要先创建一个Flutter Module。Flutter Module是一个独立的Flutter项目，它可以被其他应用程序（比如Android或iOS应用程序）引用。

3.1 创建Android Module

打开Android Studio，创建一个新的Android项目。
在项目中添加一个Flutter Module。
在Flutter Module中创建MainActivity.java文件。
在MainActivity.java文件中添加以下代码：

public class MainActivity extends FlutterActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        GeneratedPluginRegistrant.registerWith(this);
    }
}

3.2 创建iOS Module

打开Xcode，创建一个新的iOS项目。
在项目中添加一个Flutter Module。
在Flutter Module中创建AppDelegate.swift文件。
在AppDelegate.swift文件中添加以下代码：

import Flutter
import UIKit

@UIApplicationMain
class AppDelegate: UIResponder, UIApplicationDelegate {
    var window: UIWindow?

    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
        GeneratedPluginRegistrant.register(with: self)
        return true
    }
}

4. 实现Flutter与Native通信

4.1 使用Method Channel

在Flutter Module中创建一个方法通道。
在Android或iOS应用程序中注册方法通道。
在Flutter端使用方法通道发送请求。
在Native端处理方法通道请求并返回结果。

4.2 使用Event Channel

在Flutter Module中创建一个事件通道。
在Android或iOS应用程序中注册事件通道。
在Native端触发事件。
在Flutter端接收事件。

5. Flutter与Native通信示例

5.1 获取设备信息

import 'package:flutter/services.dart';

class DeviceInfo {
    static Future<String> getDeviceName() async {
        return await MethodChannel('samples.flutter.dev/device_info').invokeMethod('get_device_name');
    }
}

public class DeviceInfo {
    public static String getDeviceName() {
        return Build.MODEL;
    }
}

class DeviceInfo: NSObject {
    @objc static func getDeviceName() -> String {
        return UIDevice.current.name
    }
}

5.2 打开相机

import 'package:flutter/services.dart';

class Camera {
    static Future<void> openCamera() async {
        await MethodChannel('samples.flutter.dev/camera').invokeMethod('open_camera');
    }
}

public class Camera {
    public static void openCamera() {
        Intent intent = new Intent(MediaStore.ACTION_IMAGE_CAPTURE);
        ((Activity) ContextCompat.getSystemService(FlutterActivity.getCurrentActivity(), Context.ACTIVITY_SERVICE)).startActivityForResult(intent, 1);
    }
}

class Camera: NSObject {
    @objc static func openCamera() {
        let picker = UIImagePickerController()
        picker.sourceType = .camera
        ((UIApplication.shared.delegate as! AppDelegate).window!.rootViewController as! FlutterViewController).present(picker, animated: true, completion: nil)
    }
}