HBuilder mui入门教程——(1)简介

从周一开始接触mui框架,到今天完成一个简单app的开发,时间刚好一周,mui框架丰富的插件集成和方便的调用功不可没,但是在开发过程中也遇到了一些坑,为方便以后查看,做个记录,也希望能帮助到别人更好了。以下部分内容摘自官网。

mui框架简介

APP开发一般可以用Html5和原生开发两种方式,考虑到性能和体验的原因,APP开发一直以来采用原生开发方式。以往H5开发主要问题有切页白屏、浮动元素抖动、下拉刷新不流畅等等。

mui框架的有效解决了这些问题,通过mui框架可以用H5快速高效开发出最接近原生效果的APP。

快速体验

官网提供了一个用mui开发的HelloMui App,可以在手机上安装体验一下开发效果,地址:http://dev.dcloud.net.cn/mui/

开发工具

使用mui开发APP只需要下载一个开发IDE:Hbuilder,mui框架已经内置在里面了。

建立mui项目

HBuilder安装好之后,文件->新建->移动APP,然后在弹出界面选择mui项目就可以创建一个包含mui框架的简单APP项目。
打开左侧中的index.html页面,在body标签中写一行hello word,保存,就可以在右侧的web浏览器中实时看到页面效果。

项目框架分析

在左侧的项目管理器中可以看到这个项目结构很简单,css,js,fonts三个文件夹包含了mui框架所须的一些基本文件,下面的manifest.json类似原生安卓开发,包含了应用的图标,启动页,权限等各种设置。

猜你喜欢

转载自blog.csdn.net/anjingshen/article/details/74127217