HTML5Plus移动开发入门学习

HTML5Plus即 HTML5+,核心中的核心,调用原生能力的依赖。在 5+App 的开发中,在原有 Web 开发基础上,开发者需要重点掌握的就是这个 API 规范。

HBuilder

DCloud 前端开发的 IDE,代码提示这些功能真的好用。5+App 的开发,依赖 HBuilder 集成的环境。所以,HBuilder 算是开发工具和环境吧。

MUI

最接近原生体验的移动App的UI框架

为方便开发移动应用,提供丰富的 UI 组件。不知道是什么原因,总会有开发者误解这个产品。

  • HTML5+ 和 MUI 没有绝对的依赖关系

  • MUI 是为了更加方便地开发 5+App,一些方法在 5+Runtime 环境下会调用 5+API。

  • MUI 扩展了一些非 UI 插件,同样是为开发 5+App 提供更多便利。

  • 开发 5+App 不一定要引入 MUI,可以选择自己更加熟悉的 UI 框架。

一些问题

MUI 能调用系统的锁屏么?HBuilder 能实现这种布局么?

不是在下故意夸张,上面这种问题是真实存在的。其原因就是,开发者没有搞清楚自己的需求与相关产品的作用。

学习路线

搞清楚产品之间的关系了,学习路线就会更加明确一些。其实官方提供的文档以及示例,完全足够开发者理解和学习。可能有些开发者不喜欢花费时间读文档,而是更加喜欢拿来即用的源码。

HTML5Plus

HTML5+ 的 API 很多,挨个去读一遍肯定是不现实的。大致浏览一遍每个模块的定义,熟悉一些常用和重点的模块即可。

  • Webview 窗口管理:这个是最基本的,肯定要先学习。

  • Device 设备信息:一些系统设备的 API 在这里。

  • Downlaoder 下载任务:用处挺多。

  • Uploader 上传任务:用处也不少。

其它模块,根据具体的需求再去熟悉即可。

源码

HBuilder -> 菜单 -> 文件 -> 新建 -> 移动 App -> Hello H5+
即可获取 HTML5Plus 规范演示应用的源码。参考这个示例工程的源码,结合文档说明,动手做一些小的 demo 可以更快熟悉相关 API。

MUI

前面提到过,MUI 的一些方法是基于 5+ API 封装的。因此,熟悉了一些基本的 5+ API 后再来学习更加合适,不会产生许多疑惑及误读。

源码

很多人会吐槽 MUI 的文档不全,其实 MUI 的组件和插件,全都在 Hello MUI 这个示例工程里面了。
HBuilder -> 菜单 -> 文件 -> 新建 -> 移动 App -> Hello MUI
该工程包含了 MUI 所有的组件和插件,并提供了大量的示例。实际开发中,从这里复制源码直接粘贴,稍作修改就可以用了。如果这里面的组件和插件不能满足你的需求,那么可以尝试找下其它库或者花点功夫自己实现。

社区

学习新的知识,不免会遇到疑问甚至发现 bug。咨询问题和反馈 bug,也是作为开发者的必备技能。学习 5+App 开发的过程中,不要指望 QQ 群,得学会使用官方的社区进行搜索和提问。

参考文档

  • 文档中心

  • HTML5+规范

  • mui产品概述

总结

至此篇结束,关于 HTML5Plus 开发的开篇部分算是收尾了。开篇部分主要谈了一些自己关于 HTML5Plus 开发的看法与理解,更多更全的内容还是需要多去看官方文档。


相关产品

想要掌握 HTML5Plus 移动开发,首先要理清 DCloud 公司的几款产品之间的关系。否则只会一团乱麻,甚至先入为主造成一些错误的认识。

HTML5Plus

即 HTML5+,核心中的核心,调用原生能力的依赖。在 5+App 的开发中,在原有 Web 开发基础上,开发者需要重点掌握的就是这个 API 规范。

HBuilder

DCloud 前端开发的 IDE,代码提示这些功能真的好用。5+App 的开发,依赖 HBuilder 集成的环境。所以,HBuilder 算是开发工具和环境吧。

MUI

最接近原生体验的移动App的UI框架

为方便开发移动应用,提供丰富的 UI 组件。不知道是什么原因,总会有开发者误解这个产品。

  • HTML5+ 和 MUI 没有绝对的依赖关系

  • MUI 是为了更加方便地开发 5+App,一些方法在 5+Runtime 环境下会调用 5+API。

  • MUI 扩展了一些非 UI 插件,同样是为开发 5+App 提供更多便利。

  • 开发 5+App 不一定要引入 MUI,可以选择自己更加熟悉的 UI 框架。

一些问题

MUI 能调用系统的锁屏么?HBuilder 能实现这种布局么?

不是在下故意夸张,上面这种问题是真实存在的。其原因就是,开发者没有搞清楚自己的需求与相关产品的作用。

相关推荐:

HTML5plus移动应用的开发实例分享

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


HTML5和CSS3实现3D展示商品信息的代码
利用HTML5中的Canvas绘制笑脸的代码
Html5剪切板功能的实现
如何通过HTML5触摸事件实现移动端简易进度条
Html5移动端获奖无缝滚动动画实现
关于HTML5和CSS3实现机器猫的代码
HTML5使用DOM进行自定义控制
使用HTML5 Canvas绘制阴影效果的方法
使用PHP和HTML5 FormData实现无刷新文件上传
如何解决HTML5 虚拟键盘出现挡住输入框的问题
HTML5中div和section以及article的区别分析
html5和CSS 实现禁止IOS长按复制粘贴功能
html5 touch事件实现触屏页面上下滑动
canvas 模拟实现电子彩票刮刮乐的代码
HTML5 Plus 实现手机APP拍照或相册选择图片上传的功能
Android自定义环形LoadingView效果
HTML5 canvas绘制五角星的方法
html5使用html2canvas实现浏览器截图
使用Canvas处理图片的方法介绍
利用Canvas模仿百度贴吧客户端loading小球的方法