html5 plus应用概述

HTML5 Plus 规范

通过 HTML5 开发移动 App 时,会发现 HTML5 很多能力不具备。为弥补 HTML5 能力 的不足,在 W3C 中国的指导下成立了 www.HTML5Plus.org组织,推出 HTML5+规范。

HTML5+扩展了 JavaScript 对象 plus,使得 js 可以调用各种浏览器无法实现或实现不佳的系统能力,设备能力如摄像头、陀螺仪、文件系统等,业务能力如上传下载、二维码、地图、支付、语音输入、消息推送等。

HBuilder 的手机原生能力调用分 2 个层面:

a)   跨手机平台的能力调用都在 HTML5+ 规范里,比如二维码、语音输入,使用

plus.barcode 和 plus.speech。编写一次,可跨平台运行。

b)   JS Bridge是另一项创新技术,通过 js 可以直接调 iOS 和 Android 的原生 API,这部 分就不再跨平台,比如调 ios game center,或在 android 手机桌面创建快捷方式。 JSB 的用法是,var obj= plus.android.import("android.content.Intent");,将一个原生对 象 android.content.Intent 映射为 js 对象 obj,然后在 js 里操作 obj对象的方法属性就可以了

HTML5+ App

使用 HTML5+开发的移动 App 并非 mobileweb 页面。这是新手最容易混淆的地方。 mobileweb 的文件存放在 web 服务器上,而移动 App 的文件存放在手机本地,编写移动 App 的 html、js、css文件被打包到 ipa 或 apk 等原生安装包,在手机客户端运行。

当然这些移动 App 里某些页面也可以继续从服务器端以网页方式下行。

所以 mobile web,在 HBuilder 里新建项目时,属于 web 项目。不要放置到移动 App 项 目下。mobile web 项目也不能真机联调和打包。

举几个例子。

例 1:一个 mobile web 项目,想打包成移动 App。

a)   在 HBuilder 里新建一个 web 项目,把 mobile web 代码放进去。

b)   在 HBuilder 里新建移动 App

c)   在新建的移动 App 下找到 manifest.json,将其中的入口页面配置为 mobileweb 的网 络地址。

d)   然后点发行打包,就得到一个移动 App 的安装包。除了可发行到 Appstore 和桌面 有个快捷方式外,与浏览器的体验不会有其他区别。

e)   另外其实 mobile web 的代码,也可以判断自己运行的环境,如果 UA 里包含 “Html5Plus”,也可以写 plus 对象来调用原生能力。

时间: 2024-08-10 07:52:43

html5 plus应用概述的相关文章

Html5之高级-7 HTML5 Chart.js(概述、入门、使用)

一.Chart.js 概述 Chart.js 简介 - Chart.js 是一个简单.面向对象.为设计者和开发者准备的图表绘制工具库 - 官方地址: http://www.chartjs.org/ Chart.js 特点 - 基于 HTML 5 - Chart.js 基于 HTML5 canvas技术,支持所有现代浏览器,并且针对IE7/8提供了降级替代方案 - 简单.灵活 - Chart.js 不依赖任何外部工具库,轻量级(压缩之后仅有4.5k),并且提供了加载外部参数的方法 Chart.js

Html5之高级-9 HTML5 Two.js(概述、入门)

一.Two.js 概述 Two.js 简介 - Two.js 是一个面向现代 Web 浏览器提供绘制二维图形的 API ,它允许使用不同的上下文,而使用相同的 API 进行绘制 - Two.js 所支持的上下文: - SVG - Canvas - WebGL - 官方地址: http://jonobr1.github.io/two.js/ Two.js 特点 - 专注于矢量图: - Two.js 是深度实现具有动画效果的矢量图 - Two.js 致力于更简洁地创建矢量图及动画效果 - Two.j

Html5之高级-12 Web Workers(概述、 API)

一.Web Workers 概述 Web Workers 简介 - Web Workers 是运行在后台的 JavaScript - 充分利用多核 CPU 的优势 - 对多线程支持非常好 - 不会影响页面的性能 - 不能访问Web页面 和 DOM API 二.Web Workers API Web Workers API - 检测浏览器对 Web Worker 的支持性 - 创建 Web Worker 文件 - 创建 Web Worker 对象 - 与 Web Worker 进行通信 - onM

Html5之高级-14 Web Socket(概述、API、示例)

一.Web Socket 概述 Web Socket 简介 - Web Socket 是 HTML5 提供的在 Web应用程序中客户端与服务器端之间进行的非 HTTP 的通信机制 - Web Socket 实现了用 HTTP 不容易实现的服务器端的数据推送等智能通讯技术 Web Socket 的特点 - Web Socket 可以在服务器与客户端之间建立一个非 HTTP 的双向连接 - 这个连接时实时的,也是永久的 - 服务器端可以主动推送消息 - 服务器端不再需要轮询客户端的请求 - 服务器端

HTML5系列一(属性概述)

HTML5概述 HTML5於2004年被WHATWG(网页超文本技术工作小组)提出,於2007年被W3C接纳 在2008年1月22日,第一份正式草案已公布.WHATWG表示该规范是目前正在进行的工作,仍须多年的努力 HTML5的新特点 便捷的标签书写 强大的绘图.动画 多媒体的直接支持 表单的全新功能 本地存储 地理定位的API..... 浏览器支持 http://fmbip.com/ http://html5test.com 便捷的标签书写 在html5中,像如下的声明都是可以了,也就是说声明

《HTML5与CSS3实例教程》

<HTML5与CSS3实例教程> 基本信息 作者: (美)Brian P. Hogan 译者: 卢俊祥 丛书名: 图灵程序设计丛书 出版社:人民邮电出版社 ISBN:9787115363404 上架时间:2014-7-25 出版日期:2014 年8月 开本:16开 页码:1 版次:1-1 所属分类:计算机 > 数码/设计 > CSS 计算机 > 软件与程序设计 > 网络编程 > HTML 更多关于>>> <HTML5与CSS3实例教程>

HTML5与CSS3实例教程(第2版) 附源码 中文pdf扫描版

HTML5和CSS3技术是目前整个网页的基础.<HTML5与CSS3实例教程(第2版)>共分3部分,集中讨论了HTML5和CSS3规范及其技术的使用方法.这一版全面讲解了最新的HTML5和CSS3技术,所有实例均使用最新特性实现,针对的是最新版本的浏览器. <HTML5与CSS3实例教程(第2版)>适合所有使用HTML和CSS的Web开发人员学习参考. 目录 第1章 HTML5和CSS3概述 第一部分 用户界面增强 第2章 新的结构化标签和属性 第二部分 新视角.新声音 第6章 在

Flask&amp;&amp;人工智能AI -- 8 HTML5+ 初识,HBuilder,夜神模拟器,Webview

昨日内容回顾 1.增删改查: 增: db.collections.insert({a:1}) // 官方不推荐了 db.collections.insertMany([{a:1},{b:1}]) insertOne({a:1}) 查: db.collections.find({a:1,b:1}) db.collections.findOne({a:1}) 改: db.collections.update({a:1},{$set:{b:2}}) // 官方不推荐了 db.collections.u

极客学院Web前端开发技术实战视频教程 初级入门+高级实战++专家课程+面试指导

===============课程目录=============== ├<初级中级>│  ├<1. HTML5开发前准备>│  │  ├1.HTML5开发前准备.mp4│  │  └2.开发前的准备-快捷键.mp4│  ├<10. React.js>│  │  ├React.js简介.txt│  │  ├<1.React 概述>│  │  │  ├React 开发环境搭建.mp4│  │  │  ├编写第一个 React 程序.mp4│  │  │  └什么