一、简介
前言,注意首先如果单纯的js与原生混合开发并不建议使用uni插件开发,开发周期将近1个半月其中大量时间都是用在采坑上,而且官方的坑不会100%在社区给你解决,途径只有自己研究,截止目前更新后续插件还会遇到奇葩的问题,目前也是无法解决,原因①调试过程无法获取很多的报错信息,比如一个按钮点击无反应任何报错提示没有全靠猜,②文档问题,我开发过程前期靠文档开发,结果后来问官方,结果说我使用的方式不再维护更新,然后推翻从来,我当时笑了,而且就算你找到文档,也不会百分比看懂(用过的都懂),其他原因就不一一说了,这里建议如果单纯的js与原生混合开发,建议使用其他框架进行混合开发,作为原生开发者个人感觉使用Uni开发完一整套app(很多功能也不支持),不比原生容易很多,还是建议开发者自己斟酌,好废话就这么多了。
此文档用于记录和说明Uni插件开发过程, 以及后期其他开发包开发须知和一些注意事项。
重点~,开发完成之后,后期维护一定要仔细检查全部文件是否都更新完成(*HbuilderX在你出现错误的时候不会给你很多提示),所以需要仔细检查更新的插件文件。
二、开发准备
2.1 工具准备:
① android studio (以下简称AS) ② HBuilderX
2.2 资料准备:
客户和开发者需要用到HBuilderX 进行混合开发app,此demo为最终客户使用的项目demo.
此demo更偏向于原生开发者,使用HBuilderX 打包js等项目资源,在AS中引用.(注*推荐使用已经开发好的demo进行改造)
uni-app官方文档:uni-app原生插件(native plugin)开发指南
Uni-app android端插件开发文档: uni-app android 插件开发文档
2.3 AS项目架构:
授权以及核心文件可忽略
2.4 HBuilderX 项目架构:
三、开发步骤
3.1 调试AS项目
3.1.1 在AS导入as的demo(例如:导入UniVinProject)
如图方式导入你准备好的AS项目的demo,这里推荐使用已经完成的项目demo进行导入后续在进行修改.
导入已有项目之后目录如下:
熟悉了大概的目录结构,首先UNI_3B45678这个H5界面文件如何生成后续再HBuliderX项目中会提到.
然后看下assets中的授权文件和核心文件
授权文件:开发包中的授权文件即可放在图中文件夹下
核心文件: 为深度学习核心文件,也就是非深度学习文件可以忽略不添加这3个文件
Androidmainfest.xml: 此文件导入之后不需要大幅度更改唯一更改如下图
根据开发包的权限设置对应增加或者修改权限配置
3.1.2 在项目中导入开发核心库module(VinLibrary) (*注此库为公司项目需要,开发者可以忽略)
3.1.3 手动生成桥接module(uniplugin_vin)
命名好你自定义桥接库的名字如:uniplugin_vin
uniplugin_vin创建好后在java目录下创建好例如univinmodule的桥接类文件
uniplugin_vin中的 build文件配置如下
然后需要看下桥接类文件的配置UniVinModule.java文件的配置:
首先以视频流识别为例子,注意此方法在h5端调用所以方法头部用@JSMethod(uiThread = ture) 注释
配置如下方法用来接收识别结果并将结果回调给h5界面:
此外还需要配置下权限回调方法:
配置好以上2个module之后我们来看下主项目的配置:
看下build.gradle的配置: 红框中需要配置之前创建好的桥接库
以上AS项目配置完毕, 下面开始配置HBuilderX项目的资源,也就是H5端的界面以及如何调用我们的核心库
3.2 调试HBuilderX 项目
3.2.1 在HBuilderX 中引入之前准备的HBuilderX的demo:
选择准备好的demo
导入项目之后的结构
导入之后找到如下图文件: 此文件为H5界面的文件 也就是调用我们刚刚在AS项目中配置的桥接类的使用者,但是我们现在需要把这个H5界面生成APP资源在我们刚刚的AS项目中进行调试和应用.
找到文件后打开配置我们需要调用的代码:
定义点击按钮
以视频流识别为例, 添加调用视频流识别的方法
注意:上图中的插件名称对应下图Hbuilderx项目中的插件名
定义好以上这些我们需要在HBuilderX项目中配置文件中进行相关配置:
找到项目中的插件目录下的配置文件(因为导入的项目是已经完成的插件所以会自带,如果是新建的项目,则需要自己创建此插件VinPluginModule)
打开文件package.json:
class要和你的as项目中桥接类包路径一致,在上面例子中调用视频流会用到android 下的name 来调用桥接类
在HBuilderX 中打包好项目资源文件
将打包好的资源文件放入AS项目中的assets/apps下文件
找到data中的dcloud_control.xml文件
确定配置的id为之前生成的app资源名称一致
3.3 生成插件文件
3.3.1 打包AS项目中桥接module以及核心识别库的module
测试通过可打包好插件包相关文件
使用此程序生成桥接module的arr打包文件
核心库module同样打包成arr文件
生成之后在对应的module下的build-outputs-arr文件下:
3.3.2 插件文件结构
①打包好需要的module,生成的arr文件集成到HbuilderX项目中
②以及libs文件和assets下的资源文件
③插件配置文件
3.3.3 确认插件配置文件
由于前面步骤以及配置过这里,需要确认插件配置文件是否配置正确
* 配置插件名称和id要和你的插件文件名一一对应
* plugins下的name以及class配置需要特别注意,此处name 用于你再H5页面调用时的名称,class则代表桥接类的包名路径(也就是在as项目中可以看到的桥接类的包名路径)是一一对应的
下面还有分别有abis 中cpu类型设置, permissions 权限配置等
3.4 uni-app原生插件本地配置
将原生插件配置到uni-app项目的“nativeplugins”下,还需要在manifest.json文件的“App原生插件配置”项下点击“选择本地插件”,在列表中选择需要打包生效的插件:
3.5 自定义基座配置
自定义调试基座是使用开发者申请的第三方SDK配置生成的基座应用,用于HBuilder/HBuilderX开发应用时实时在真机/模拟器上查看运行效果。(注:iOS仅支持真机运行自定义基座,不能使用xcode模拟器运行自定义基座)
在修改好manifest配置后,在HBuilder/HBuilderX中点击菜单栏“运行”->“运行到手机或模拟器”->“制作自定义基座”生成自定义基座安装包:
打包成功后需要在以下位置确保开启自定义调试基座功能:
然后就可以像运行到HBuilder标准运行基座那样,运行你的工程到手机/Android模拟器上,查看控制台日志信息。
注意:自定义调试基座是测试版,不可直接商用(使用自定义调试基座覆盖安装apk不会更新应用资源,并且有toast警告)。正式发版时需要按正常打包方式重新打包。
配置好可以在HBuliderX中进行使用和测试了
四、注意事项
1.新增混合开发插件包: 使用现有的demo 进行改造生成新的插件包,否则有可能出现找不到某些文件等问题.
五、常见问题
1. 点击识别无法调用核心部分,没有反应
此问题为导入依赖核心库不成功或者为桥接类中调用配置错误导致,请仔细检查现有demo中方式进行配置,也可能由于官方的坑导致无法调用成功,目前没有任何解决方案,官方社区更是没法指望。
2. 参照官方文档集成问题
官方文档新旧文档鱼龙混杂,导致很难找到正确文档集成开发,所以新增开发包尽量在已有成熟的开发包基础上进行改造新增即可,可避免一些问题.
3. 调用提示找不到由aseets下保存到安卓内部存储的文件
此原因为uni混合开发项目中无法读取到内部存储下的文件,具体原因未知,开发如遇到此问题,一般为自己创建的混合开发项目会出现这类问题,所以推荐在现有插件包改造新增.
4.找不到调用的识别库activity
如图,正常的这种导入原生资源是没问题的,如果参照官方文档这部分官方要求用compile 方式导入资源会导致,我们在桥接类中无法调用我们的核心activity界面.