Uni-APP 安卓原生插件开发及使用

一、开发环境

  • jdk 1.8
  • android studio
  • 2.9.8+ 的 android平台SDK

下载SDK
在这里插入图片描述
这里 UniPlugin-Hello-AS工程 是一个示例项目可以看一下:
在这里插入图片描述下面会借用里面的uniplugin_module。

二、新建uniapp项目

参考过程

三、搭建本地编译环境

在android studio 导入SDK里的 HBuilder-Integrate-AS项目。

四、开发步骤

本文只是演示uniapp集成原生插件的过程,下面直接借用了uniplugin_module项目。

1. 编译示例中的uniplugin_module,生成aar

在这里插入图片描述找到生成的aar:
在这里插入图片描述

2. 在 HBuilder项目里添加插件

目录格式(在项目根目录创建nativePlugins目录):
在这里插入图片描述

4.2.1 package.json内容:

{
    "name": "TestModule",
    "id": "TestModule",
    "version": "0.1",
    "description": "connect",
    "_dp_type":"nativeplugin",
    "_dp_nativeplugin":{
        "android": {
            "plugins": [
                {
                    "type": "module",
                    "name": "TestModule",
                    "class": "io.dcloud.uniplugin.TestModule"
                }
            ],
            "hooksClass": "",
            "integrateType": "aar",
            "dependencies": [
            ],
            "compileOptions": {  //可选,Java编译参数配置
                "sourceCompatibility": "1.8",
                "targetCompatibility": "1.8"
            },
            "abis": [
                "armeabi-v7a",
                "x86",
				"arm64-v8a"
            ],
            "minSdkVersion": "21",
            "permissions": [
                ""
            ],
            "parameters": {
              
            }
        }
    }
}

4.2.2 配置manifest.json

在这里插入图片描述

3. 在本地编译环境中添加插件

src/main/assets/ 下新建文件: dcloud_uniplugins.json
在这里插入图片描述内容如下:

{
  "nativePlugins": [
    {
      "plugins": [
        {
          "type": "module",
          "name": "TestModule",
          "class": "io.dcloud.uniplugin.TestModule"
        }
      ]
    }
  ]
}

五、在vue中使用插件

	const modal = uni.requireNativePlugin('modal');
	var testModule = uni.requireNativePlugin("TestModule");
	testModule.testAsyncFunc({'name':'unimp','age':1},
	(ret)=>{
		modal.toast({
			message:ret,
			duration:1.5
		});
	})

六、编译项目及使用

1. 生成资源包

在这里插入图片描述

2. 拷贝生成的目录放到android studio下

在这里插入图片描述

3. 修改 src/main/assets/data/dcloud_control.xml

在这里插入图片描述
运行项目,就可以通过vue调用android原生代码了。

uni-app本身没有提供原生的语音识别插件,但你可以通过uni-app原生插件扩展功能来实现语音识别。具体的步骤如下: 1. 首先,确定你想要使用的语音识别插件。在uni-app中,你可以选择使用第三方语音识别插件,例如科大讯飞、百度语音等。你需要根据插件的文档进行相应的配置和集成。 2. 在uni-app项目创建一个原生插件的目录。你可以在项目根目录下的`uni_modules`目录中创建一个新的目录,例如`uni-plugin-voice`。 3. 在插件目录中创建一个`manifest.json`文件,用于配置插件信息。在`manifest.json`中,你需要指定插件的名称、版本号、依赖等信息。具体的配置可以参考uni-app插件开发文档。 4. 在插件目录中创建一个原生代码的目录,例如`ios`和`android`。 5. 在原生代码目录中,根据平台分别实现对应的语音识别功能。你可以使用iOS和Android各自的语音识别API,或者调用第三方语音识别SDK来实现功能。具体的实现方式会因为使用的语音识别插件而有所不同,你需要参考对应插件的文档进行具体操作。 6. 编译和集成原生插件。根据插件的要求,进行相应的编译和集成操作。对于iOS平台,你需要将插件目录添加到Xcode项目中,并配置相应的依赖关系。对于Android平台,你需要将插件目录添加到Android Studio项目中,并配置相应的依赖关系。 7. 在uni-app的页面中使用语音识别功能。你可以在表单输入框的组件中添加一个触发语音识别的按钮或图标,并在对应的事件处理函数中调用原生插件提供的接口进行语音识别。 请注意,以上步骤是一个大致的流程,具体的实现方式和步骤可能会因为你选择的语音识别插件而有所不同。在实际操作中,你需要根据所用插件的文档和示例代码进行相应的调整和修改。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

编程圈子

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值