Android 应用开发新路线
利用 HTML5 开发 Android 应用程序!
Android 与 HTML5 融合
•
Android 的 HTML5 应用程序概述
•
如何适配多分辨率的 Android 设备?
•
如何在 Android 中构建 HTML5 应用程序?
•
如何在 Android 中调试 HTML5 应用程序?
•
如何在 Android 中使用 HTML5 的本地储存?
•
如何在 Android 中使用 HTML5 的本地数据库?
•
如何在 Android 中使用 HTML5 的地理定位?
•
如何在 Android 中构建 HTML5 离线应用?
•
如何使用 Canvas 进行绘图?
Android HTML5 应用概述
适配多分辨率的 Android 设备
Android 浏览器加载 WEB 页面时,如果用户没有禁止启用”预览模
式“,那么将默认为“预览模式“,通常会缩小 WEB 页面。而当页面
在 WebView 中显示时,会采用”完全载入“的方式,即保证 WEB 页
面的原始大小。
设备屏幕的密度是基于屏幕的分辨率(由每英寸所包含的点数( dpi ))定义
的。 Android 支持三种类别的屏幕密度:低( ldpi ),中( mdpi )和高
( hdpi )。与中等密度屏幕相比,低密度屏幕每英寸像素较少,高密度屏幕每
英寸像素较多。默认情况下, Android 浏览器和 WebView 是针对中等密度的
屏幕。 Android 浏览器和 WebView 在高密度屏幕上将 Web 页面缩放约 1.5
倍(因为中等密度屏幕像素较小),而在低密度屏幕上将 Web 页面缩放约
0.75 倍(因为中等密度屏幕像素大)。
viewport 属性的应用
viewport 需要放置在 HTML 的 <meta> 标签中,在 <meta> 标签的
content 属性中,就可以定义多个视窗特性。包括视窗的宽度、高
度、缩放比例,目标设备密度等,但是,需要注意每个视窗属性必
须有逗号隔开。
<head>
<title>Exmaple</title>
<meta name=”viewport” content=”width=device-width,user-scalable=no”/>
</head>
<meta name="viewport"
content="
height = [pixel_value | device-height] ,
width = [pixel_value | device-width ] ,
initial-scale = float_value ,
minimum-scale = float_value ,
maximum-scale = float_value ,
user-scalable = [yes | no] ,
target-densitydpi = [dpi_value | device-dpi |
high-dpi | medium-dpi | low-dpi]
" />