cordova自定义插件的创建过程

来源:互联网 发布:统计学数据分析案例题 编辑:程序博客网 时间:2024/06/05 06:36

最近学习了cordova插件,记录一下大概的过程,仅供参考。

前期的配置就不记录了网上好多。

第一步 创建一个cordova项目

输入命令 :cordova create 项目名 包名

例子:cordova create demo com.zc.demo

项目的大概目录


第二步 添加项目支持的平台(我只会android)

先进入工程目录

输入命令: cordova platform add  平台名

例子: cordova platform add android

创建成功够就可以进入platforms目录下面有个android,这个就可以导入到android studio了


第三步 自定义插件的创建

1、安装plugman

输入命令: npm install -g plugman

2、创建插件

输入命令: plugman create --name 插件名 --plugin_id 插件ID --plugin_version 插件版本号

例子: plugman create --name toast --plugin_id com.zc.demo.toast --plugin_version 1.0.0

注:每个前面是两个-

生成后的目录结构,没有package.json,后面会有如何加


3、完善目录

创建完成后src下面全是空的需要自己创建目录


4、在android创建java文件

可以先在android studio中写好后复制进去

import android.app.Activity;import android.content.Intent;import android.content.pm.PackageManager;import android.net.Uri;import android.widget.Toast;import org.apache.cordova.CallbackContext;import org.apache.cordova.CordovaPlugin;import org.json.JSONArray;import org.json.JSONException;/** * Created by Administrator on 2017-10-11. */public class UninstallPlugin extends CordovaPlugin {    @Override    protected void pluginInitialize() {        super.pluginInitialize();    }    @Override    public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException {        final Activity activity = this.cordova.getActivity();        if (action.equals("showInfo")){        }else if (action.equals("uninstallApp")){            //这里要输入app包名            uninstallMyself("com.lby.test.android",activity);            return true;        }        return false;    }    /**     * 弹出手机系统本身的卸载对话框,让用户卸载     * @param packageName     * @param activity     */    public void uninstallMyself(String packageName,Activity activity){        if (checkApplication(packageName,activity)){            Uri packageURI = Uri.parse("package:"+packageName);            //调用手机系统本身的卸载activity            Intent intent = new Intent(Intent.ACTION_DELETE);            intent.setData(packageURI);            activity.startActivity(intent);        }    }    /**     * 匹配你的APP包名是否能找到,然后卸载     * @param packageName     * @param activity     * @return     */    public boolean checkApplication(String packageName,Activity activity){        if (packageName == null||"".equals(packageName)){            return false;        }        try {            activity.getPackageManager().getApplicationInfo(packageName,PackageManager.MATCH_UNINSTALLED_PACKAGES);            return true;        }catch (PackageManager.NameNotFoundException e){            return false;        }    }    //弹出对话框    void show(String info){        Activity activity = this.cordova.getActivity();        Toast toast = Toast.makeText(activity,info,Toast.LENGTH_SHORT);        toast.show();    }}

要继承CordovaPlugin,还要实现execute方法,action是用来判断需要进行什么操作是从js文件传过来的


5、完善plugin.xml内容

<?xml version='1.0' encoding='utf-8'?><plugin id="com.lby.plugin" version="1.0.0" xmlns="http://apache.org/cordova/ns/plugins/1.0" xmlns:android="http://schemas.android.com/apk/res/android">    <!--插件的名称--><name>uninstallPlugin</name><!--描述信息-->    <description>卸载插件</description>    <js-module name="uninstallPlugin" src="www/uninstallPlugin.js">        <clobbers target="cordova.plugins.uninstallPlugin" />    </js-module><!--platform:支持的平台--><platform name="android">    <!--插件的配置信息,build的时候会添加到res/xml/config.xml 文件中-->        <config-file parent="/*" target="res/xml/config.xml">            <feature name="UninstallPlugin">                <param name="android-package" value="com.your.plugin.UninstallPlugin"/>            </feature>        </config-file>        <!-- 可以定义自己的一些权限信息,build后会添加到主配置文件中 --><config-file target="AndroidManifest.xml" parent="/*">            <uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>        </config-file>         <source-file src="src/android/UninstallPlugin.java" target-dir="src/com/your/plugin"/></platform></plugin>

自己根据情况改。

6、完善www目录下的js文件

var exec = require('cordova/exec');var uninstallPlugin ={showInfo:function(info,success,error){exec(success, error, "UninstallPlugin", "showInfo", [info]);},uninstallApp:function(success,error){exec(success, error, "UninstallPlugin", "uninstallApp", []);}}module.exports = uninstallPlugin;

大概这样

7、生成package.json文件

上面的就大概完成了插件的创建,要安装插件需要有package.json文件

首先从命令行进入插件目录

输入命令 :npm init

按照前面括号的写就行了


生成之后进行最后一步,把插件配置到android项目中

第四步 把插件配置到项目中

先在命令行进入android目录下

输入命令:cordova plugin add  插件的目录地址

例子: cordova plugin add E:\AS\uninstallPlugin

完成后就可以用了。

第五步 使用

在android studio中找到assets下的cordova_plugin.js里面是你所有插件的信息,clobbers的内容就是你在外面js里调用时用的名字



注:cordova的html不支持内联

        

在android studio生成的文件都在哪上面标注出来了。

原创粉丝点击