创立Package

参数阐明:

  • 要创立纯 Dart 库的 package,运用带有--template=package 标志的 flutter create 命令
flutter create --template=plugin 'plugin_name'

Flutter-Package插件的开发、发布、使用

创立完结后,能够看到这个里边是不包括原生代码的,没有以前的 iOSAndroid 目录

Flutter-Package插件的开发、发布、使用

更多的 Flutter命令和快捷键 能够参考:Flutter-最全常用快捷键

这儿是关于有 Flutter-Plugin插件的开发、发布、运用

发布 Package

完善 package 里边的代码,我这儿只是简单写了一个自定义Dialog的代码,然后他人引证我这个包,运用这个自定义的升级 Dialog 。写完代码后,这个时分就开端上传 package 了。详细的 package 包的代码在文章最终面。

pubspec.yaml 里的参数阐明:

name:包的名称
description: 包的描绘信息
version:包的版别,假如上传了example,这儿有必要>=1.0.0
homepage:网页介绍,需求填写一个能正常访问的地址

CHANGELOG.md 里边也要改成对应的版别号

先查看Dart包

进入 package_dialog_demo 包项目的目录,然后履行

flutter packages pub publish--dry-run

假如包有问题是能够检测出来的。这儿明显能够看到是没有问题的

Flutter-Package插件的开发、发布、使用

发布 Dart 包

flutter packages pub publish

常见问题:

  • 问询是否要发布0.0.1版别的包

Flutter-Package插件的开发、发布、使用

  • 输入y,然后回车。提示让去谷歌的这个地址进行验证,所以首先要确保有一个Google 邮箱账号

Flutter-Package插件的开发、发布、使用

  • 复制这个地址,在浏览器输入,然后登陆 Google 账号,验证完结

Flutter-Package插件的开发、发布、使用

只要在浏览器验证完结,终端主动也会提示验证完结

Flutter-Package插件的开发、发布、使用

之后会长时刻卡住,最终失败了

Flutter-Package插件的开发、发布、使用

  • 这个时分会报错,看着是网络问题,需求翻墙,而且需求在终端设置署理

Flutter-Package插件的开发、发布、使用

指定服务器进行发布

flutter packages pub publish--server=https://pub.dartlang.org
  • 解决完上个问题,发现又出现下面许可证的问题

Flutter-Package插件的开发、发布、使用

解决这个问题,就需求在GitHub上面创立仓库,挑选对应的许可证

Flutter-Package插件的开发、发布、使用

然后创立好仓库后,进入仓库看到多了一个这个文件

Flutter-Package插件的开发、发布、使用

打开这个文件,把内容复制,粘贴到 package 包 LICENSE 的里边

Flutter-Package插件的开发、发布、使用

再次查看,看是否有问题,没有问题再次履行上传操作

Flutter-Package插件的开发、发布、使用

这样就成功的创立包而且上传成功了,这个时分去 pub.dev/ 搜索上传的包 package_dialog_demo,发现是有的

Flutter-Package插件的开发、发布、使用

运用 Package

创立运用工程

创立一个工程flutter_custom_dialog,引进这个自定义的package包,看是否能成功运用

引进 package 包

package_dialog_demo: ^0.0.1

然后pub get, 在工程里边引进,我这儿设置了别名DialogDemo防止抵触,就能够正常的运用了

import 'package:package_dialog_demo/package_dialog_demo.dart' as DialogDemo;

Flutter-Package插件的开发、发布、使用

Flutter-Package插件的开发、发布、使用

包中运用图片的问题

注意: 虽然能正常运用,但是发现package里边有个图片不能正常显现。这个时分就需求去添加图片,因为咱们包上传只显现lib文件夹,所以在这个里边创立一个images文件夹放需求显现的图片

Flutter-Package插件的开发、发布、使用

再次更新版别号0.0.2,然后履行上传。而且需求在运用你包的工程里边详细途径的引进,不然就会报图片找不到

Flutter-Package插件的开发、发布、使用

这样再次更下了0.0.2的包后,运行工程发现图片运用正常的

Flutter-Package插件的开发、发布、使用

其实封装的包里边包括图片运用非常不方便,他人运用你的库还需求引进你运用的详细图片途径,不然就无法正常显现。其实更主张少用图片,或者在包里暴露出传图片的属性。

优化 Package

这个时分看咱们上传的包,只要100分,满分有130分,需求添加对应的包描绘60-80字,而且需求添加一个示例Demo

添加Example

Flutter-Package插件的开发、发布、使用

咱们能够运用上面创立的flutter_custom_dialog 工程代码,在包里边创立一个example文件,把main.dart代码复制到这儿。然后依旧在终端查看包有没有问题,没有问题开端履行上传操作,这个时分示例代码就被传上去了,而且还是空安全的。

Flutter-Package插件的开发、发布、使用

Flutter-Package插件的开发、发布、使用

这儿的评分只要110分,一个是描绘需求装备,一个是API的个数不够,这两个填写完就能够达到130分了。

