Flutter 插件的建立及使用

时间  2019-11-06
标签 flutter 插件 建立 使用 繁體版
原文   原文链接

在 Flutter 项目的开发中，咱们须要根据本身的业务需求来建立各类各样的插件，这里记录下关于 Flutter 插件的建立及使用的过程。java

官方文档android

这里主要记录以下几点：ios

  • 插件的建立
  • 获取 Android 中的上下文 Context
  • Dart 调用插件方法及传参
  • 插件调用 Dart 的方法及传参
  • 插件中监听 Activity 的生命周期及经常使用的回调方法
  • 使用 Delegate 的方式来写插件
  • 插件的几种依赖方式（pub、本地、git）
  • 插件的上传及注意事项

插件的建立

咱们能够经过两种方式来建立插件，一种是使用 IDE（Android Studio 或者 Idea）来建立；另外一种是经过命令来建立。git

使用 IDE 建立插件

在菜单栏中选择 File -> New -> New Flutter Project 会出现以下界面github

选中 Flutter Plugin 而后一路 Next 就能够了。shell

使用命令建立插件

flutter create --org com.example --template=plugin plugin_name
复制代码

其中 com.example 是插件包名的一部分，plugin_name 是插件的名称。插件的完整包名为 com.example.plugin_namemarkdown

插件的目录结构

使用上述两种方式中的任一种建立完成以后，插件的目录结构以下：app

图中包含的几个主要的目录分别为 android，example，ios，lib 这四个目录：async

  • android 目录是一个完整的 Android 工程，用来开发 Android 端的插件功能
  • example 目录用来测试 Android 或者 IOS 端的插件功能
  • ios 目录是一个完整的 IOS 工程，用来开发 IOS 端的插件功能
  • lib 目录中的文件负责和 Android 或者 IOS 端的交互

获取 Android 中的上下文 Context

当咱们建立好插件以后，Android 工程 里面会有一个生成好的文件，这里是 FlutterPluginDemoPlugin.java，以下：ide

/** FlutterPluginDemoPlugin */
public class FlutterPluginDemoPlugin implements MethodCallHandler {
  /** Plugin registration.*/
  public static void registerWith(Registrar registrar) {
    final MethodChannel channel = new MethodChannel(registrar.messenger(), "flutter_plugin_demo");
    channel.setMethodCallHandler(new FlutterPluginDemoPlugin());
  }

  @Override
  public void onMethodCall(MethodCall call, Result result) {
    // 省略部分代码
  }
}
复制代码

这个类中有一个与 Dart 层对应的 MethodChannel。

这个时候，若是咱们添加一个弹出 Toast 的方法。Toast 须要一个 Context 类型的参数，可是这个类中是没有提供相似 this.getContext() 的方法来提供。这个时候，须要使用Registrar 这个类来获取 Context。以下：

public class FlutterPluginDemoPlugin implements MethodCallHandler {
    // 上下文 Context
    private final Context context;

    public FlutterPluginDemoPlugin(Registrar registrar) {
        this.context = registrar.context();
    }

    /** * Plugin registration. */
    public static void registerWith(Registrar registrar) {
        final MethodChannel channel = new MethodChannel(registrar.messenger(), "flutter_plugin_demo");
        channel.setMethodCallHandler(new FlutterPluginDemoPlugin(registrar));
    }

    @Override
    public void onMethodCall(MethodCall call, Result result) {
        if (call.method.equals("getPlatformVersion")) {
            result.success("Android " + android.os.Build.VERSION.RELEASE);
        } else if (call.method.equals("showToast")) {
            // 弹出 Toast
            Toast.makeText(context, "来自 Android 端的 Toast", Toast.LENGTH_SHORT).show();
        } else {
            result.notImplemented();
        }
    }
}
复制代码

对应的，在 flutter_plugin_demo.dart 文件中须要新增一个方法来触发弹出 Toast：

class FlutterPluginDemo {
  static const MethodChannel _channel =
      const MethodChannel('flutter_plugin_demo');

  static Future<String> get platformVersion async {
    final String version = await _channel.invokeMethod('getPlatformVersion');
    return version;
  }
  
  /// 弹出 Toast
  static Future<void> showToast() async {
    await _channel.invokeMethod("showToast");
  }

}
复制代码

而后在 example 工程中的去调用：

floatingActionButton: FloatingActionButton(
  onPressed: () async {
    /// 调用插件的 Toast 功能
    await FlutterPluginDemo.showToast();
  },
  child: Icon(Icons.add),
),
复制代码

Dart 调用原生方法时传递参数

将上述的 showToast 方法改为接收一个参数的方法：

/// [message] Toast 的内容
static Future<void> showToast({String message}) async {
    await _channel.invokeMethod("showToast", message);
}
复制代码

