如何使我的布局适合 Android 中的任何屏幕答案

【问题标题】：How to fit my Layout to any Screen in Android如何使我的布局适合 Android 中的任何屏幕
【发布时间】：2015-02-06 20:41:09
【问题描述】：

我正在为 Android 构建自己的应用程序游戏，这是一款井字游戏。我的活动主要包含 ImageViews ，所有图像都放置在目录 res\drawable-mdpi 中。其余的可绘制文件夹是空的。

我的问题是，当我在 5.4 英寸 MDPI 屏幕上运行应用程序时，它运行良好，看起来像这样：

但是当我在另一个不同尺寸的屏幕上运行应用程序时，例如这个 4.65 英寸 XHDPI 屏幕，它看起来像这样：

在上面的活动中，我使用了 LinearLayout 和 RelativeLayout，我应该怎么做才能使我的布局适合任何屏幕？

谢谢

感谢编辑图片

这是activity_board.xml的xml文件的代码：

<?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="wrap_content"
android:background="@drawable/board_page_bg"
android:gravity="center" >

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"

    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="100dp"
        android:background="@drawable/board"
        android:orientation="vertical" >

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_marginLeft="30dp"
            android:layout_marginRight="5dp"
            android:layout_marginTop="5dp" >

            <RelativeLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" >

                <TextView
                    android:id="@+id/players_name"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="20dp"
                    android:layout_marginTop="2dp"
                    android:text="@string/playersName"
                    android:textSize="30sp" />
            </RelativeLayout>

            <RelativeLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" >

                <TextView
                    android:id="@+id/players_score"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="150dp"
                    android:layout_marginTop="5dp"
                    android:text="@string/playersPoints"
                    android:textSize="25sp" />
            </RelativeLayout>

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:gravity="right" >

                <TextView
                    android:id="@+id/machines_score"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginRight="172dp"
                    android:layout_marginTop="5dp"
                    android:text="@string/machinePoints"
                    android:textSize="25sp" />
            </RelativeLayout>

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:gravity="right" >

                <TextView
                    android:id="@+id/machines_name"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginRight="50dp"
                    android:onClick="openChat"
                    android:clickable="true"
                    android:text="@string/machineName"
                    android:textSize="30sp" />
            </RelativeLayout>
        </RelativeLayout>

        <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp" >

            <ImageView
                android:id="@+id/block1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:onClick="touch"
                android:src="@drawable/block_1_empty" />

            <ImageView
                android:id="@+id/block2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="155dp"
                android:onClick="touch"
                android:src="@drawable/block_2_empty" />

            <ImageView
                android:id="@+id/block3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="310dp"
                android:onClick="touch"
                android:src="@drawable/block_3_empty" />
        </RelativeLayout>

        <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="40dp" >

            <ImageView
                android:id="@+id/block4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="8dp"
                android:onClick="touch"
                android:src="@drawable/block_4_empty" />

            <ImageView
                android:id="@+id/block5"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="150dp"
                android:layout_marginTop="10dp"
                android:onClick="touch"
                android:src="@drawable/block_5_empty" />

            <ImageView
                android:id="@+id/block6"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="310dp"
                android:layout_marginTop="10dp"
                android:onClick="touch"
                android:src="@drawable/block_6_empty" />
        </RelativeLayout>

        <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="55dp" >

            <ImageView
                android:id="@+id/block7"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:onClick="touch"
                android:src="@drawable/block_7_empty" />

            <ImageView
                android:id="@+id/block8"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="155dp"
                android:onClick="touch"
                android:src="@drawable/block_8_empty" />

            <ImageView
                android:id="@+id/block9"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="315dp"
                android:onClick="touch"
                android:src="@drawable/block_9_empty" />
        </RelativeLayout>

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_marginTop="6dp" >

            <RelativeLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" >

                <TextView
                    android:id="@+id/game_number"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="105dp"
                    android:text="@string/gameNumber"
                    android:textSize="25sp" />
            </RelativeLayout>

            <RelativeLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" >

                <TextView
                    android:id="@+id/count_down"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="390dp"
                    android:text="@string/countDown"
                    android:textSize="25sp" />
            </RelativeLayout>
        </RelativeLayout>
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginTop="20dp"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/end_game"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/EndGame"
            android:onClick="endGame"
            android:src="@drawable/endgame_btn_1" />
    </LinearLayout>
</LinearLayout>

【问题讨论】：

我认为您正在使用dp 等硬编码的宽度和高度值。开始使用wrap_content、fill_parent等之类的值。在线性布局的情况下使用权重。这些值负责根据不同的屏幕调整大小。
感谢回复，我添加了活动的xml文件，请看一下
也请查看此链接：- developer.android.com/training/best-ui.html

标签： java android eclipse layout

【解决方案1】：

你在使用RelativeLayout吗？

你应该 1.使用RelativeLayout作为基础容器 2.将“Player”和“System”分数放在同一个水平LinearLayout中，这样它们就不会重叠 3.将“结束游戏”按钮作为对齐父底部的元素

