android屏幕适配

来源:互联网 发布:水电施工图软件 编辑:程序博客网 时间:2024/06/15 20:29

  • android 屏幕适配
    • 为什么要进行屏幕适配
    • 核心概念和单位详解
    • 屏幕宽度适配解决方案
      • 1 使用wrap_content match_parent和weight
      • 2 使用相对布局
      • 3 使用限定符
        • 31 尺寸限定符
        • 32 最小宽度限定符
        • 33 布局别名
        • 34 屏幕方向限定符
      • 35 使用自动拉伸位图
    • 屏幕密度适配解决方案

android 屏幕适配

1 为什么要进行屏幕适配

由于android开源,因此各大厂商都可以对安卓进行定制,导致android碎片化非常严重。
从 https://opensignal.com/reports/2014/android-fragmentation/ 中的报告可以看到2014年android碎片化的情况。

厂商分布:
这里写图片描述

屏幕大小:
这里写图片描述

2 核心概念和单位详解

  • 屏幕尺寸
    屏幕对角线的长度,单位为英寸(2.54厘米)。

  • 屏幕分辨率
    横纵向上像素的点数,单位是px,1px就是一个像素点。如1920(纵)x1080(横)

  • 像素密度
    每英寸上像素点的个数,单位是dpi.
    计算方法:以nexus5为例,4.95inch,1920*1080,那么

    dpi=19202+108024.95=445

160dpi的情况下,1dp=1px

sp: 用于设置文字,支持文字大小缩放,最好不要使用奇数。

谷歌对不同的像素密度把屏幕又分为以下几种:

名称 范围 ldpi QVGA (240×320) mdpi HVGA (320×480) hdpi WVGA (480×800),FWVGA (480×854) xhdpi 720P(1280*720) xxhdpi 1080p(1920*1080 ) xxxhdpi 4K(3840×2160)

这里写图片描述

3 屏幕宽度适配解决方案

3.1 使用wrap_content, match_parent和weight

可实现的效果如下:
这里写图片描述

标题栏中,只要把中间白色部分的weight设置为1,两边的设置为0,就能实现newsreader标题自动拉伸。

weight计算方法:

计算出来的宽度=原有宽度+剩余空间所点百分比宽度
以下面的为例,设屏幕宽度为L

这里写图片描述
button1=0+L*1/3=1/3L
button2=0+L*2/3=2/3L

这里写图片描述
button1 = L+(L-2L)*1/3=2/3L
button2 = L+(L-2L)*2/3=1/3L

3.2 使用相对布局

LinearLayout就属于相对布局。
这里写图片描述

这里写图片描述
把ok按钮相对于输入框右下角,cancel在ok左边,就可以很好地控制控件间的相对关系。

3.3 使用限定符

3.3.1 尺寸限定符

布局如下:
res/layout/main.xml 单面板

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="vertical"    android:layout_width="match_parent"    android:layout_height="match_parent">    <fragment android:id="@+id/headlines"              android:layout_height="fill_parent"              android:name="com.example.android.newsreader.HeadlinesFragment"              android:layout_width="match_parent" /></LinearLayout>

res/layout-large/main.xml 双面板

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:orientation="horizontal">    <fragment android:id="@+id/headlines"              android:layout_height="fill_parent"              android:name="com.example.android.newsreader.HeadlinesFragment"              android:layout_width="400dp"              android:layout_marginRight="10dp"/>    <fragment android:id="@+id/article"              android:layout_height="fill_parent"              android:name="com.example.android.newsreader.ArticleFragment"              android:layout_width="fill_parent" /></LinearLayout>

这样就可以实现在手机和平板上实现不同的布局。

3.3.2 最小宽度限定符

谷歌在安卓3.2以后,为了更加精确地适配设备,推出了最小宽度限定符。

res/layout-sw600dp/main.xml,双面板布局: Small Width 最小宽度

3.3.3 布局别名

以上两种方法,有一个缺点,就是要同时维护多个相同名字的布局文件。

res/layout/main.xml:            单面板布局res/layout-large/main.xml:      多面板布局res/layout-sw600dp/main.xml:    多面板布局res/layout/main.xml             单面板布局res/layout/main_twopanes.xml    双面板布局setContentView(R.layout.main);

使用别名方法就可以把不同布局命名成不同的文件,方便维护。

默认布局
res/values/layout.xml:

<resources>    <item name="main" type="layout">@layout/main</item></resources>

Android3.2之前的平板布局
res/values-large/layout.xml:

<resources>    <item name="main" type="layout">@layout/main_twopanes</item></resources>

Android3.2之后的平板布局
res/values-sw600dp/layout.xml:

<resources>    <item name="main" type="layout">@layout/main_twopanes</item></resources>

3.3.4 屏幕方向限定符

res/values-sw600dp-land/layouts.xml:

<resources>    <item name="main" type="layout">@layout/main_twopanes</item></resources>

res/values-sw600dp-port/layouts.xml:

<resources>    <item name="main" type="layout">@layout/main</item></resources>

3.3.5 使用自动拉伸位图

把图片命名为 xxx.9.png就可以用as进行编辑
左上边用于设置拉伸线,右下角用于设置内容填充区域,控件的padding。
可参考
http://isux.tencent.com/android-ui-9-png.html
http://www.imooc.com/video/9364

4 屏幕密度适配解决方案

未完

原文:
http://www.imooc.com/learn/484
http://blog.csdn.net/zhaokaiqiang1992/article/details/45419023