uniapp使用安卓原生插件(包含插件带第三方jar)

前言:

为了公司需要uniapp引用一个第三方的jar包实现相关功能,只好用安卓封装这个第三方jar包,然后自己将api封装实现,再暴露给uniapp使用。
第一次研究安卓,若有啥不对的,或者写得不好的地方,请大家指正,努力学习,一直进步。

一、安装相关工具和环境

1、jdk1.8环境(略)
2、Android studio官网下载 或者 Android Studio中文社区
3、Android studio安装教程
4、最新Android离线SDK下载
5、自有证书生成

二、开发

  1. 安装好android studio后,导入离线SDK中UniPlugin-Hello-AS安卓项目

在这里插入图片描述
2. 菜单中File–>Open,打开之前下载的SDK中的UniPlugin-Hello-AS
在这里插入图片描述
导入后,等待下载相关依赖,根据提示去补全sdk。确认没有错误后即可。

三、构建组件

在项目根目录右击new——>Module——>Android Library——>next
在这里插入图片描述
在这里插入图片描述
到此创建完成。

1)先编辑组件目录的build.gradle文件。在最后面找到dependencies节点,修改内容


dependencies {
    compileOnly fileTree(dir: 'libs', include: ['*.jar'])

    compileOnly fileTree(dir: '../app/libs', include: ['uniapp-v8-release.aar']) 


    implementation 'androidx.appcompat:appcompat:1.3.0'
    implementation 'com.google.android.material:material:1.4.0'
    testImplementation 'junit:junit:4.13.2'
    androidTestImplementation 'androidx.test.ext:junit:1.1.3'
    androidTestImplementation 'androidx.test.espresso:espresso-core:3.4.0'
}

2)在src–>main–>java中,新建Java类,继承io.dcloud.feature.uniapp.common.UniModule,然后就可以在里面写自己的业务逻辑啦。
在这里插入图片描述

3)在app模块的assets中的dcloud_uniplugins.json文件中,注册组件
在这里插入图片描述
4)在app模块下添加新建的组件
在这里插入图片描述

四、添加第三方jar包

1、将jar包拷贝到libs目录下

在这里插入图片描述

2、右键添加jar包Add as Library…

在这里插入图片描述

3、在之前的java类中封装第三方jar包

在这里插入图片描述

4、封装好方法后,在右侧的Gradle双击assembleRelease进行打包

在这里插入图片描述

5、在build的output中的aar目录下生成了arr包

在这里插入图片描述

6、新建HBuild X 项目

在这里插入图片描述

7,编辑pages下的index中的index.vue文件

<template>
	<view class="content">
		<view class="button1">
			<button @click="showToast(message)">直接显示</button>
		</view>
		<view class="button2">
			<button @click="processData(waitprocessdata)">回调</button>
		</view>
		<view class="button3">
			<button @click="encoder(encoderStr)">编码字符串</button>
		</view>
		<view class="button4">
			<button @click="decoder()">解码字符串</button>
		</view>
	</view>
</template>

<script>
	const ToastPlusModule = uni.requireNativePlugin("toastPlusTest")
	export default {
		data() {
			return {
				message: '我是直接显示的数据',
				waitprocessdata: '我是待处理的数据',
				decoderStr: "",
				encoderStr: "我是一个被编码和解码的数据"
			}
		},
		onLoad() {

		},
		methods: {
			encoder(data) {
				console.log("23132213")
				ToastPlusModule.encoder(data, res => {
					console.log("1111111")
					this.decoderStr = res
					uni.showToast({
						title: "编码数据--->" + res,
						icon: 'none',
						duration: 2000
					});
				})
			},
			decoder() {
			 ToastPlusModule.decoder(this.decoderStr, res => {
					uni.showToast({
						title: "解码数据-->" + res,
						icon: 'none',
						duration: 2000
					});
				})


			},
			showToast(message) {
				ToastPlusModule.showToast(message)
			},
			processData(data) {
				ToastPlusModule.processData(data, res => {
					ToastPlusModule.showToast(res)
				})
			}
		}
	}
</script>

