Flutter 自定义插件(一)
最近工作中遇到Flutter插件的开发使用,由于当前市面上有关Flutter的相关文档很少,所以就困惑了好久,卡在了一个特别简单的问题上,所以我现在赶紧记录下,别到时候又给忘记了。
今天我先从创建插件的最开始讲。
我用的编辑器是 Android Studio ,版本号是这个:

Flutter SDK 版本是 3.0.5,当然我们也可以在这里选择更改Flutter版本号哦。
插件的创建
我们可以通过两种方式创建插件,一种是使用IDE创建(Android studio 或者Idea),另一种是通过命令来创建的
使用IDE创建
1.
根据图中所示的操作,File -- New -- New Flutter Porject........;

选择Flutter, 然后选择插件的Flutter sdk 版本号, 点next 下一步;
3.

编辑Project Name-- 插件名字,Project type -- 下拉选择 plugin 插件类型, 然后选择Android,IOS 编辑语言, 点finish 就创建了一个Flutter 插件项目。
使用命令创建插件
flutter create --org com.example --template=plugin plugin_name
其中 com.example 是插件包名的一部分,plugin_name 是插件的名称。插件的完整包名为 com.example.plugin_name
插件的目录结构
当我们打开这个插件项目之后,我们会发现他的目录是这样的,

分为4部分,Android , IOS, lib文件夹,example示例demo;Android目录是一个完整的Android项目,用来开发Android端的插件功能;example用来测试Android端或者IOS端的插件功能,IOS 目录是一个完整的IOS项目,用来开发IOS端的插件功能;lib目录中的文件负责和Android 或者Ios端的交互。
划重点了哟!当你的Android studio版本是这个,目前最新的版本,

这时你就会发现打开Android目录下自动生成的plugin文件都报错,io.flutter包下面的文件都找不到,

我觉得找不到的原因可能是studio,gradle 版本不同导致的,(因为我同事的studio版本比我的低,就不报错,)这样的话,我就得纯粹的手写,它一点都不提示代码,也不知道哪里写的是错误的,只有当我运行的时候他才提示我错误,这岂不是很烦人。
这个就困惑了我半天,后来咨询了一个Flutter资深的小伙伴, 他说,我们需要运行example 示例demo下的Android来进行开发,因为本身插件就是依附在example 示例代码中的来测试运行 的,所以当你打开运行example 下的Android时,你会发现,插件下的Android目录也会显示存在。


这时就可以导入包,正常的进行编辑啦!