Android屏幕适配技巧
Fer9469
8年前
<p style="text-align: center;"><img src="https://simg.open-open.com/show/898e3fa47821860aec98dcad0e84ba79.jpg"></p> <p>随着Android智能的不断飞跃,Android设备的种类也在不断增长中,再加上各大厂商订制的不同款型,造成了屏幕尺寸也是多种多样,这样就对程序员造成了一个非常直观的问题,屏幕适配。所谓屏幕适配就是一款APP在不同尺寸的屏幕上都能正常显示,再直白点说,就是显示出来是一个效果。</p> <p>目前主流的分辨率提取出前六种:</p> <p>1280×720、1920×1080、800×480、854×480、960×540、1184×720</p> <p>如果你作为一个开发人员,那么起码的几个放置图片的文件夹mdpi、hdpi、xdpi、xxdpi、xxxdpi就不怎么陌生了,那么什么是mdpi、hdpi、xdpi、xxdpi、xxxdpi?</p> <p><strong>名称 像素密度范围 图片大小</strong></p> <p><strong>mdpi 120dp~160dp 48×48px</strong></p> <p><strong>hdpi 160dp~240dp 72×72px</strong></p> <p><strong>xhdpi 240dp~320dp 96×96px</strong></p> <p><strong>xxhdpi 320dp~480dp 144×144px</strong></p> <p><strong>xxxhdpi 480dp~640dp 192×192px</strong></p> <p>在Google官方开发文档中,说明了 mdpi:hdpi:xhdpi:xxhdpi:xxxhdpi=2:3:4:6:8 的尺寸比例进行缩放。例如,一个图标的大小为48×48dp,表示在mdpi上,实际大小为48×48px,在hdpi像素密度上,实际尺寸为mdpi上的1.5倍,即72×72px,以此类推。</p> <p>简单理解了之后咱们来实际学习一下如何进行屏幕适配</p> <p><strong>1. 使用wrap_content、math_parent、weight</strong></p> <p>wrap_content:根据控件的内容设置控件的尺寸</p> <p>math_parent:根据父控件的尺寸大小设置控件的尺寸</p> <p>weight:权重,在线性布局中可以使用weight属性设置控件所占的比例(一般情况,我们都是设置要进行比例分配的方向的宽度或者高度为0dp,然后再用权重进行分配)</p> <p><strong>2. 使用相对布局,禁用绝对布局</strong></p> <p>简单的布局一般都使用线性布局,而略微复杂点的布局,我们使用相对布局,大多数时候,我们都是使用这两种布局的嵌套。</p> <p>我们使用相对布局的原因是,相对布局能在各种尺寸的屏幕上保持控件间的相对位置。</p> <p><strong>3. 使用限定符</strong></p> <p>使用尺寸限定符</p> <p>当我们要在大屏幕上显示不同的布局,就要使用large限定符。例如,在宽的屏幕左边显示列表右边显示列表项的详细信息,在一般宽度的屏幕只显示列表,不显示列表项的详细信息,我们就可以使用large限定符。</p> <p>res/layout/main.xml 单面板:</p> <p>res/layout-large/main.xml 双面板:</p> <p>如果这个程序运行在屏幕尺寸大于7inch的设备上,系统就会加载res/layout-large/main.xml 而不是res/layout/main.xml,在小于7inch的设备上就会加载res/layout/main.xml。</p> <p>需要注意的是,这种通过large限定符分辨屏幕尺寸的方法,适用于android3.2之前。在android3.2之后,为了更精确地分辨屏幕尺寸大小,Google推出了最小宽度限定符。</p> <p><strong>使用最小宽度限定符</strong></p> <p>最小宽度限定符的使用和large基本一致,只是使用了具体的宽度限定。</p> <p>res/layout/main.xml,单面板(默认)布局:</p> <p>res/layout-sw600dp/main.xml,双面板布局: Small Width 最小宽度</p> <p>这种方式是不区分屏幕方向的。这种最小宽度限定符适用于android3.2之后,所以如果要适配android全部的版本,就要使用large限定符和sw600dp文件同时存在于项目res目录下。</p> <p>这就要求我们维护两个相同功能的文件。为了避免繁琐操作,我们就要使用布局别名。</p> <p><strong>使用布局别名</strong></p> <p>res/layout/main.xml: 单面板布局</p> <p>res/layout-large/main.xml: 多面板布局</p> <p>res/layout-sw600dp/main.xml: 多面板布局</p> <p>由于后两个文具文件一样,我们可以用以下两个文件代替上面三个布局文件:</p> <p>res/layout/main.xml 单面板布局</p> <p>res/layout/main_twopanes.xml 双面板布局</p> <p>然后在res下建立</p> <p>res/values/layout.xml、</p> <p>res/values-large/layout.xml、</p> <p>res/values-sw600dp/layout.xml三个文件。</p> <p>默认布局</p> <p>res/values/layout.xml:</p> <p>@layout/main</p> <p>Android3.2之前的平板布局</p> <p>res/values-large/layout.xml:</p> <p>@layout/main_twopanes</p> <p>Android3.2之后的平板布局</p> <p>res/values-sw600dp/layout.xml:</p> <p>@layout/main_twopanes</p> <p>这样就有了main为别名的布局。</p> <p>在activity中setContentView(R.layout.main);</p> <p>这样,程序在运行时,就会检测手机的屏幕大小,如果是平板设备就会加载res/layout/main_twopanes.xml,如果是手机设备,就会加载res/layout/main.xml 。我们就解决了只使用一个布局文件来适配android3.2前后的所有平板设备。</p> <p><strong>4. 使用自动拉伸位图</strong></p> <p>自动拉伸位图,即android下特有的.9.png图片格式。</p> <p>当我们需要使图片在拉伸后还能保持一定的显示效果,比如,不能使图片中的重要像素拉伸,不能使内容区域受到拉伸的影响,我们就可以使用.9.png图来实现。</p> <p> </p> <p>来自:http://www.jianshu.com/p/49681b5e6874</p> <p> </p>