uniApp实战三自定义插件的实现
uniApp实战三：自定义插件的实现
1.最终效果预览
2.页面布局
定义一个按钮触发点击事件
<view @click="testClick">
<text >调试</text>
</view>点击方法如下
testClick(){
const dcRichAlert = uni.requireNativePlugin('yichen-test');
dcRichAlert.testAsyncFunc({
title: "提示信息",
name: '张三'
}, result => {
console.log('result: ', JSON.stringify(result));
});
}3.插件开发
在AS中我们引入uni官方提供的示例UniPlugin-Hello-AS右键新建Module并定义类继承UniModule如下，添加一个testAsyncFunc方法，即上一步方法中调用的方法
public class MyTest extends UniModule {
String TAG = "MyTest";
public static int REQUEST_CODE = 1000;
//run ui thread
@UniJSMethod(uiThread = true)
public void testAsyncFunc(JSONObject options, UniJSCallback callback) {
if(callback != null) {
JSONObject data = new JSONObject();
data.put("code", "success");
data.put("age", 123);
data.put("title", options.getString("title"));
data.put("name", options.getString("name"));
Log.e(TAG, "testAsyncFunc--"+data.toString());
callback.invoke(data);
}
}
//run JS thread
@UniJSMethod (uiThread = false)
public JSONObject testSyncFunc(){
JSONObject data = new JSONObject();
data.put("code", "success");
return data;
}
@Override
public void onActivityResult(int requestCode, int resultCode, Intent data) {
if(requestCode == REQUEST_CODE && data.hasExtra("respond")) {
Log.e("TestModule", "原生页面返回----"+data.getStringExtra("respond"));
} else {
super.onActivityResult(requestCode, resultCode, data);
}
}
}在app目录中的assets目录下找到dcloud_uniplugins.json，把我们刚才新建的插件定义上
{
"plugins": [
{
"type": "module",
"name": "yichen-test",
"class": "com.example.uniplugin_mytest.MyTest"
}
]
},type对应的值固定为module,name中的值自己定义，当在uni中使用插件会用到，class中的值为我们插件写的类所在的包名+类名
4.编译uni页面
如下图所示生成本地打包资源
打包资源生成后将\unpackage\resources目录下的文件拷贝到AS工程\UniPlugin-Hello-AS\app\src\main\assets\apps目录下并将assets\data目录下的dcloud_control.xml中appid对应的值改为uniApp项目的包名
5.平台申请离线key
在https://dev.dcloud.net.cn/pages/app/list 平台中找到我们新建的应用，点击应用名称然后选择各平台信息,填写应用的包名、SHA1值、SHA256，这几个值根据自己打包的证书文件查看即可,填写完会生成离线key,将key值拷贝,找到AndroidManifest.xml文件并找到如下代码，替换其中的xxxx即可
<meta-data
android:name="dcloud_appkey"
android:value="xxxxx" />6.根据证书文件查看SHA1及SHA256值
将安装的jdk的bin添加到系统变量中以便我们能访问keytool工具，打开cmd命令窗口输入如下命令查看证书文件的值
keytool -list -v -keystore D:\xxx.keystore输入密码回车即可查到sha1及sha256的值，xxx.keystore如果没有可以用as新建一个，点几下就行。
7.将模块编译为aar包并生成插件
在AS工程右侧找到自己的插件模块 然后点击如下图所示生成aar包
在HbuilderX中新建如下图所示目录集成
注意package.json和android文件夹同级，这里官网应该写错了放到android文件夹里面去了，这样会导致本地找不到这个插件建好后可以将下列内容拷贝到package.json文件中，或者在插件跟目录下执行npm init一样会生成但是也是需要修改里面信息的
{
"name": "uniPluginsTest",
"id": "yichen-test",
"version": "1.0.0",
"description": "uniPluginsTest",
"_dp_type":"nativeplugin",
"_dp_nativeplugin":{
"android": {
"plugins": [
{
"type": "module",
"name": "yichen-test",
"class": "com.example.uniplugin_mytest.MyTest"
}
],
"integrateType": "aar"
}
}
}_dp_type对应的值是固定的 plugins中的值直接和第三步插件开发dcloud_uniplugins.json中的值一样就行，integrateType得值固定为aar
8.勾选本地插件并打自定义基座包
在HbuilderX中找到manifest.json然后如下图勾选插件，然后再选云打包，打自定义基座包即可。
