0307-屏幕适配

一、什么是屏幕适配

    屏幕适配是通过尺寸、图片、文字和布局4种类型资源进行合理设计及规划,
    在布局时合理利用各种类型资源,让布局拥有适应能力,能在各种设备先保持良好的展现效果。

二、如何进行屏幕适配

1.尺寸单位适配

    在res下新建values-1080x960的文件夹,分别创建名为diemns.xml的文件。

这里写图片描述

    在每个diemns.xml创建一个<dimen>标签:
<dimen name="btn_width">200dp</dimen>
<dimen name="btn_width">500dp</dimen>

注意:name的名字要一致

    在activity.xml文件中创建一个Button,设置其宽度时,使用
 <Button
        android:layout_width="@dimen/btn_width"
        android:layout_height="@dimen/btn_width"
        android:text="@string/text_btn"
        android:textSize="50sp"
        />
    在1080*960的分辨率和正常分辨率下,观察Button的宽度变化。

2.图片适配

    分别将两张不同的图片放入hdpi和xhdpi中,命名相同
    在布局文件中创建一个ImageView,src属性指向刚才放入的图片
    用不同的设备运行,观察分别加载刚才放入的图片
<ImageView
        android:layout_width="@dimen/img_width"
        android:layout_height="@dimen/img_width"
        android:src="@mipmap/jsj"
        />

3.文字适配

    文字适配是根据手机语言的设置,从而将APP内的语言随着手机语言而转换。
    在res下新建values-en的文件夹,分别创建名为string.xml的文件。
    在string.xml文件下分别写:
<string name="text_btn">Hello</string>
<string name="text_btn">你好</string>

这里写图片描述
这里写图片描述

以上两个图片包括了文字适配和图片适配的效果

4.布局适配

    在res下新增layout-land和layout-port文件夹。分别创建名为activityb.xml文件。
    其实就是把原来的布局文件复制到layout-land文件夹下。
    观察横竖屏下不同的布局。    

layout-port文件里xml代码

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"//横屏时为垂直布局
    android:background="@color/colorPrimaryDark"
    tools:context="com.test.project.applicationfragment.bActivity">



    <ImageView
        android:layout_width="@dimen/img_width"
        android:layout_height="@dimen/img_width"
        android:src="@mipmap/jsj"
        />


    <TextView
        android:layout_width="@dimen/btn_width"
        android:layout_height="@dimen/btn_width"
        android:text="@string/text_btn"
        android:textSize="50sp"
        />
</LinearLayout>

layout-land文件里xml代码

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"//竖屏时为水平布局
    tools:context="com.test.project.applicationfragment.bActivity">



    <ImageView
        android:layout_width="@dimen/img_width"
        android:layout_height="@dimen/img_width"
        android:src="@mipmap/jsj"
        />


    <TextView
        android:layout_width="@dimen/btn_width"
        android:layout_height="@dimen/btn_width"
        android:text="@string/text_btn"
        android:textSize="50sp"
        />
</LinearLayout>

这里写图片描述

这里写图片描述

注意:不同布局文件下标签的命名一定要一致。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值