Flutter-Package插件的开发、发布、使用

添加功用模块

在往常的开发中,咱们看其他人开发的包也能够看出,并不想把所有的文件的内容爆露出来,而只是爆露出对应的运用,完成的过程是看不到的。

  • 我这儿重新创立了一个文件custom_dialog.dart 文件,在里边完成对应功用,然后爆露给package_dialog_demo.dart
part of 'package_dialog_demo.dart';

Flutter-Package插件的开发、发布、使用

  • package_dialog_demo.dart中导入,一些其他文件需求导入的文件只需求在这儿导入就能够了
part 'custom_dialog.dart';

Flutter-Package插件的开发、发布、使用

Package 包里边的代码

import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
//定义枚举类型
enum DialogType { upgrade, alert }
class CustomDialog extends Dialog {
  final String? title; //标题
  final String? content; //内容
  final DialogType? dialogType;
  final void Function()? cancelCallBack;
  final void Function()? confirmCallBack;
  CustomDialog(
      {this.title,
      this.content,
      this.dialogType,
      this.confirmCallBack,
      this.cancelCallBack});
  @override
  Widget build(BuildContext context) {
    switch (this.dialogType) {
      case DialogType.upgrade:
        return Material(
          type: MaterialType.transparency,
          child: Center(
            child: upgradeDialog(context),
          ),
        );
        break;
      case DialogType.alert:
        return Material(
          type: MaterialType.transparency,
          child: Center(
            child: customAlertDialog(context),
          ),
        );
        break;
      default:
        return Material(
          type: MaterialType.transparency,
          child: Center(
            child: upgradeDialog(context),
          ),
        );
    }
  }
  Widget customAlertDialog(BuildContext context) {
    return Container(
      height: 300,
      margin: EdgeInsets.only(left: 40, right: 40),
      color: Colors.white,
      child: Column(
        children: [
          Padding(
            padding: EdgeInsets.all(20),
            child: Stack(
              children: [
                Align(
                  child: Text(
                    title!,
                    style: TextStyle(fontSize: 20, color: Color(0xFF2D2D2D)),
                  ),
                ),
                Align(
                  alignment: Alignment.centerRight,
                  child: InkWell(
                    child: Icon(Icons.close),
                    onTap: () {
                      Navigator.of(context).pop();
                    },
                  ),
                ),
              ],
            ),
          ),
          Divider(),
          Container(
            width: double.infinity,
            margin: EdgeInsets.all(10),
            child: Text(
              content!,
              textAlign: TextAlign.left,
            ),
          )
        ],
      ),
    );
  }
  Widget upgradeDialog(BuildContext context) {
    return Container(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Container(
            margin: EdgeInsets.only(left: 20, right: 20),
            decoration: const ShapeDecoration(
              color: Color(0xfff2f2f2),
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.all(
                  Radius.circular(10),
                ),
              ),
            ),
            child: Column(
              children: [
                Container(
                  height: 250,
                  decoration: const BoxDecoration(
                      borderRadius: BorderRadius.only(
                          topLeft: Radius.circular(10),
                          topRight: Radius.circular(10)),
                      image: DecorationImage(
                        image: AssetImage('images/head_icon.png'),
                        fit: BoxFit.cover,
                      )),
                ),
                SizedBox(
                  height: 20,
                ),
                Container(
                  padding: EdgeInsets.only(left: 10, right: 10),
                  width: double.infinity,
                  child: const Text(
                    '本次更新',
                    style: TextStyle(
                        fontSize: 20,
                        color: Color(0xFF2D2D2D),
                        decoration: TextDecoration.none),
                    textAlign: TextAlign.left,
                  ),
                ),
                SizedBox(
                  height: 15,
                ),
                Container(
                  padding: EdgeInsets.only(left: 10, right: 10),
                  width: double.infinity,
                  child: Text(
                    '解决了一些已知问题',
                    style: TextStyle(
                        fontSize: 16,
                        color: Color(0xFF333333),
                        decoration: TextDecoration.none),
                    textAlign: TextAlign.left,
                  ),
                ),
                SizedBox(
                  height: 20,
                ),
                Divider(),
                Container(
                  height: 40,
                  margin: EdgeInsets.only(bottom: 15),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceAround,
                    children: [
                      TextButton(
                        onPressed: () {
                          Navigator.of(context).pop();
                          this.confirmCallBack!();
                        },
                        child: Text(
                          '升级',
                          style: TextStyle(fontSize: 18),
                        ),
                      ),
                      VerticalDivider(
                        color: Colors.grey,
                        width: 1,
                      ),
                      TextButton(
                          onPressed: () {
                            Navigator.of(context).pop();
                            this.cancelCallBack!();
                          },
                          child: Text('暂不升级', style: TextStyle(fontSize: 18))),
                    ],
                  ),
                )
              ],
            ),
          )
        ],
      ),
    );
  }
}

Flutter-Plugin插件的开发、发布、运用

参考文章:flutterchina.club/developing-…

欢迎重视、点赞及转发。