官方文档:原生开发者支持
创建module
- 点击File=>New=>New Module
- 选择Android Library,输入module 名称与包名 ;假设:uniplugin_test
3.初始化完成,就代表uniplugin_test 创建好了
创建类
开发目录主要在这个项目下:
- 右击com.wql.uniplugin_test目录=>New=>Java Class
2.配置module工程依赖:build.gradle
//导入aar需要的配置 repositories { flatDir { dirs 'libs' } } dependencies { //必须添加的依赖 compileOnly 'androidx.recyclerview:recyclerview:1.0.0' compileOnly 'androidx.legacy:legacy-support-v4:1.0.0' compileOnly 'androidx.appcompat:appcompat:1.0.0' compileOnly 'com.alibaba:fastjson:1.1.46.android' compileOnly fileTree(include: ['uniapp-v8-release.aar'], dir: '../app/libs') }
3.配置App build.gradle,引入插件
4.写一个testAsyncFunc 方法
package com.wql.uniplugin_test; import android.util.Log; import com.alibaba.fastjson.JSONObject; import io.dcloud.feature.uniapp.annotation.UniJSMethod; import io.dcloud.feature.uniapp.bridge.UniJSCallback; import io.dcloud.feature.uniapp.common.UniModule; public class TestModule extends UniModule { //run ui thread @UniJSMethod(uiThread = true) public void testAsyncFunc(JSONObject options, UniJSCallback callback) { //前端请求testAsyncFunc方法,将返回 code:success if(callback != null) { JSONObject data = new JSONObject(); data.put("code", "success"); callback.invoke(data); } } }
配置插件
Build
到此,插件包文件已经成功
【注意】所有涉及到版本号的必须统一,否则build 会失败
插件调试
以本地注册插件为例
添加注册的Module
在 “app” Module根目录assets/dcloud_uniplugins.json文件。 在moudles节点下 添加你要注册的Module 或 Component
uni-app 项目中配置插件
新建nativePlugins
新建插件目录
引入插件arr文件
复制打包好的文件,到 uni-app 插件 android 目录
配置json文件
具体语法:原生开发者支持
App原生插件配置
然后重新生成android 自定义基座
发现打包报错,是由于版本问题,重新配置一下minSdkVersion
使用原生插件
<template> <view class="content"> <image class="logo" src="/static/logo.png"></image> <view class="text-area"> <text class="title">{{title}}</text> </view> <button @tap="handel">点击调用插件方法</button> </view> </template> <script> const wqlTest = uni.requireNativePlugin('WQL-Test'); export default { data() { return { title: '看到 你就成功了' } }, onLoad() { }, methods: { handel(){ console.log(wqlTest) wqlTest.testAsyncFunc({name:'test'},(res)=>{ uni.showModal({ title: '提示', content: JSON.stringify(res), success: function (res) { if (res.confirm) { console.log('用户点击确定'); } else if (res.cancel) { console.log('用户点击取消'); } } }); }); } } } </script> <style> .content { display: flex; flex-direction: column; align-items: center; justify-content: center; } .logo { height: 200rpx; width: 200rpx; margin-top: 200rpx; margin-left: auto; margin-right: auto; margin-bottom: 50rpx; } .text-area { display: flex; justify-content: center; } .title { font-size: 36rpx; color: #8f8f94; } </style>
我们现在android 项目中调试,先把原生插件测试好,在到uni-app项目中调试
复制此目录到
运行项目(使用模拟器)
说明插件已经ok啦
插件成功,就可以直接在uni-app 项目引入进行测试就好了,将不再赘述。
【注意】如果遇到缺少依赖等其他情况,可以Clean Project or Rebuild Project