Flutter - 创建独立的Plugin类库项目

背景

开发中，为了避免重复的编写一些类及函数，我们通常会把这些代码集中到一个独立的Plugin项目中，我们称之为类库。那么在Flutter项目中我们如何创建自己的类库呢？又如何测试类库的正确性呢？

步骤

• 创建一个Flutter项目

  使用Android-Studio或者Inteillj-IDEA创建一个Flutter项目

  图片.png

• 创建一个Flutter-Plugin类库

  鼠标右键点击Flutter项目根目录，New -> Module -> Flutter Plugin

  图片.png

  这里我们命名Plugin项目为：toast_provider

  图片.png

然后接着下一步再下一步完成Plugin项目创建，此时，我们会发现原Flutter项目中会多出一个toast_provider目录

图片.png

现在我们需要把这个类库依赖到我们的Flutter项目中。打开Flutter项目中的pubspec.yaml文件，进行Plugin项目依赖配置。此时我们需要向 dependencies 中添加 toast_provider ，并配置 path(路径) 参数。配置完成后，需要执行 Packages get 完成项目梳理。

图片.png

​

• 如何编写Flutter类库的代码

  打开Plugin项目中的example项目，然后再打开Plugin项目中的example下的android项目,此时我们就可以编辑我们的插件项目的代码了。 toast_provider.dart <=> ToastProviderPlugin.kt，下图是同时打开整个项目结构的示例图，一共打开了3个项目：Flutter项目，Flutter-Plugin项目, Flutter-Plugin-Native项目。

  image.png

  ToastProviderPlugin.kt ：

  class ToastProviderPlugin(private val registrar: Registrar) : MethodCallHandler {
  
      companion object {
  
          @JvmStatic
          val TAG: String = ToastProviderPlugin::class.java.simpleName
  
          @JvmStatic
          fun registerWith(registrar: Registrar): Unit {
              val channel = MethodChannel(registrar.messenger(), "toast_provider")
              channel.setMethodCallHandler(ToastProviderPlugin(registrar))
          }
  
      }
  
      override fun onMethodCall(call: MethodCall, result: Result): Unit {
          val context = registrar.context()
          val message = call.argument("message")
          if(message == null){
              result.error(TAG, "错误：message参数错误", null)
              return
          }
          when(call.method){
              "showShortToast" -> {
                  showToast(context, message, Toast.LENGTH_SHORT)
                  result.success(null)
              }
              "showLongToast" -> {
                  showToast(context, message, Toast.LENGTH_LONG)
                  result.success(null)
              }
              "showToast" -> {
                  val duration = call.argument("duration") ?: Toast.LENGTH_SHORT
                  showToast(context, message, duration)
                  result.success(null)
              }
              else -> result.notImplemented()
          }
      }
  
      private fun showToast(context: Context, message: String, duration: Int)
          = Toast.makeText(context, message, duration).show()
  
  }
  
  

  toast_provider.dart ：

  import 'dart:async';
  
  import 'package:flutter/services.dart';
  
  class ToastProvider {
  
    static const MethodChannel _channel = const MethodChannel('toast_provider');
  
    static void showShortToast(String messsage) => _channel.invokeMethod("showShortToast", { "message": messsage});
  
    static void showLongToast(String message) => _channel.invokeMethod("showLongToast", { "message": message});
  
    static void showToast(String message, int duration) => _channel.invokeMethod("showToast", { "message": message, "duration": duration});
  
  }
  
  

• 如何测试Flutter类库的正确性

  编写plugin项目中的example下的main.dart代码，如下所示：

  import 'package:flutter/material.dart';
  import 'package:flutter/services.dart';
  import 'package:toast_provider/toast_provider.dart';
  
  void main() => runApp(new MyApp());
  
  class MyApp extends StatefulWidget {
    @override
    _MyAppState createState() => new _MyAppState();
  }
  
  class _MyAppState extends State {
  
    void _showMessage(){
      ToastProvider.showShortToast("我是按钮");
    }
  
    @override
    Widget build(BuildContext context) {
      return new MaterialApp(
        home: new Scaffold(
          appBar: new AppBar(
            title: new Text('Plugin example app'),
          ),
          body: new Center(
            child: new RaisedButton(
              onPressed: _showMessage,
              child: new Text("我是按钮"),
            ),
          ),
        ),
      );
    }
  
  }
  

最后

至此，我们的Plugin项目示例已经完成。

纸上得来终觉浅，绝知此事要躬行。

实践是检测真理的唯一标准！