Android原生插件开发

uniapp开发一次安卓原生插件记录

之前在uni-app开发中,我们经常会使用到原生插件,比如自定义滚动条、自定义导航栏、自定义分享等等。现在记录一下uni-app开发中使用到的原生插件,以及使用的方式。

开发之前准备好开发环境。这里不做详细描述本次开发的是一个文件选择插件,本插件封装自FilePicker,由于该作者未提供公共maven库,本人又在该插件中添加了android-maven-gradle-plugin提交到了jit maven仓库

jitpack.io/android-maven-gradle-plugin插件使用记录

在开发之前,我们需要先准备好一个开发环境,这里我们使用了jitpack.io/android-maven-gradle-plugin插件,这个插件可以自动安装android-maven-gradle-plugin插件,并且自动安装了android-gradle-plugin插件,这样我们就可以使用android-maven-gradle-plugin插件了。

配置好之后直接把代码提交到GitHub,然后在GitHub上新建一个Releases版本,然后授权jitpack使用GitHub账号

jitpack在检测后生成maven库,可能会等待10几分钟,然后就可以直接使用了

现在我们可以开始开发uniapp的插件了,新建module,引入插件,然后在插件中使用插件的api

FilePickerModule

package com.tq.tq_file_picker;

import android.app.Activity;
import android.content.Intent;

import com.tq.pldk.filepicker.FilePickerActivity;
import com.tq.pldk.filepicker.PickerManager;

import io.dcloud.feature.uniapp.annotation.UniJSMethod;
import io.dcloud.feature.uniapp.bridge.UniJSCallback;
import io.dcloud.feature.uniapp.common.UniModule;

public class FilePickerModule extends UniModule {
    String TAG = "FilePickerModule";
    public UniJSCallback mCallback = null;
    private static int REQ_CODE = 0X01;

    @UniJSMethod(uiThread = true)
    public void openFilePicker(int max,UniJSCallback callback){
        mCallback = callback;
        if(mUniSDKInstance != null && mUniSDKInstance.getContext() instanceof Activity) {
            Activity activity = (Activity) mUniSDKInstance.getContext();
            PickerManager.getInstance().setMaxCount(max);
            Intent intent = new Intent(activity, FilePickerActivity.class);
            activity.startActivityForResult(intent,REQ_CODE);
        }
    }

    @Override
    public void onActivityResult(int requestCode, int resultCode, Intent data) {
        if (requestCode == REQ_CODE) {
            mCallback.invoke(PickerManager.getInstance().files);
        } else {
            super.onActivityResult(requestCode, resultCode, data);
        }
    }
}

现在我们可以直接生成uniapp的插件了

生成的aar插件就是我们需要的了

开始上架商店

package.json文件

{
    "name": "Tq-FileSelector",
    "id": "Tq-FileSelector",
    "version": "1.0.1",
    "description": "Tq-FileSelector",
    "_dp_type":"nativeplugin",
    "_dp_nativeplugin":{
        "android": {
            "plugins": [
                {
                    "type": "module",
                    "name": "Tq-FileSelector",
                    "class": "com.tq.tq_file_picker.FilePickerModule"
                }
            ],
            "hooksClass": "",
            "integrateType": "aar",
            "dependencies": [
                {
                    "id": "com.github.qitiandear",
                    "source": "implementation('com.github.qitiandear:bigFile:1.0.3')"
                },
                {
                    "id": "com.github.getActivity",
                    "source": "implementation('com.github.getActivity:XXPermissions:11.0')"
                },
                {
                    "id": "androidx.appcompat",
                    "source": "implementation('androidx.appcompat:appcompat:1.2.0')"
                }
            ],
            "compileOptions": {
                "sourceCompatibility": "1.8",
                "targetCompatibility": "1.8"
            },
            "abis": [
            ],
            "minSdkVersion": "21",
            "useAndroidX": true,
            "permissions": [
                "android.permission.WRITE_EXTERNAL_STORAGE",
                "android.permission.READ_EXTERNAL_STORAGE",
                "android.permission.MANAGE_EXTERNAL_STORAGE"
            ],
            "parameters": {
            }
        }
    }
}

上架商店


插件使用说明


文件选择

注意:请现在 manifest 中配置该插件,否则无法运行!!!

<template>
    <view>
        <view class="mapCover" @click="check">
            <text>都是否定的否定</text>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                mapHeight: 0,
                latitude: 39.909,
                longitude: 116.39742,
            }
        },
        onLoad(){
        },
        methods: {
            check(){
                const filePicker = uni.requireNativePlugin('Tq-FileSelector');
                console.log(filePicker);
                let count = 5;
                filePicker.updateFiles(); // 根据自己的需求清空选中文件
                filePicker.openFilePicker(count,res => {
                    console.log(res);
                    uni.showToast({
                        title:"成功"+JSON.stringify(res),
                        icon:"none"
                    })
                })
            }
        }
    }
</script>

<style>
    .map {
        width: 750rpx;
    }
    .mapCover{
        width: 750rpx;
        height: 254rpx;
        background: #FFFFFF;
        border-radius: 10rpx;
        margin-top: 100rpx;
    }
</style>

说明

  • openFilePicker(int,Function)
  • 参数说明
let count = 5; //文件数量
  • 返回选择的内容 格式:
[{
    "selected": true,
    "fileType": {
        "iconStyle": 2131492884,
        "title": "TXT",
        "filterType": ["txt"]
    },
    "path": "/storage/emulated/0/secoclient/operate_system_info.txt",
    "mimeType": "text/plain",
    "id": 2187,
    "name": "operate_system_info",
    "size": "91"
}, {
    "selected": true,
    "fileType": {
        "iconStyle": 0,
        "title": "IMG",
        "filterType": ["png", "jpg", "jpeg", "gif"]
    },
    "path": "/storage/emulated/0/DCIM/Screenshots/Screenshot_2022-05-24-09-16-49-413_io.dcloud.HBuilder.jpg",
    "mimeType": "image/jpeg",
    "id": 2151,
    "name": "Screenshot_2022-05-24-09-16-49-413_io.dcloud.HBuilder",
    "size": "171038"
}]
  • updateFiles()
  • 清空选中的文件
# 重点在最后
返回文件路径怎样用?
```js
"file:///"+文件绝对路径(path)

results matching ""

    No results matching ""