一、准备工具:
KM盒子5.2专业版,下载网址http://pan.baidu.com/s/1bnDcUOf
KM盒子默认集成Cordova最新版及常用插件,无需搭建杂复的开发环境,安装好KM盒子软件后,即可直接生成APP。
KM盒子集成Cordova插件列表:
org.apache.cordova.splashscreen.SplashScreen
org.apache.cordova.camera.CameraLauncher
org.apache.cordova.contacts.ContactManager
org.apache.cordova.device.Device
org.apache.cordova.dialogs.Notification
org.apache.cordova.file.FileUtils
org.apache.cordova.filetransfer.FileTransfer
org.apache.cordova.inappbrowser.InAppBrowser
org.apache.cordova.media.AudioHandler
org.apache.cordova.mediacapture.Capture
org.apache.cordova.networkinformation.NetworkManager
org.pgsqlite.SQLitePlugin
二、操作步骤
1、新建一个index.html文件,在body中添加如下代码:
<script type="text/javascript"> document.addEventListener("deviceready", onDeviceReady, false); function onDeviceReady() { document.addEventListener("offline", onOffline, false); document.addEventListener("online", onOnline, false); } function onOffline(e) { self.location="error.html"; } function onOnline() { var ref = window.open('http://www.kmbox.cn/index.html', '_blank', 'location=no'); ref.addEventListener('exit', function(event){Exit();}); } function Exit(){ navigator.notification.confirm( '你确定要退出程序吗?', function(i){ if(i==1){onOnline();} if(i==2){navigator.app.exitApp();} }, 'KM盒子', '取消,退出' );} </script>
代码很简单,通过onOnline() 判断网络是否连接,如果网络已连接,则通过window.open('http://www.kmbox.cn/index.html', '_blank', 'location=no');打开InAppBrowser浏览网站,如果网络未连接,则打开错误页面error.html
三、新建error.html错误页面,大致效果如下:
<div class="Absolute-Center"><a href="javascript:void(0);" onclick="onOnline();"><img src="img/iconpng.png" width="125" height="96"></a> <p>网络连接出错了...</p> </div>
<script type="text/javascript"> document.addEventListener("deviceready", onDeviceReady, false); function onDeviceReady() { document.addEventListener("online", onOnline, false); document.addEventListener("backbutton", onBackKeyDown, false); } function onOnline() { var ref = window.open('http://www.kmbox.cn/index.html', '_blank', 'location=no'); ref.addEventListener('exit', function(event){ Exit(); }); } function Exit(){ navigator.notification.confirm( '你确定要退出程序吗?', function(i){ if(i==1){onOnline();} if(i==2){navigator.app.exitApp();} }, 'KM盒子', '取消,退出' );} //返回键 function onBackKeyDown(){ document.removeEventListener("backbutton", onBackKeyDown, false); //注销返回键 //3秒内点击两次返回键退出 var intervalID = window.setInterval( function() { window.clearInterval(intervalID); document.addEventListener("backbutton", onBackKeyDown, false); },3000);} </script>
最后,打开KM盒子软件,点击制作APK,项目路径选择刚才新建的文件夹,然后编译文件,按提示操作即可生成APK手机客户端。
源文件下载:链接: http://yun.baidu.com/s/1c0wFXxI