当前位置：文档之家 › Android 多屏幕适配

Android 多屏幕适配

  • 格式：pdf
  • 大小：5.79 MB
  • 文档页数：74

下载文档原格式

  / 74

合集下载

  1. 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。

RES. px
240*320
320*480 480*800
RES. dp
320*428dp
320*480dp 320*533dp
Dell Streak HTC sensation Galaxy note
HTC Flyer Galaxy tab
5.0 in 4.3 in 5.3 in
7.0 in 7.0 in

G.DPI是由手机厂商定义的。

选择标准是使新的设备能最好的适用于现有app。
SIZE G.SIZE

SIZE 和 G.SIZE 并没有很明显的关系。

G.SIZE是由RES.(dp) 定义的。

参考G.SIZE的下界限定。

RES.(px) + G.DPI RES.(dp) G.SIZE
240 dpi
1 DP = ? px 0.75 1
1.5
xhdpi(Extra-high density)
320 dpi
2
Generalized SIZE definition
G.SIZE xlarge large normal
small
Qualifier(at least) 960dp x 720dp 640dp x 480dp 470dp x 320dp
240*320
320*480 480*800
HTC sensation Galaxy note Galaxy tab
normal normal normal
hdpi xhdpi hdpi
540*960 800*1280 600*1024
360*640dp 400*640dp 400*682dp
Density independence

与其为当前所有设备、大小做支持，不如去支持所有可能 出现的情况。

Use css3 media queries. Usually combine with fluid web design.

Media queries

Sample:

<link media="screen and (max-device-width: 800px)" href=“common.css" />
426dp x 320dp

Android does not currently support screens smaller than small screens.
Relationships

RES. + SIZE DPI

DPI = RES. / SIZE
DPI G.DPI


Screen density


DPI(dots per inch), xdpi, ydpi

DPI= RES. / SIZE px = dp * (dpi / 160)
DIP (Density-independent pixel)

Generalized SIZE/DPI

G.DPI: G.SIZE:
? ?
SIZE G.SIZE

Some model
device
HTC wildfire
HTC hero HTC desire
SIZE
2.8 in
3.2 in 3.7 in
G.SIZE
small
normal normal
DPI
140dpi
180dpi 252dpi
G.DPI
ldpi
mdpi hdpi

Tablets和Handsets没有明显的界限。 为不同的设备、分辨率开发不同的app耗费巨大且效果不佳。

Anti-example:
Official Guidelines

Build your activity designs based on fragments Use the action bar Implement flexible layouts
600*1024dp 400*682dp
Xoom
10.1 in
xlarge
150dpi
mdpi
800*1280
800*1280dp
DPI G.DPI

G.DPI 大部分等于真实DPI最临近的G.DPI。

如果DPI正好在两个G.DPI正中间怎么办？

G.DPI可能和DPI相差很多。

Samsung galaxy tab
Origin of the problem
问题的由来
Fragmentation

上千种android设备。

不同的平台版本。 不同的屏幕尺寸、分辨率。 不同的输入方式。
Platform version


From v1.5 to v4.1. 8 main version. 14 sub version.


Web Gallery
Responsive mobile design

Same content, same logical, but different representation.

同样的内容，同样的逻辑，不同的展示方式。

Use configuration qualifiers to provide different layout for different devices.

பைடு நூலகம்
Media queries contain two components:

A media type. (screen, print) A media feature(max-device-width) and query value(800px).

Use media queries to filter css depend on device info.
large normal normal
large normal
186dp 256dpi 280dpi
170dpi 170dpi
mdpi hdpi xhdpi
mdpi hdpi
480*800 540*960 800*1280
600*1024 600*1024
480*800dp 360*640dp 400*640dp

iPhone

320*480 640*960

iPad

1024*768 2048*1536
Screen Resolution Android




QVGA 240*320 WQVGA 240*400 HVGA 320*480 WVGA 480*800 FWVGA 480*854 SVGA 600*800 DVGA 960*640 WSVGA 1024*600 WXGA 1280*768 qHD 540*960 HD 1280*720 ……
如何支持普通手机？
Handset features

Small and Normal devices take over 90%. These devices are nearly all handsets.
Handset qualifier

G.SIZE: small/normal Default Orientation: portrait RES.(dp): 426dp x 320dp - 640dp x 480dp.

根据G.DPI，系统将dp units和drawables换算调整为 适配设备的大小(px). A Button (100*100dp) and a icon (48px*48px in mdpi)


Go back to see first demo.
Support general handset


RES.(dp) has a much smaller range.
device G.SIZE
small
normal normal
G.DPI
ldpi
mdpi hdpi
RES. px
RES. dp
320*428dp
320*480dp 320*533dp
HTC wildfire
HTC hero HTC desire
Supporting Multiple Screens in Android
Android多屏幕适配
Preface

Author：

Ren Fei. Android developer Buding Mobile / Innovation Works

Announcement：

本slide内容全部来自互联网，以及我自己的一点臆想，如 有错误，欢迎随便指出。
Implement flexible layouts

How to implement flexible layouts in one app?

Official answer: Think like a web designer.
Responsive web design

Build something that works on any possible width or device instead of something that works on all current widths and devices.
Relationships

RES. + SIZE DPI

DPI G.DPI (mostly) G.DPI + RES. G.SIZE

Effect of G.DPI

Developers do not need to care about real density. RES.(px). are aggregated to RES.(dp).
Screen RES. iPhone vs. Android
Android System Support
Android系统支持
What does android do ?
Some definition

Screen resolution

480*800
3.7" 252dpi
Screen size
A simple demo
320*480px mdpi 480*800px hdpi 540*960px hdpi 720*1280px xhdpi
Support more devices (handset & tablet)
如何支持更多的设备？
The first guideline

Develop one app for all devices.
How to support?

Develop a scalable app.

Use wrap_content, fill_parent. Use dp not px. Use LinearLayout/RelativeLayout, not AbsoluteLayout. Provide different drawables for different dpi. Use more 9-patch drawable. …
Screen sizes


2.6" HTC G16 3.2" 3.7" HTC G5/G7 4.0" 4.3" Samsung i9000/9100 7.0" 7.7" 8.9" Samsung Galaxy Tab 10.1" Moto Xoom …..
Screen Resolution iPhone
Website demo

http://www.alistapart.com/d/responsive-webdesign/ex/ex-site-FINAL.html 3 media queries divide width to 4 part. @media (max-width: 400px) @media (max-width: 600px) @media (min-width: 1300px)
Configuration qualifiers

Screen Size:

small/normal/large/xlarge
ldpi/mdpi/hdpi/xhdpi… port/land v3/v4/v11/v13… en/fr…
Density:

Orientation:

Platform version:
hdpi/mdpi/ldpi/xhdpi small/normal/large/xlarge
Generalized DPI definition
G.DPI ldpi (Low density) mdpi (Medium density)
hdpi (High density)
DPI 120 dpi 160 dpi