从Android原生角度看移动html5开发APP（二）之整体mui初始化

有几天没有写用html5开发移动app的总结了，今天抽出点时间来总结一下吧。

不多说直接入主题：

1、html就是一个框架，虽然说有点想layout，但是还是有点不一样的，具体的就是一个是标签，一个是具体控件。在移动开发中html用的最多的就是块标签即<div></div>，这个标签有点像Android原生的<RelativeLayout></RelativeLayout>的进一步抽象，通过<div></div>标签我们就能够很好的控制有关联的标签，使得他们成为一个整体。

2、html方面的只是在此就不说了，下面就进入正式的开发----JavaScript。一般我们开发的时候都会新建一个js文件的，在html中引用就好。书写的工具很多，文本编辑器就可以，但是本人愚昧，还是用的是IDE（HBuilder，强大的html5移动开发环境），开发环境已经帮我们实现了很多控件，有些可以直接拿来用就好，不用自己再去造轮子了。以后说到的js都是基于这个框架说的。

3、具体一点吧，说一下mui的初始化的一些东西

mui.init({
	swipeBack: false, //禁用右滑关闭功能
	preloadPages: [
		//      {
		//          url: 'province.html',
		//          id: 'province.html',
		//          styles: {
		//              top: 0,//子页面顶部位置
		//              bottom: 0//子页面底部位置
		//          }//窗口参数
		//      },
		{
			url: 'act.html',
			id: 'act.html',
			styles: {
				top: 0, //子页面顶部位置
				bottom: 0 //子页面底部位置
			} //窗口参数
		}
	]
});

初始化，就是在界面还没有出来之前做的一些预处理工作在这里实现。

mui.ready(function() {
	var subPages = ['pages/payment/payment.html', 'pages/stroke/drive.html', 'pages/mall/mall.html', 'pages/myself/my.html'];
	var subPage_style = {};
//mui实现了两个方法
//前台转后台
document.addEventListener('pause', function() {
	__isIntoBackground = true;
	plus.device.setWakelock(false);
});

//后台转前台
document.addEventListener('resume', function() {
});

});

这个地方就是html5树形界面已经加载完毕，document可以获取到html5中的标签了，可以在这里实现，类似为Android中的系统回调方法

这里t添加了两个监听，监听APP处理后台还是前台。

mui.plusReady(function(){

//html5调用硬件设备，摄像头，传感器等等

});

这里是最基础的。都是调用mui系统的方法。