Flutter Plugin/package 从编写到发布

---

全部翻译于视频教学

Flutter Plugin

AS-> Create New Flutter Project->Flutter Plugin->命名(x_toast)->next->finish

需要关注三个文件

首先是lib下的XToast

import 'dart:async';

import 'package:flutter/services.dart';

class XToast {
  static const MethodChannel _channel = const MethodChannel('x_toast');

  static Future showToast(String msg,
      {String duration, int textColor, double textSize}) async {
    _channel.invokeMethod('showToast', {
      "msg": msg,
      "duration": duration,
      "textColor": textColor,
      "textSize": textSize,
    });
    return null;
  }
}

其次是example下的lib下的main.dart，这个就是demo演示

import 'package:flutter/material.dart';
import 'package:x_toast/x_toast.dart';

void main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Plugin example app'),
        ),
        body: Center(
          child: RaisedButton(
            child: Text('show toast'),
            onPressed: () {
              XToast.showToast('hello x',
                  duration: 'short', textColor: 0xffffffff, textSize: 20.0);
            },
          ),
        ),
      ),
    );
  }
}

最后是将项目展示方式从Project->Android：XToastPlugin

package com.xiey.x_toast

import android.content.Context
import android.widget.TextView
import android.widget.Toast
import io.flutter.plugin.common.MethodCall
import io.flutter.plugin.common.MethodChannel
import io.flutter.plugin.common.MethodChannel.MethodCallHandler
import io.flutter.plugin.common.MethodChannel.Result
import io.flutter.plugin.common.PluginRegistry.Registrar

class XToastPlugin : MethodCallHandler {

    private var mContext: Context? = null
    private var mToast: Toast? = null

    constructor(context: Context) {
        this.mContext = context
    }

    companion object {

        @JvmStatic
        fun registerWith(registrar: Registrar) {
            val channel = MethodChannel(registrar.messenger(), "x_toast")
            channel.setMethodCallHandler(XToastPlugin(registrar.context()))
        }
    }

    override fun onMethodCall(call: MethodCall, result: Result) {
        if (call.method == "showToast") {

            var msg = call.argument("msg")
            var duration = call.argument("duration")
            var textColor = call.argument("textColor")
            var textSize = call.argument("textSize")


            mToast = Toast.makeText(mContext, "", Toast.LENGTH_SHORT)

            mToast?.let { toast ->
                toast.setText(msg ?: "")
                toast.duration = if ("long" == duration) Toast.LENGTH_LONG else Toast.LENGTH_SHORT
                var textView = toast.view.findViewById(android.R.id.message) as TextView
                textView?.let {
                    it.setTextColor(textColor!!.toInt())
                    it.textSize = textSize!!.toFloat()
                }
                toast.show()
            }

        } else {
            result.notImplemented()
        }
    }
}

在手机上测试运行：

Flutter Plugin

AS-> Create New Flutter Project->Flutter Package->命名(flutter_shaded_text)->next->finish

这里面主要是两个文件：

• lib下的flutter_shaded_text.dart
• example下的lib下的main.dart【演示demo】

library flutter_shaded_text;

import 'package:flutter/material.dart';

//定义模板函数
typedef ShadeBuilder = Widget Function(
    BuildContext context, String text, Color);

class ShadedText extends StatelessWidget {

  final String text;
  final Color textColor;
  final Color shadeColor;
  final double xTans;
  final double yTans;
  final ShadeBuilder shadeBuilder;


  ShadedText({
    this.text,
    this.textColor,
    this.shadeColor,
    this.xTans,
    this.yTans,
    this.shadeBuilder})
      :assert(text != null),
        assert(textColor != null),
        assert(shadeColor != null),
        assert(shadeBuilder != null);


  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        shadeBuilder(context, text, textColor),
        Transform(
          transform: Matrix4.translationValues(
              xTans ?? 10.0, yTans ?? 10.0, 0.0),
          child: shadeBuilder(context, text, shadeColor),
        ),
      ],
    );
  }
}

import 'package:flutter/material.dart';
import 'package:flutter_shaded_text/flutter_shaded_text.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('shade_text'),
      ),
      body: Center(
        child: ShadedText(
          text: 'Shaded Text',
          textColor: Color(0xffff0000),
          shadeColor: Color(0xff00ff00),
          shadeBuilder: (BuildContext context, String text, Color color) =>
              Container(
            child: Text(
              text,
              style: TextStyle(color: color),
            ),
          ),
        ),
      ),
    );
  }
}

运行效果：

再说说发布的事：

发布的流程步骤：

整个流程处于有网，能状态下进行

1、编写，测试通过；预发布

2、发布前检查

flutter packages pub publish --dry-run

一般会有：

• author要填写
• homepage要填写
• .gitignore要填写（一个package不能超过100M，不添加的话可能会超过100M）
• …

3、环境变量删除

变量名：PUB_HOSTED_URL
变量值：https://pub.flutter-io.cn	(注意：这个是临时镜像，学Flitter的都有介绍，不确保一直有效)
变量名：FLUTTER_STORAGE_BASE_URL
变量值：https://storage.flutter-io.cn (注意：这个是临时镜像，学Flitter的都有介绍，不确保一直有效)

4、设置代理

set http_proxy=http://127.0.0.1:1080
set https_proxy=https://127.0.0.1:1080

5、检查过程中会有一次确认是否OK的过程，需要输入(y/n) OK的话直接y

6、会有一次账号验证过程，直接复制那整个链接一直到.email结尾到浏览器进行认证

7.1、发布 -v 能看到整个发布流程

flutter packages pub publish -v

7.2、发布

flutter packages pub publish --server=https://pub.dartlang.org

因为7.1发布基本上成功率不高，失败率很高，7.2目前试了两次都是一次性OK

8、查找自己的packages，直接搜会搜不到，主要直接查找；或者你的gmail中也会收到邮件里面也会有详细地址

https://pub.dev/packages/####
####是你的packages name

---