【Android开发API】web应用web应用的屏幕适配TargetingScreensfromWebApps.pdf
文本预览下载声明
eoe 移动开发者社区
译:CuGBabyBeaR
完成时间:8月15 日
原文链接:/guide/webapps/targeting.html
如果您正在为Android或者移动设备开发或者重新设计⼀个web应用, # 快速预览 * 您可以通过viewport
您应该仔细研究您的网页是如何在不同种类的屏幕上显示的。因为 metadata ,CSS ,和JavaScript为不同的屏幕
Android是可以存在于使用不同类型屏幕的设备上的,您应该考虑⼀些 匹配您的web页面 。 * 本文所述的技术在
影响您的网页在Android设备上显示方式的因素 。 Android 2.0或更 版本下,且显示在默认
Android浏览器和WebView 中的网页上⼯作 。 #
* 注:* 这个本文档中描述的方法,在Android2.0或更 版本下,被 在此篇文档中 Targeting Screens from Web
Android浏览器( 由缺省Android平台所提供的)和WebView(用来显示 Apps#使用Viewport Metadata 使用Viewport
网页的框架视图部件 (widget))所支持 。 运行在Android上的第三 Metadata :Targeting Screens from Web
方浏览器可能不支持用这些方法来控制viewport 的尺⼨和屏幕的密 Apps#预定义viewport尺⼨ 预定义viewport尺⼨
度 。 :Targeting Screens from Web Apps#预定义
viewport缩放 预定义viewport缩放 :Targeting
当您为Android设备指定您的网页时,有两个您应该注意的基本因素:
Screens from Web Apps#预定义viewport 匹配
viewport 的尺⼨和网页的缩放
密度 预定义viewport 匹配密度 Targeting
:当Android浏览器加载⼀个网页时,默认行为是以概览模式加载这个页
Screens from Web Apps#用CSS适配设备密度
面,概览模式是指提供缩⼩至这个页面的远景的视图。您可以通过定
用CSS适配设备密度 Targeting Screens from
义这个viewport 的默认尺⼨或者初始缩放值,为您的网页重写这个行
Web Apps#用JavaScript适配设备密度 用
为 。如果可用的话,您同样可以控制用户能够将您的网页放⼤或者缩⼩
JavaScript适配设备密度
多少 。用户同样可以在浏览器的设置里关闭概览模式,所以您绝对不应
该假设您的页面会在概览模式下加载 。您应该为您的页面设置合适的自定义viewport 的尺⼨和/或网页的缩放 。
:但是,当您的页面在WebView 中显示时,页面会在无缩放 (而不是“概览模式”)下加载 。这就是说,会以页面的默认⼤⼩
显示它,而不缩⼩它 。 (这也是当用户关闭了概览模式时,页面d 的显示方式 。)
设备的屏幕密度
:Android设备的屏幕密度 (每英⼨像素数)影响着显示哪个网页及其显示尺⼨的决定 。 (有三个屏幕密度类别:低 、
显示全部