在 Java 层就须要接收这个参数：

String message = String message = call.arguments();
Toast.makeText(context, message, Toast.LENGTH_SHORT).show();
复制代码

有时候须要传递好多个参数，这个时候能够传递一个 Map，以下：

/// 传递 map 类型的参数
static Future<void> showToast() async {
    Map<String, String> params = Map<String, String>();
    params['name'] = 'Lili';
    params['age'] = '20';
    params['country'] = 'China';
    await _channel.invokeMethod("showToast", params);
}
复制代码

Java 层接收：

Map<String, String> params = call.arguments();
Toast.makeText(context, params.get("name"), Toast.LENGTH_SHORT).show();
复制代码

原生向 Dart 层发送通知

这里咱们使用 EventChannel 来让原生向 Dart 层发送通知，使用 EventChannel 的步骤以下：

  • Dart 层定义一个 EventChannel
  • Dart 层监听该 EventChannel，用来接收该 EventChannel 上的事件
  • 原生端定义一个 EventChannel
  • 原生端向 Dart 层发送消息

Dart 层定义 EventChannel

static const EventChannel _eventChannel = EventChannel("flutter_plugin_event");
复制代码

Dart 层监听该 EventChannel

// 这里的 data 就是原生端发送过来的数据
_eventChannel.receiveBroadcastStream().listen((data) {
  //streamController.sink.add(data);
});
复制代码

原生端定义 EventChannel

原生端里面，首先须要定义一个 EventChannel ，而后须要为其设置一个 StreamHandler，在 StreamHandler 的 onListen 方法中会有一个 EventChannel.EventSink 的参数，这个参数能够用来向 Dart 层发送消息。

private EventChannel.EventSink eventSink;
...
final EventChannel eventChannel = new EventChannel(registrar.messenger(), "flutter_plugin_event");
eventChannel.setStreamHandler(new EventChannel.StreamHandler() {
    @Override
    public void onListen(Object o, EventChannel.EventSink eventSink) {
        FlutterPluginDemoPlugin.this.eventSink = eventSink;
    }

    @Override
    public void onCancel(Object o) {
        FlutterPluginDemoPlugin.this.eventSink = null;
    }
});
复制代码

原生端向 Dart 层发送消息

// 通知 Dart 层
if (null != eventSink) {
    eventSink.success("Dart 调用 原始方法成功");
}
复制代码

插件中监听 Activity 经常使用的生命周期方法的回调

生命周期方法回调

有时候咱们须要在 Activity 的生命周期方法中干一些事，好比友盟统计的时候，就须要在Activity 的 onResume()和 onPause() 中添加一些代码；

要监听 onCreate()，onStart()，onResume() 等 方法的回调，须要借助 Application.ActivityLifecycleCallbacks 这个接口。

首先写一个类 LifeCycleCallbacks 来 实现 Application.ActivityLifecycleCallbacks 这个接口，而后将其注册到 Application 的上下文中。

Application.ActivityLifecycleCallbacks 接口中提供的生命周期方法以下：

public interface ActivityLifecycleCallbacks {
    void onActivityCreated(Activity activity, Bundle savedInstanceState);
    void onActivityStarted(Activity activity);
    void onActivityResumed(Activity activity);
    void onActivityPaused(Activity activity);
    void onActivityStopped(Activity activity);
    void onActivitySaveInstanceState(Activity activity, Bundle outState);
    void onActivityDestroyed(Activity activity);
}
复制代码

因此咱们只须要写一个类来实现它就能够了。而后在对应的方法里面写对应的代码。

接着就是注册了：

public FlutterPluginDemoPlugin(Registrar registrar) {
    ...
    ...
    // 注册声明周期方法的监听
    ((Application) registrar.context())
        .registerActivityLifecycleCallbacks(new LifeCycleCallbacks());
}
复制代码

最后在 onActivityDestroyed 生命周期方法中解注册

class LifeCycleCallbacks implements Application.ActivityLifecycleCallbacks {
    ...
    ...
    @Override
    public void onActivityDestroyed(Activity activity) {
        if (activity == registrar.activity()) {
            ((Application) registrar.context()).unregisterActivityLifecycleCallbacks(this);
        }
    }  
}
复制代码

权限监听回调

public FlutterPluginDemoPlugin(Registrar registrar) {
        ...
        ...
        // 权限监听回调
        registrar.addRequestPermissionsResultListener(new PluginRegistry.RequestPermissionsResultListener() {
        @Override
        public boolean onRequestPermissionsResult(int i, String[] strings, int[] ints) {
            return false;
        }
    });
}
复制代码

startActivityForResult 的回调

