您的位置:首页 > 其它

cordova实现“再点击一次退出”效果

2015-04-21 17:06 288 查看
基本的写法如下:

Java代码


document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {

//navigator.splashscreen.hide();

document.addEventListener("backbutton", onBackKeyDown, false);

}

function onBackKeyDown() {

Toast.showShort('再点击一次退出!');

document.removeEventListener("backbutton", onBackKeyDown, false); // 注销返回键

document.addEventListener("backbutton", exitApp, false);//绑定退出事件

// 3秒后重新注册

var intervalID = window.setInterval(function() {

window.clearInterval(intervalID);

document.removeEventListener("backbutton", exitApp, false); // 注销返回键

document.addEventListener("backbutton", onBackKeyDown, false); // 返回键

}, 3000);

}

function exitApp(){

navigator.app.exitApp();

}

上面的代码中需要一个toast插件,这个是需要自己实现的,当然你可以使用纯JS写一个模仿android。

比如我提供一个现成的(PS:本人没有使用过,不知道有没有效果!)

Java代码


/**

* 自定义toast,js实现android中toast效果

* @param msg 显示文字

* @param duration 显示的时间长度

*/

function showToast(msg, duration) {

duration = isNaN(duration) ? 3000 : duration;

var m = document.createElement('div');

m.innerHTML = msg;

m.style.cssText = "width:60%; min-width:150px; background:#000; opacity:0.5; height:40px; color:#fff; line-height:40px; text-align:center; border-radius:5px; position:fixed; top:70%; left:20%; z-index:999999; font-weight:bold;";

document.body.appendChild(m);

setTimeout(function() {

var d = 0.5;

m.style.webkitTransition = '-webkit-transform ' + d

+ 's ease-in, opacity ' + d + 's ease-in';

m.style.opacity = '0';

setTimeout(function() {

document.body.removeChild(m)

}, d * 1000);

}, duration);

}

我采用的是插件的形式:

1,用java写一个cordova插件(本人只会java,object-c不会,所以要在iphone上跑还需要用object-c写一个,这是使用插件不足的地方,不过可以网上搜一下,这种小插件基本可以搞定!)

Java代码


package com.mobovip.mobile.plugin.toast;

import org.apache.cordova.CallbackContext;

import org.apache.cordova.CordovaPlugin;

import org.json.JSONArray;

import org.json.JSONException;

import android.widget.Toast;

public class ToastPlugin extends CordovaPlugin {

private static final int TOAST_MESSAGE_INDEX = 0;

private Toast toast = null;

@Override

public boolean execute(String action, JSONArray data,

CallbackContext callbackContext) throws JSONException {

if(action.equals("show_short")){

String message = data.getString(TOAST_MESSAGE_INDEX);

showToast(message, Toast.LENGTH_SHORT);

}else if(action.equals("show_long")){

String message = data.getString(TOAST_MESSAGE_INDEX);

showToast(message, Toast.LENGTH_LONG);

}else if(action.equals("cancel")){

cancelToast();

}

callbackContext.success();

return true;

}

private void showToast(final String message, final int length) {

cordova.getActivity().runOnUiThread(new Runnable(){

@Override

public void run() {

// TODO Auto-generated method stub

toast = Toast.makeText(cordova.getActivity(), message, length);

toast.show();

}

});

}

private void cancelToast() {

cordova.getActivity().runOnUiThread(new Runnable() {

@Override

public void run() {

if (toast != null){

toast.cancel();

}

}

});

}

}

2,在res/xml/config.xml文件中增加插件配置

Xml代码


<feature name="Toast">

<param name="android-package" value="com.mobovip.mobile.plugin.toast.ToastPlugin" />

</feature>

3,在asserts/www/plugins/目录下实现自己插件的toast.js文件

Java代码


cordova.define("com.mobovip.mobile.plugin.toast.Toast", function(require, exports, module) {/*global cordova, module*/

module.exports = {

showShort: function (message, win, fail) {

cordova.exec(win, fail, "Toast", "show_short", [message]);

},

showLong: function (message, win, fail) {

cordova.exec(win, fail, "Toast", "show_long", [message]);

},

cancel: function (win, fail) {

cordova.exec(win, fail, "Toast", "cancel", []);

}

};

});

4,添加toast插件js配置信息

在assets/www/cordova_plugins.js文件中添加如下信息:

Xml代码


module.exports = [

{

"file": "plugins/com.mobovip.mobile.plugin.toast/www/toast.js",

"id": "com.mobovip.mobile.plugin.toast.Toast",

"clobbers": [

"Toast" //Js中使用的时候变量的名称

]

},

.........

同时加上插件的版本:

Xml代码


module.exports.metadata =

// TOP OF METADATA

{

"com.mobovip.mobile.plugin.toast": "1.0.0",

.........

5,代码调用

Java代码


Toast.showShort('再点击一次退出!');
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: