如何在不同的屏幕尺寸上进行布局缩放?

时间:2016-06-22 08:54:05

标签: java android android-layout layout textview

我有简单的布局,你可以玩4种不同的关卡/模式。问题是当我在不同的屏幕尺寸上预览布局时,它看起来不一样: Image

这是布局代码:

    <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent" android:layout_height="match_parent"
    android:background="#000000">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="120dp"
        android:text="play"
        android:gravity="center"
        android:textSize="50sp"
        android:id="@+id/one"
        android:layout_alignParentTop="true"
        android:background="@drawable/mode1background"
        android:layout_alignParentLeft="true"
        android:layout_alignParentRight="true"
        android:textColor="#000000" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="120dp"
        android:text="play"
        android:gravity="center"
        android:textSize="50sp"
        android:id="@+id/two"
        android:background="@drawable/mode2background"
        android:layout_below="@+id/one"
        android:layout_alignParentRight="true"
        android:layout_alignParentLeft="true"
        android:textColor="#000000" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="120dp"
        android:text="play"
        android:gravity="center"
        android:textSize="50sp"
        android:id="@+id/three"
        android:background="@drawable/mode3background"
        android:layout_below="@+id/two"
        android:layout_alignParentLeft="true"
        android:layout_alignParentRight="true"
        android:textColor="#000000" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="120dp"
        android:text="play"
        android:gravity="center"
        android:textSize="50sp"
        android:id="@+id/four"
        android:background="@drawable/mode4background"
        android:layout_below="@+id/three"
        android:layout_alignParentLeft="true"
        android:layout_alignParentRight="true"
        android:textColor="#000000" />

</RelativeLayout>

如何让每个TextView成为屏幕尺寸的1/4。

4 个答案:

答案 0 :(得分:3)

您可以使用带有LinearLayout属性的垂直android:layout_weight

这样的事情:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:background="#000000"
              android:orientation="vertical">

    <TextView
        android:id="@+id/one"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="0.25"
        android:background="@drawable/mode1background"
        android:gravity="center"
        android:textColor="#000000"
        android:textSize="50sp"/>

    <TextView
        android:id="@+id/two"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="0.25"
        android:background="@drawable/mode2background"
        android:gravity="center"
        android:textColor="#000000"
        android:textSize="50sp"/>

    <TextView
        android:id="@+id/three"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="0.25"
        android:background="@drawable/mode3background"
        android:gravity="center"
        android:textColor="#000000"
        android:textSize="50sp"/>

    <TextView
        android:id="@+id/four"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="0.25"
        android:background="@drawable/mode4background"
        android:gravity="center"
        android:textColor="#000000"
        android:textSize="50sp"/>

</LinearLayout>

查看LinearLayout上的开发人员指南和布局权重: https://developer.android.com/guide/topics/ui/layout/linear.html

答案 1 :(得分:2)

将父级布局更改为LinearLayout垂直方向。然后将每个孩子的身高设置为0dp,权重设置为1

示例:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:orientation="vertical">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:gravity="center"
        android:text="1"/>

    <TextView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:gravity="center"
        android:text="2"/>

    <TextView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:gravity="center"
        android:text="3"/>

    <TextView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:gravity="center"
        android:text="4"/>

</LinearLayout>

答案 2 :(得分:0)

在资源文件夹中创建以下目录,并在背景中放置不同分辨率的背景图像

抽拉-LDPI

抽拉-MDPI

抽拉-HDPI

抽拉-xhdpi

抽拉-xxhdpi

抽拉-xxxhdpi

注意所有文件夹中的图像名称应该相同,android会根据手机的dpi自动从相应的文件夹中选择图像

答案 3 :(得分:0)

当你想要占据设备的整个高度时,你需要使用带有垂直oreintation的线性布局,并为所有TextView提供属性'layout_weight'= 1。 示例代码

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#000000"
    android:orientation="vertical">

    <TextView
        android:id="@+id/one"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:layout_weight="1"
        android:background="@drawable/mode1background"
        android:gravity="center"
        android:text="play"
        android:textColor="#000000"
        android:textSize="50sp" />

    <TextView
        android:id="@+id/two"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentRight="true"
        android:layout_below="@+id/one"
        android:layout_weight="1"
        android:background="@drawable/mode2background"
        android:gravity="center"
        android:text="play"
        android:textColor="#000000"
        android:textSize="50sp" />

    <TextView
        android:id="@+id/three"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentRight="true"
        android:layout_below="@+id/two"
        android:layout_weight="1"
        android:background="@drawable/mode3background"
        android:gravity="center"
        android:text="play"
        android:textColor="#000000"
        android:textSize="50sp" />

    <TextView
        android:id="@+id/four"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentRight="true"
        android:layout_below="@+id/three"
        android:layout_weight="1"
        android:background="@drawable/mode4background"
        android:gravity="center"
        android:text="play"
        android:textColor="#000000"
        android:textSize="50sp" />

</LinearLayout>