您附上的屏幕截图显示这是由软状态栏引起的问题。 RelativeLayout 会有所帮助，您应该尽量避免以数字形式对尺寸进行硬编码，而是使用边距、“layout_toLeftOf”、“layout_toRightOf”等在 RelativeLayout 中进行自动调整。

【讨论】：

我认为这就是我所做的，请查看我添加的 XML 代码。谢谢:)
比如block1、block2和block3没有关系，但实际上block2应该是toRightOf block1

【解决方案2】：

在res 中创建一个drawable 文件夹，仅包含“drawable”一词，并将您的游戏图像放入其中。这将使游戏图像在所有设备密度上都相同。

如果不查看您的 XML，我同意您可能正在使用硬编码的 dp 值而不是使用数学来调整布局大小，即权重、match_parent、alignParentRight 等。

我已将您的 XML 调整为更容易。我没有将它插入预览器或其他任何东西。

<?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="wrap_content"
android:background="@drawable/board_page_bg"
android:gravity="center" >

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="100dp"
        android:layout_marginLeft="ADJUST ME"
        android:layout_marginRight="ADJUST ME"
        android:background="@drawable/board"
        android:orientation="vertical" >

        <!-- Scoreboard -->
        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="30dp"
            android:layout_marginRight="5dp"
            android:layout_marginTop="5dp" >

            <TextView
                android:id="@+id/players_name"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="20dp"
                android:layout_marginTop="2dp"
                android:layout_alignParentLeft="true"
                android:text="@string/playersName"
                android:textSize="30sp" />

            <TextView
                android:id="@+id/players_score"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="150dp"
                android:layout_marginTop="5dp"
                android:layout_toLeftOf="@id/players_name"
                android:text="@string/playersPoints"
                android:textSize="25sp" />

            <TextView
                android:id="@+id/machines_score"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginRight="172dp"
                android:layout_marginTop="5dp"
                android:layout_toRightOf="@id/machines_name"
                android:text="@string/machinePoints"
                android:textSize="25sp" />

            <TextView
                android:id="@+id/machines_name"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginRight="50dp"
                android:onClick="openChat"
                android:layout_alignParentRight="true"
                android:clickable="true"
                android:text="@string/machineName"
                android:textSize="30sp" />
        </RelativeLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/block1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:onClick="touch"
                android:src="@drawable/block_1_empty" />

            <ImageView
                android:id="@+id/block2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:onClick="touch"
                android:src="@drawable/block_2_empty" />

            <ImageView
                android:id="@+id/block3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:onClick="touch"
                android:src="@drawable/block_3_empty" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/block4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:onClick="touch"
                android:src="@drawable/block_4_empty" />

            <ImageView
                android:id="@+id/block5"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:onClick="touch"
                android:src="@drawable/block_5_empty" />

            <ImageView
                android:id="@+id/block6"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:onClick="touch"
                android:src="@drawable/block_6_empty" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/block7"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:onClick="touch"
                android:src="@drawable/block_7_empty" />

            <ImageView
                android:id="@+id/block8"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:onClick="touch"
                android:src="@drawable/block_8_empty" />

            <ImageView
                android:id="@+id/block9"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:onClick="touch"
                android:src="@drawable/block_9_empty" />
        </LinearLayout>

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_marginTop="ADJUST ME" >

            <TextView
                android:id="@+id/game_number"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:text="@string/gameNumber"
                android:textSize="25sp" />

            <TextView
                android:id="@+id/count_down"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:text="@string/countDown"
                android:textSize="25sp" />
        </RelativeLayout>
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginTop="20dp"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/end_game"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/EndGame"
            android:onClick="endGame"
            android:src="@drawable/endgame_btn_1" />
    </LinearLayout>
</LinearLayout>

【讨论】：

我会按照你说的做drawable文件夹，但也请看看我添加的代码，都是使用wrap_content和match_parent谢谢
查看我的编辑。我从中删除了很多不必要的垃圾。它分为三个主要部分：记分牌、游戏板以及游戏和倒计时区域。这可能不完全适合，但肯定更好。设计有些缺陷，因为背景图像是图形的大部分，所以背景会在不同的纵横比上拉伸。我建议你把背景分成几块。
我创建了文件夹drawable-xxxhdpi，drawable-xxhdpi，drawable-xhdpi，其余的，我用一个叫做9Patch resizer的软件来改变我的mdpi (default pictures to xxxhdpi)，红色的BUTTONS调整大小很好，但是在板子活动中，板子（它是一个图像）的大小调整得很好，但是当我在我的xxxhdpi 手机上运行时它仍然拉伸，就像图片中一样......我现在正在尝试你的代码，我不知道你是什么意思ADJUST ME 在第一个 LinearLayout 中，但我会尝试删除这两个属性..
调整我的意思是你必须输入你自己的数字，让它们看起来不错。 xxxhdpi目前是一个很冷门的分辨率，很容易被忽略。
它仍然不起作用，我无法控制此特定活动中的图像和字体，而且您更改的 xml 代码仍然不起作用