<style>
	.button1 {
		display: flex;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.button2 {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		margin-top: 100rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.button3 {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		margin-top: 100rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.button4 {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		margin-top: 100rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}
</style>

8、在uniapp项目中新增文件结构如下

在这里插入图片描述

9、将android studio中生成的aar包放入android目录中,并新建package.json文件内容如下

{
    "name": "toastPlusTest", //这是插件的名称
    "id": "toastPlusTest", //插件的唯一标识,与下方的plugins中的name一致
    "version": "1.0.0",  //版本号
    "description": "原生Toast", //描述
    "_dp_type":"nativeplugin",
    "_dp_nativeplugin":{
        "android": {
            "plugins": [
                {
                    "type": "module",  //类型
					"name":"toastPlusTest", //名称,与上方的id一致即可
                    "class": "com.haxk.uniapptest.ToastPlus" //class路径
                }
            ],
            "integrateType": "aar" 
        }    
    }
}

10、设置manifest.json的基础配置,并添加原生插件配置

在这里插入图片描述

11、然后自定义基座打包

在这里插入图片描述

然后将得到的.apk文件安装在手机上,就可以测试uniapp调用android原生开发的插件(包含调用第三方的插件)

12、拓展,将uniapp直接植入android中运行查看效果

1、在开发者中心去申请appkey

在这里插入图片描述

2、将生成的appkey加入app模块的AndroidManifest.xml文件中

在这里插入图片描述

3、将项目生成本地资源

在这里插入图片描述

4、将打好的包放入app模块中的apps下(注意appid)

在这里插入图片描述

5、修改dcloud_control.xml中的appid

在这里插入图片描述

6、修改app模块中的build.gradle中的证书信息

在这里插入图片描述

五、注意事项

1、Gradle版本设置

在这里插入图片描述

2、http Proxy设置

在这里插入图片描述

3、Android SDK设置

在这里插入图片描述
在这里插入图片描述

4、注意主项目下的build.gradle中gradle版本和android版本一致

在这里插入图片描述

5、模块中的配置

在这里插入图片描述

6 、右侧的gradle中无tasks

在这里插入图片描述
然后同步等待

在这里插入图片描述

  • 15
    点赞
  • 79
    收藏
    觉得还不错? 一键收藏
  • 32
    评论
uni-app集成 Android 原生插件需要进行如下步骤: 1. 在项目根目录下创建 `nativeplugins` 目录,用于存放 Android 原生插件。 2. 在 `nativeplugins` 目录中创建插件Android Studio 项目,例如插件名为 `myplugin`,则创建路径为 `nativeplugins/myplugin/android/`。 3. 在 `myplugin` 的 Android 项目中,将插件打包成 `.aar` 格式的库文件。 4. 将 `.aar` 格式的库文件放到 `myplugin` 的 `libs` 目录下。 5. 在 `myplugin` 的 `build.gradle` 文件中添加如下配置: ```gradle repositories { flatDir { dirs 'libs' } } android { ... defaultConfig { ... ndk { abiFilters "armeabi-v7a", "x86" } } ... buildTypes { release { ... proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro' } } } dependencies { implementation(name:'myplugin', ext:'aar') ... } ``` 在上述配置中,`repositories` 中的 `flatDir` 配置用于让 Gradle 知道 `.aar` 文件的位置,`implementation` 配置用于将插件库文件添加到项目中。 6. 在 uni-app 项目的 `manifest.json` 文件中,将插件添加到 `app-plus -> android -> plugins` 中。例如: ```json { "app-plus": { "android": { "plugins": { "myplugin": { "version": "1.0.0", "provider": "com.example.myplugin.MyPluginProvider" } } } } } ``` 在上述配置中,`version` 用于指定插件版本号,`provider` 用于指定插件的提供者类路径。 7. 在 uni-app 项目的 `pages.json` 文件中,将插件的页面添加到 `pages` 中。例如: ```json { "pages": [ { "path": "pages/index/index", "style": { "navigationBarTitleText": "首页" } }, { "path": "pages/myplugin/myplugin", "style": { "navigationBarTitleText": "插件页面" } } ] } ``` 在上述配置中,`path` 用于指定插件页面的路径。 8. 在 uni-app 项目中,通过 `uni.requireNativePlugin('myplugin')` 来使用插件功能。 以上是集成 Android 原生插件uni-app 的步骤和注意事项,希望对你有帮助。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 32
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值