• cordova 插件开发


     公司现在用的ionic开发一些APP.中间涉及到自定义一些cordova 插件. 所以这里记录一下.这里主要参照一下这个  Android Cordova 插件开发之自定义插件生成安装包

    1.搭建一个插件框架,这里使用的是plugman  安装那些就不说了.具体的 文档链接在这里

      1.1搭建目录

     plugman create --name DialogPlugin  --plugin_id cordova-plugin-dialog  --plugin_version 0.0.1

       1.2添加平台代码,这里主要是安卓.

     plugman platform add --platform_name android
    

       完成之后的目录结构如下:

      DialogPlugin

         —src

          —android

            CustomDialog.java

        —www

          dialog.js

        plugin.xml

    2. 添加代码

      2.1 添加Java代码,CustomDialog.java 

    public class CustomDialog extends CordovaPlugin{
        @Override
        public boolean execute(String action, CordovaArgs args, final CallbackContext callbackContext) throws JSONException {
            if("show".equals(action)){
                AlertDialog.Builder builder = new AlertDialog.Builder(cordova.getActivity());
                builder.setTitle("提示");
                builder.setMessage(args.getString(0));
                builder.setPositiveButton("确定", new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                        dialog.dismiss();
                        callbackContext.success("点击了确定");
                    }
                });
                builder.setNegativeButton("取消", new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                        dialog.dismiss();
                        callbackContext.error("点击了取消");
                    }
                });
                builder.create().show();
                return true;
            }
            return super.execute(action, args, callbackContext);
        }
    
    }
    

      

      2.2 添加js代码,

      

      var exec = require( "cordova/exec" );
      module.exports = {
          show: function( content ) {
              exec(
                  function( message ) {
                      console.log( message );
                  },
                  function( errorMessage ) {
                      console.log( errorMessage );
                  },
                  "CustomDialog",
                  "show", [ content ] );
          }
      }
    

      2.3 修改plugin.xml

    <?xml version="1.0" encoding="UTF-8"?>
    <!-- 插件的Id,安装后注册的Id为此id加js-moudle的name属性,即cordova_plugins.js里的id属性 -->
    <plugin xmlns="http://apache.org/cordova/ns/plugins/1.0"
        id="cordova-plugin-dialog" version="0.0.1">
        <!-- 插件名称 -->
        <name>DialogPlugin</name>
        <!-- 插件描述 -->
        <description>Description</description>
        <!-- js文件的地址,安装后路径为:plugins/插件Id/src属性值 -->
        <js-module name="CustomDialog" src="www/dialog.js">
        <!-- 跟asserts/cordova_plugins.js中填clobbers的值一样 -->
            <clobbers target="alertDialog"/>
        </js-module>
        <!-- android -->
        <platform name="android">
            <config-file parent="/*" target="res/xml/config.xml">
            <!-- config-file中包含的这段会原封不动的插入到config.xml文件中 -->
                <feature name="CustomDialog">
                    <param name="android-package" value="org.apache.cordova.dialog.CustomDialog"/>
                </feature>
            </config-file>
            <!-- 本地代码,有多个文件就写多个source-file,src对应本项目,target对应安装后的目录 -->
            <source-file src="src/android/CustomDialog.java" target-dir="src/org/apache/cordova/dialog"/>
        </platform>
        <!-- 其他平台的代码 -->
    </plugin>
    

     3.添加package.json 文件,在cordova7.0版本以上需要这个文件.

      3.1 使用命令

    plugman createpackagejson #文件夹位置
    

     这样插件就编写完成了.

     最后目录结构

    4.编写cordova项目测试.具体文档位置

      4.1 创建一个cordova项目

    cordova create hello com.example.hello HelloWorld
    

      这里可能会报错,解决办法使用Yarn 安装.

    sudo npm install -g yarn
    yarn install -g cordova
    

      这样就可以了.

      4.2 添加平台

    cordova platform add android  
    

      4.2 添加插件,就是刚才我们写的插件,这里使用本地路径添加.

    cordova plugins add <插件包路径>
    

      4.3 使用插件,index.js文件中使用.

       alertDialog.show("install dialog plugin success!!");

      4.4 运行cordova程序.

    cordova run android
    

      这样插件就编写完成并使用了.

        

  • 相关阅读:
    Codeforces Round #136 (Div. 1) B. Little Elephant and Array
    洛谷 P2966 [USACO09DEC]牛收费路径Cow Toll Paths
    cogs 969. [NOIP2006] 数列
    防止xss(跨站脚本攻击)
    ☀【插件】iScroll
    ☀【移动优化】
    ☀【Zepto】
    ☀【JS】Code
    ☀【响应式设计】屏幕尺寸
    CODEVS——T2744 养鱼喂妹纸
  • 原文地址:https://www.cnblogs.com/yt-007/p/7003097.html
Copyright © 2020-2023  润新知