zoukankan      html  css  js  c++  java
  • Android屏幕适配问题详解

    上篇-Android本地化资源目录详解 http://www.cnblogs.com/steffen/p/3833048.html

     

    单位:

      px(像素):屏幕上的点。

      in(英寸):长度单位。

      mm(毫米):长度单位。

      pt(磅):1/72英寸。

      dp/dip(与密度无关的像素):一种基于屏幕密度的抽象单位。在每英寸160点的显示器上,1dp = 1px,在大于160点的显示器上可能增大。一般用于位置和尺寸属性的单位。

      dpi:表示当前屏幕的密度。

      sp(与刻度无关的像素):主要用于字体大小单位。

     

    标识符:

      ◆ 屏幕尺寸(Screen size):可以的标识符有small、normal、large、xlarge。

      ◆ 屏幕外观(Screen Aspect):可用的标识符有long、notlong。

      ◆ 屏幕方向(Screen Oriention):可用的标识符有port、land。

      ◆ 屏幕像素密度(Screen pixel density [dpi]):可用的标识符有ldpi、mdpi、hdpi、xhdpi、nodpi、tvdpi。

      ◆ 最小屏幕宽度(smallestWidth):标识符样式有sw<N>dp,例如sw320dp、sw600dp、sw720dp。

      ◆ 可使用的屏幕宽度(Available width)有标识符样式:w<N>dp,例如w720dp、w1024dp。

      ◆ 可使用的屏幕高度(Available height)有标识符样式:h<N>dp,例如h720dp、h1024dp。

     

    本地化资源目录案例:

      res/ayout/main_layout.xml  // 用于normal屏幕尺寸的布局,也就是默认的布局

      res/layout-small/main_layout.xml  // 用于small屏幕尺寸的布局

      res/layout-large/main_layout.xml  // 用于large屏幕尺寸的布局

      res/layout-xlarge/main_layout.xml  // 用于xlarge屏幕尺寸的布局

      res/layout-xlarge-land/my_layout.xml  // 用于xlarge屏幕尺寸,并且是landscape方向的布局

      res/drawble-mdpi/icon.png  // 用于中密度屏幕的图像

      res/drawble-port-hdpi/icon.png  // 用于高密度屏幕,丙炔屏幕方向是portrait的图像

      res/drawble-xhdpi/icon.png  // 用于扩展高密度屏幕的图像

     

     

    一、屏幕适配主要考虑方面

      ◆ 屏幕尺寸

      ◆ 屏幕密度

      ◆ 屏幕方向

      ◆ 屏幕分辨率

      ◆ 独立于屏幕密度的像素(dp)

     

    1.屏幕尺寸

    屏幕实际的物理尺寸,也就是屏幕对角线的长度。为了方便,Android将各个屏幕物理尺寸分为如下4种:

      ◆ small

      ◆ normal

      ◆ large

      ◆ extra large

     

    2.屏幕密度

    屏幕每英寸包含的物理像素点,通常使用dpi表示。例如,中密度的屏幕会比高密度的屏幕每英寸的像素点要少,因此屏幕在显示画面是没有高密度细腻。

    为了方便Android将多种实际的屏幕分为如下4中:

      ◆ 低密度(low density)

      ◆ 中密度(medium dendity)

      ◆ 高密度(high density)

      ◆ 扩展高密度(extra high density)

     

    3.屏幕方向

      手机通过方向传感器可以实现界面在2个到4个方向上的旋转。这就是要求程序界面支持横屏(landcape)和纵屏(portrait)的布局。适用这两种布局的通常做法是提供两个不同的布局文件。不过也可以再运行时干支屏幕方向的变换,并及时调整屏幕的布局。

     

    4.屏幕分辨率

      整个屏幕的物理像素个数,通常用N*M表示,N表示横向分辨率、M表示纵向分辨率。在早期的Android版本曾支持直接使用屏幕分辨率的配置标识符,不过在高版本的Android中已经不允许直接使用屏幕分辨率作为配置标识符了。通常会使用屏幕尺寸和屏幕密度近似值表示屏幕的分辨率,也就是说一组近似的分辨率对于一个尺寸或屏幕密度。

     

    5.独立于屏幕密度的像素(dp)

      dp是与屏幕密度无关的单位,通常用于设置UI布局的位置和尺寸。dp相当于160dpi屏幕的物理像素,也就是说,如果当前屏幕是中密度,那么dp与px(像素)等效。如果当前屏幕不是中密度,系统会使用如下公式计算出实际的物理像素,以使UI的相对位置和尺寸在不同密度的屏幕上保持不变。

      px = dp * (dpi / 160)

      其中dpi表示当前屏幕的密度。例如,当前的TextView控件的宽度设为160dp,程序运行在高密度屏幕的手机上,dpi为240(每英寸有240个物理像素),那么TextView控件的实际物理像素是240px,计算方法如下:

      px = 160 * (240 / 160) = 240

      从这一点可以看出,在高密度屏幕下,1dp = 1.5px,二咱低密度(每英寸120个物理像素)屏幕下,4dp=3px。

     

     

    二、适配不同屏幕可以采用的规则

    1.限制屏幕尺寸

      如果应用程序时专门为某类屏幕设计的,例如,large等级的屏幕,最简单的方法就是直接在AndroidManifest.xml文件中通过<compatibe-screens>或<supports-screens>标签显示屏幕尺寸。通过这两个标签可以使不满足屏幕要求的手机在Google Play上无法找到你的程序。

     

    2.为不同的屏幕尺寸提供不同的布局

      ① Android 3.2 以前的版本:可以考虑屏幕的尺寸和密度。例如,屏幕尺寸分为4个等级:small、normal、large和xlarge。如果为这4个尺寸等级都提供相应的布局资源,就需要建立4个布局资源目录:res/layout-small、res/layout-normal、res/layout-large和res/layut-xlarge。

      ② Android 3.2(API Level=13)以后:新增了3个配置表示符:屏幕的最小宽度、可使用屏幕宽度和可使用屏幕高度。例如,屏幕的最小宽度使用sw<N>dp表示,其中N表示最小宽度值,如果要为屏幕最小宽度是600dp的Android设备提供布局文件,需要将布局文件放到res/layout-sw600dp目录中。

     

    3.为不同屏幕的密度提供不同分辨率的图形

      默认情况下,Android会拉伸普通图形(.png、.jpg和.gif文件)和Nine-Patch图片,但对于不同屏幕密度来说,图像的拉伸可能会造成失真。因此,对于那些色彩比较丰富的图像,通常会为每一种屏幕密度提供相应分辨率的图像。目前Android将屏幕密度分为4个等级:ldpi(低密度)、mdpi(中密度)、hdpi(高密度)和xhdpi(扩展高密度)。例如,如果要分别为高密度和中密度屏幕提供图片资源,就要建立res/drawable-mdpi和res/drawable-hdpi两个本地化图像资源目录。通常情况下,如果系统为发现相应劈木配置的资源目录,就使用默认的资源目录res/drawable,或更合适的资源目录(一般是选择高一阶的图像进行压缩)。
     

     

    三、屏幕尺寸和屏幕密度

      从Android 1.6(API Level=4)开始,Android开始支持多屏幕尺寸和屏幕密度适配,通过这种方式,可以覆盖目前所有的屏幕配置(不需要像以前那样直接指定屏幕物理分辨率了)。

      ◆ 屏幕尺寸(见上页分析);

      ◆ 屏幕密度分为4个等级:ldpi(低密度)、mdpi(中密度)、hdpi(高密度)和xhdpi(扩展高密度)。

      屏幕尺寸和屏幕密度分别以normal和mdpi为基准。

      每一个屏幕尺寸和屏幕密度都应用于一个范围,而不是一个固定值,也就是说尽管多部设备的尺寸都属于normal,但他们的屏幕物理尺寸和长度比例可能不同。下图是反话的屏幕尺寸、屏幕密度与实际的屏幕尺寸、屏幕密度的对应关系:

     

    使用屏幕尺寸设计UI时,必须要了解每一种尺寸要求的最小屏幕长宽尺寸。这些最小长宽尺寸使用dp(与屏幕密度无关的像素)作为单位。上面是上述4中泛化的屏幕尺寸对应的最小屏幕长宽尺寸。

      ◆ xlarge:960dp×720dp

      ◆ large:640dp×480dp

      ◆ normal:470dp×320dp

      ◆ small:426dp×320dp

      这些尺寸的单位都是dp,这就意味着与其对应的屏幕物理像素除了与屏幕尺寸有关,还与屏幕密度有关。例如,如果屏幕密度为中密度,dp与px等价,所有任何470px≤h<640px、320px≤w<480px的屏幕(h和w分别表示屏幕高度和宽度)都属于normal。二对于高密度屏幕,由于1dp=1.5px,所以large要求的最小物理尺寸为960px×720px。

      现在已Nexus 7和Nexus S为例,解释一下Android系统如何计算某一型号的设备属于那类屏幕尺寸。Nexus 7的屏幕密度是213(每英寸有213个物理像素点),为了方便,直接将屏幕的物理像素转换为dp,所以用dp为单位的屏幕尺寸为905dp×553dp(Nexus 7的屏幕物理像素尺寸是1205×736),对照上面4中泛化的屏幕尺寸,Nexus 7的屏幕尺寸处于large。对于Nexus S来说,屏幕密度为240(每英寸有240个物理像素点),而Nexus S的屏幕物理像素尺寸为800×480,将其用dp表示为533dp×320dp。从这一点上看,Nexus S的屏幕尺寸正好在normal与large之间,更具系统判定规则,这块屏幕属于normal。

     

     

    五、影响屏幕适配的重要因素:布局和图像

    1.布局屏幕适配

      布局可以使用与屏幕密度无关的单位(dp和sp)让UI自动调整,但在屏幕太小(如small等级的屏幕)或太大(如xlarge等级的屏幕)、以及屏幕方向变化的情况下,依靠系统自动调整会使雨鞋控件过小或过大,明显降低用户体验和显示效果。因此,在这种晴空下,简易单独提供相应的布局。

      ◆ 对于small等级的屏幕,由于屏幕尺寸太小,可能使用的UI布局与small和large等级的屏幕有很大差异。例如,由于缩小比例太小,Button 会变得过小,上面的文字肯显示不下,这种情况下就需要单独为small等级的屏幕调整UI布局。

      ◆ 对于xlarge等级(有时large等级也有此情况)的屏幕,尽管软件通过布局自动调整后的界面在使用上没有什么问题,但各种控件的尺寸会明显增大,,所以大多数情况下应为xlarge或large等级的屏幕专门提供UI布局。

      ◆ 的那个屏幕横竖屏切换时,屏幕会不断变宽变窄。很多情况下,由于屏幕的高度或宽度变小,是的原来显示正好合适的控件尺寸变小,甚至有一些控件无法显示了(被基础屏幕的课件范围),因此,如果在屏幕横向或纵向放置了大量的控件,除非这些控件的宽度和高度改变不影响用户的体验,否则应为横屏和纵屏单独提供UI布局。

      综上所述,除非控件的大小改变后不影响用户体验,否则应该为small、large、xlarge以及横纵屏单独提供UI布局。

     

    2.图像屏幕设备

      默认情况下,系统会更具屏幕的大小自动拉伸图像。对于普通的图像(.png、.jpg或.gif)来说,整个图像都会被拉伸,二对于默写应用来说,只需要拉伸图像的一部分即可。想实现这样的功能,就需要使用Nine-Patch(.9.png)格式的图像。

      为不同密度的屏幕常见不同的分辨率的图像资源是可以使用3:4:6:8的缩放原则。这4个数字是低密度、中密度、高密度、扩展高密度对于的图像分辨率的比例。例如,Android应用在中密度屏幕上使用的图标的分辨率是48×48,那么着4个密度等级对于的图像分辨率如下:

      ◆ 36×36:低密度。

      ◆ 48×48:中密度。

      ◆ 72×72:高密度。

      ◆ 96×96:扩展高密度。

     

     

    六、案例

      为了帮助更好地进行屏幕适配,这里先给出一些经典的屏幕宽度:

      ◆ 320dp:典型的手机屏幕(如240×320ldpi、320×480mdpi、480×800hdpi等);

      ◆ 480dp:手机和平板电脑都肯使用的尺寸(480×800mdpi);

      ◆ 600dp:用于7英寸的平板电脑(如Nexus 7的1280×800,介于mdpi和hdpi之间)。

      ◆ 720dp:用于10英寸的平板电脑(如Nexus 10的2560错1600,介于hdpi和xhdpi之间)。

    如果使用最小屏幕宽度表示,那么7英寸的平板电脑和手机提供两个不同的布局文件(main_activity.xnl),直接使用600dp即可。

      res/layout/main_activity.xml  // 适用于手机的布局文件

      res/layout-sw600dp/main_activity.xml  // 适用于7英寸平板电脑的布局文件

    如果使用上面两个资源目录,只有屏幕可使用的宽度大于600dp时,系统才会使用res/layout-sw600dp目录中的资源,而通常只有7英寸或以上的平板电脑屏幕才能达到600dp。

    如果还想进一步的区分屏幕的尺寸,例如,分别为手机、7英寸平板电脑和10英寸的平板电脑提供布局文件,那么就需要在如下3个资源目录文件中峰值相应的main_activity.xml文件。

      // 适用于手机的布局文件,屏幕最小宽度小于600dp

      res/layout/main_activity.xml

      // 适用于7英寸平板电脑的布局文件,屏幕最小宽度等于600dp,但小于720dp

      res/layout-sw600dp/main_activity.xml

      // 适用于10英寸平板电脑的布局文件,屏幕最小宽度大于等于720dp

      res/layout-sw720dp/main_activity.xml

     

    当然,除了屏幕最小宽度,还可以通过可使用的屏幕高度和宽度进行屏幕适配,使用方法与屏幕最小宽度类似。

  • 相关阅读:
    【React Native】某个页面禁用物理返回键
    【React Native】DeviceEventEmitter监听通知及带参数传值
    转载【React Native代码】手写验证码倒计时组件
    【React Native】 中设置 APP 名称、应用图标、为安卓添加启动图
    【React Native错误集】* What went wrong: Execution failed for task ':app:installDebug'.
    【React Native错误集】Import fails with "Failed to execute 'ImportScripts' on 'WorkerGlobalScope'"
    【React Native错误集】Android error “Could not get BatchedBridge, make sure your bundle is packaged properly” on start of app
    「React Native笔记」在React的 setState 中操作数组和对象的多种方法(合集)
    【React Native】Error: Attribute application@allowBackup value=(false) from AndroidManifest.xml
    坚果云如何使用二次验证码/谷歌身份验证器/两步验证/虚拟MFA?
  • 原文地址:https://www.cnblogs.com/steffen/p/3833087.html
Copyright © 2011-2022 走看看