背景
im 中台的聊天室需要一个类似微信的相册选择器的功能,因此我们打算实现一个相册 plugin
我们使用 photo_manager ,获取相册和资源信息。
在 photo_manager 源代码基础上进行了业务层的封装。
flutter plugin 是什么
如下官网所述,简单来说分为两种
dart package : 纯 dart 实现,在 flutter 工程中使用
plugin package: dart 实现,但是需要和原生平台通信(MethodChannel) 我们的相册选择器是后者,但 photo_manager 帮我们做了原生的实现这一部分
实现 plugin 入门
功能
抹平 ios 和安卓端调用差异。eg.请求相册权限
展示相片 list
切换相册
预览照片
跨相册选择图片
发送照片
接入指北 🐶
项目中提供了 example 的使用示例,接入时可使用同样方式,我们来康康
first step 初始化一个 flutter 工程
second step
在 pubspec.yaml 引用相册选择器 plugin
third step
在 lib/main.dart (或者你需要的入口) new 一下我们的 indexPage 对象,即可打开相册选择器
import 'package:photo_manager/page/index.dart';
......
......
_scanGalleryList() async {
// await provider.refreshGalleryList();
Navigator.of(context).push(MaterialPageRoute(builder: (BuildContext context) {
// 控制器
SelectedPhotosController contreoller = SelectedPhotosController()
// 在需要的时候实例化
return IndexPage(controller);
}));
}
done!
plugin 实现
plugin 结构图
项目代码结构
我拉了 photo_manager 的代码下来改(其他同学不需要可以直接新建一个 plugin 工程引用线上 photo_manager 包),只修改了 lib,这里只展示 lib 的结构。(未标注部分为源码原有)
1 做为一个 plugin 考虑不用 provider 做数据管理,因此我改掉了 photo_manager 的 provider_util.dart 文件,如下图所示, 使用一个 controller 对象,负责操作数据对象,有 get 和 set 方法,可以操作 photoutil(所有相册实体),pathutil(当前相册的所有资源实体)对象,并在 set 方法中定义时使用 setstate,达到视图更新的目的
数据 photoutil(所有相册实体),pathutil(当前相册的所有资源实体)对象,存储在页面(index.dart)中.
//gallery_list_page.dart
// index.dart
2 相册操作使用 flutter package ,photo_manager,photomanager.dart 是这个包所有方法的出口,有兴趣的同学可以康康 photo_manager 是如何实现的
import 'dart:async';
import 'dart:io';
import 'dart:typed_data';
import 'dart:ui';
import 'package:flutter/foundation.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter/services.dart';
import 'package:photo_manager/src/utils/convert_utils.dart';
import 'src/plugin.dart';
export 'src/plugin.dart';
part './src/manager.dart';
part './src/type.dart';
part './src/entity.dart';
part './src/notify.dart';
part './src/editor.dart';
后续改造--TODO
1 考虑使用 InheritedWidget 做数据状态的管理,本文将 controller 放在最上层的缺点显而易见,就是不能局部刷新,并且子组件不能监听到数据的变化。
2 本项目的代码结构不够规范,有待优化,数据操作比较混乱,不易读,第一次尝试实现 plugin,结构上比较糙。
总结
1 经过实践 此插件没有 androidX 的兼容问题
2 感谢实现过程中大家的建议!
3 欢迎大嘎的 批评 意见 留言~~~~!🐶