来源：http://blog.csdn.net/uikoo9/ar 时间：2016-07-14 10:33 作者：xxadmin 阅读:次
[导读] 前言 看了前面两篇内容是否有点跃跃欲试了？ 下面就开始一个简答的例子，以及mui相关内容 mui 官网： http://dcloudio.github.io/mui/ 说明：希望你可以把官网内容通读一遍，这是以后开发的...
前言看了前面两篇内容是否有点跃跃欲试了？ 下面就开始一个简答的例子，以及mui相关内容 mui官网：http://dcloudio.github.io/mui/ 说明：希望你可以把官网内容通读一遍，这是以后开发的基础 开始新建项目在首页点击新建移动App，如下：
或者在项目管理器内右键新建，或者快捷键ctrl+n+a 选择模版这里选择mui项目，会自动引入mui的js和css，如下：
文件结构默认有以下几个文件夹：css，fonts，js，如下：
简单开发header打开index.html后在body内输入mh后回车，如下：
body同样输入mbo后回车 list在mbody中添加一些列表 最后的代码<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> <title></title> <script src="js/mui.min.js"></script> <link href="css/mui.min.css" rel="stylesheet"/> <script type="text/javascript" charset="utf-8"> mui.init(); </script> </head> <body> <header class="mui-bar mui-bar-nav"> <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a> <h1 class="mui-title">我的标题</h1> </header> <div class="mui-content"> <ul class="mui-table-view" id="my_task_list"> <li class="mui-table-view-cell"> <div class="mui-slider-right mui-disabled"> <a class="mui-btn mui-btn-red">删除</a> </div> <div class="mui-slider-handle"> 待办事项1 </div> </li> <li class="mui-table-view-cell"> <div class="mui-slider-right mui-disabled"> <a class="mui-btn mui-btn-red">删除</a> </div> <div class="mui-slider-handle"> 待办事项2 </div> </li> </ul> </div> </body> </html> 调试（android为例）连接手机首先需要连接手机 运行选择运行——手机运行——在xx设备上运行 或者使用快捷键ctrl+r 效果现在你就可以在手机上看效果了 注意需要开启开发者模式 打包dcloud证书打包选择发行——App打包——选择Android以及dcloud公用证书，如下：
参数配置可能有时候会提示参数配置错误，这是你需要打开项目下manifest.json文件，并去掉第三方插件，如下：
等待返回上一步的发行打包，点击打包后会提示你已经到云端打包，你只需要等待了， 一小会之后就打包好了，这时你就可以把apk拷贝到自己手机使用了，
更多更多文章请访问：http://uikoo9.com/blog/list |
自学PHP网专注网站建设学习,PHP程序学习,平面设计学习，以及操作系统学习
京ICP备14009008号-1@版权所有www.zixuephp.com
网站声明：本站所有视频，教程都由网友上传，站长收集和分享给大家学习使用，如由牵扯版权问题请联系站长邮箱904561283@qq.com