public FlutterPluginDemoPlugin(Registrar registrar) {
    ...
    ...
    // startActivityForResult 回调
    registrar.addActivityResultListener(new PluginRegistry.ActivityResultListener() {
        @Override
        public boolean onActivityResult(int requestCode, int responseCode, Intent intent) {
            return false;
        }
    });
}
复制代码

编写一个 Delegate 类来处理业务逻辑

上一小节中，咱们在 FlutterPluginDemoPlugin这一个类中处理 Activity 的声明周期的回调方法，权限申请的回调方法，Activity 跳转的回调方法。这个时候，FlutterPluginDemoPlugin 这个类的代码就会显得很是的多。

咱们能够写一个类来帮助插件类处理这些事情，这里写一个 PluginDelegate 类来实现这个功能：

public class PluginDelegate implements Application.ActivityLifecycleCallbacks, PluginRegistry.RequestPermissionsResultListener, PluginRegistry.ActivityResultListener {

    private final Context context;
    private final Application application;

    public PluginDelegate(PluginRegistry.Registrar registrar) {
        this.context = registrar.context();
        this.application = (Application) context;
    }

    public void methodA(MethodCall call, MethodChannel.Result result){
        // do something...
    }

    public void methodB(MethodCall call, MethodChannel.Result result){
        // do something...
    }
    ...
    ...
    ...
    @Override
    public void onActivityDestroyed(Activity activity) {
        application.unregisterActivityLifecycleCallbacks(this);
    }

    @Override
    public boolean onRequestPermissionsResult(int i, String[] strings, int[] ints) {
        return false;
    }

    @Override
    public boolean onActivityResult(int i, int i1, Intent intent) {
        return false;
    }
}
复制代码

能够看出 PluginDelegate 类实现了上一小节中须要处理的三种回调的接口，那么咱们在 FlutterPluginDemoPlugin 插件类中就能够这样：

public class FlutterPluginDemoPlugin implements MethodCallHandler {
    ...
    ...
    private final PluginDelegate delegate;
    
    // 构造方法
    public FlutterPluginDemoPlugin(Registrar registrar, PluginDelegate delegate) {
        ...
        this.delegate = delegate;
        ...
        // 声明周期回调
        ((Application) context).registerActivityLifecycleCallbacks(delegate);

        // 权限声明回调
        registrar.addRequestPermissionsResultListener(delegate);

        // 页面跳转回调
        registrar.addActivityResultListener(delegate);
    }
    
    /** * Plugin registration. */
    public static void registerWith(Registrar registrar) {
        final MethodChannel channel = new MethodChannel(registrar.messenger(), "flutter_plugin_demo");
        // 初始化PluginDelegate
        final PluginDelegate delegate = new PluginDelegate(registrar);
        channel.setMethodCallHandler(new FlutterPluginDemoPlugin(registrar, delegate));
    }
    
    @Override
    public void onMethodCall(MethodCall call, Result result) {
        // 调用代理类方法演示
        if (call.method.equals("methodA")) {
            delegate.methodA(call, result);
        }else if(call.method.equals("methodB")){
            delegate.methodB(call, result);
        }
    }
}
复制代码

插件的依赖方式

官方文档

这里有三种方式用来依赖插件

  • pub 依赖
  • git 依赖
  • 本地依赖

pub 依赖

这种是最多见的方式，直接在 工程的 pubspec.yaml 中依赖

dependencies:
 flutter:
 sdk: flutter
  # 添加 toast 的依赖
 toast: ^0.1.5
复制代码

git 依赖

不少时候，pub 上的某个插件并不能彻底知足咱们实际的业务需求，如 UI 或者一些逻辑问题，这个时候咱们能够将其源码下载下来，而后根据本身的业务需求对其进行修改。改完以后一般会上传到公司的私有仓库中（GitHub 或者 GitLab），而后在工程中就须要依赖私有仓库中的库

dependencies:
 toast:
 git:
 url: http://xxx/toast.git
复制代码

还可能依赖该仓库指定分支上的代码，如依赖远程 dev 分支上的代码

dependencies:
 toast:
 git:
 ref: dev
 url: http://xxx/toast.git
复制代码

本地依赖

有时候须要在项目中测试本地的某个插件，这个时候就可使用本地依赖的方式来依赖插件

dependencies:
 toast:
 path: user/xxx/toast/
复制代码

插件的上传

这里是上传到 pub.dev 上面

在上传以前使用以下命令检查插件中的一些问题：

flutter packages pub publish --dry-run
复制代码

还须要作的就是上传前的须要清理插件，避免插件过大没法上传

flutter clean
复制代码

使用以下命令进行插件的上传

flutter packages pub publish
复制代码

最后 github 地址

相关文章
相关标签/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公众号
   欢迎关注本站公众号,获取更多信息
联系我们 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程