cordova自定义一个简单的alert的插件(android平台)

官网的插件开发文档:http://cordova.apache.org/docs/en/latest/guide/hybrid/plugins/index.html

插件文件布局:

比如我在d盘新建了如下的布局

--src

    --android

        --alert.java

--www

    --alert.js

plugin.xml

插件功能：

在前端点击一个按钮，提示alert.

文件内容:

    关于plugin.xml文件内容设置可以参考这里http://cordova.apache.org/docs/en/latest/plugin_ref/spec.html

现在我的内容如下：

<?xml version="1.0" encoding="UTF-8"?>
<!--
  Licensed to the Apache Software Foundation (ASF) under one
  or more contributor license agreements.  See the NOTICE file
  distributed with this work for additional information
  regarding copyright ownership.  The ASF licenses this file
  to you under the Apache License, Version 2.0 (the
  "License"); you may not use this file except in compliance
  with the License.  You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

  Unless required by applicable law or agreed to in writing,
  software distributed under the License is distributed on an
  "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
  KIND, either express or implied.  See the License for the
  specific language governing permissions and limitations
  under the License.
-->

<plugin xmlns="http://apache.org/cordova/ns/plugins/1.0"
           id="alert-plugin"
      version="1.0.0">
    <name>AlertPlugin</name>
    <description>显示alert的插件</description>
    <license>Apache 2.0</license>
    <keywords>cordova,AlertPlugin</keywords>
    <engines>
        <engine name="cordova-android" version=">=3.6.0" /><!-- Requires CordovaPlugin.preferences -->
    </engines>

    <js-module src="www/alert.js" >
        <clobbers target="navigator.alert" />
    </js-module>

    <!-- android -->
    <platform name="android">
        <config-file target="res/xml/config.xml" parent="/*">
            <feature name="alert">
                <param name="android-package" value="com.alert"/>
                <param name="onload" value="true"/>
            </feature>
        </config-file>

        <source-file src="src/android/alert.java" target-dir="src/com" />
    </platform>
</plugin>

基础的不说，说下js-module,关于<clobbers>官网上是这样说的

• <clobbers target="some.value"/> indicates that the module.exports is inserted into the windowobject as window.some.value. You can have as many <clobbers> as you like. Any object not available on window is created.

意思是，比如我www下的alert.js文件如下

var exec = require('cordova/exec');

var alertPlugin = {
    show:function(success,error,message) {
        exec(success, error, "alert", "show", message);
    }
};

module.exports = alertPlugin;

如果我这样配置的话

<js-module src="www/alert.js" >
        <clobbers target="navigator.alert" />
    </js-module>

意味着

navigator.alert就代表了alertPlugin

当我们调用alertPlugin.show方法的时候就等同于调用navigator.alert.show方法就行。

<source-file src="src/android/alert.java" target-dir="src/com" />

这个指明了核心类的名称，以及当android项目执行安装的时候，alert.java是会出现在src/com路径下的

 <feature name="alert">
                <param name="android-package" value="com.alert"/>
                <param name="onload" value="true"/>
            </feature>

value="com.alert"对应了android项目下的com.alert.java文件

<feature name="alert">中的alert和

 cordova.exec(function(winParam) {}, function(error) {}, "service", "action", ["firstArgument", "secondArgument", 42, false]);

中的service名字一样

对于alert.java,内容如下

public class alert extends CordovaPlugin {
	@Override
    public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException {
        if (action.equals("show")) {
            String message = args.getString(0);
            this.echo(message, callbackContext);
            return true;
        }
        return false;
    }

    private void echo(String message, CallbackContext callbackContext) {
        if (message != null && message.length() > 0) {
        	AlertDialog.Builder builder = new Builder(cordova.getActivity());
        	  builder.setMessage(message);
        	  builder.setTitle("提示");
            callbackContext.success(message);
        } else {
            callbackContext.error("Expected one non-empty string argument.");
        }
    }
}

注意show是和

cordova.exec(function(winParam) {}, function(error) {}, "service", "action", ["firstArgument", "secondArgument", 42, false]);

中的action名字是一样的。

插件分享在这个地址:

http://www.oschina.net/code/snippet_778987_53062

转载于:https://my.oschina.net/liangzhenghui/blog/549018