android - 如何为不同宽高比的屏幕尺寸布局按钮

Question

我正在尝试将按钮放置在用作多种设备/屏幕尺寸背景的图像之上。如果我在 relativeLayout 中为宽高比为 9:16 的设备(例如 Galaxy Nexus 或 Nexus 5)定义按钮，以便按钮与图像上的特定点对齐，那么它不会与相同的点对齐宽高比为 3:5 的设备(例如 Nexus S)上的图像。在我的相对布局中，第一个按钮与屏幕的左侧和底部有一个偏移量对齐(例如 android:layout_marginLeft="32dp"和 android:layout_marginBottom="150dp")。所有其他按钮都与此按钮对齐。

我花了几天时间尝试通过实验和搜索教程来解决这个问题，但似乎没有任何效果。

下图适用于 Nexus 5。如您所见，按钮与背景对齐:

下图是 Nexus S 的图片。如您所见，按钮偏离了背景

编辑:我显然遗漏了一些关键概念。对于 hdpi、xhdpi 和 xxhdpi 的每个屏幕密度，我都有单独的目录。但是，根据我附上的两张图片，似乎我需要为尺寸为 480x800 与 720x1280 和 1080x1920 的屏幕设置单独的布局。似乎 720x1280 的屏幕必须与 1080x1920 屏幕需要相同的布局，因为 Nexus 5 和 Galaxy Nexus 具有相同的结果(即如第一张图片所示)。为了创建一个单独的布局，我试过使用 layout-small、layout、layout-large 等(这是不推荐使用的方法)，以及 layout-sw480dp 和 layout-sw720dp。然后，调整第一个按钮的 layout_marginLeft 和 layout_margin_bottom 以适应合适的屏幕尺寸。这些方法都不起作用。

这是第一张图片的当前布局内容:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    android:paddingLeft="15dp"
    android:paddingBottom="5dp"
    tools:context="com.myCompany.myApp.MainActivity"
    android:background="@drawable/android_home_screen">

<Button
    style="?android:attr/buttonStyleSmall"
    android:layout_width="90dp"
    android:layout_height="wrap_content"
    android:text="Channel 1"
    android:id="@+id/channel1"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:textColor="#FFFFFF"
    android:layout_marginBottom="145dp"
    android:layout_marginLeft="17dp"
    android:lines="2" />

<Button
    style="?android:attr/buttonStyleSmall"
    android:layout_width="90dp"
    android:layout_height="wrap_content"
    android:text="Channel 3"
    android:id="@+id/channel3"
    android:textColor="#FFFFFF"
    android:layout_marginLeft="0dp"
    android:layout_toRightOf="@+id/channel1"
    android:layout_alignTop="@+id/channel1"
    android:lines="2" />

<Button
    style="?android:attr/buttonStyleSmall"
    android:layout_width="90dp"
    android:layout_height="wrap_content"
    android:text="Channel 5"
    android:id="@+id/channel5"
    android:textColor="#FFFFFF"
    android:layout_marginLeft="0dp"
    android:layout_toRightOf="@+id/channel3"
    android:layout_alignTop="@+id/channel3"
    android:lines="2" />

...

</RelativeLayout>

请帮助我了解如何将按钮放置在图像的特定位置之上，而不管屏幕尺寸/纵横比/屏幕密度如何。具体来说，请提供一个示例，说明如何为 480x800 和 720x1280 的屏幕尺寸定义出现在背景图像的同一视觉点上的按钮。

以下是屏幕背景的完整图像。我试图将按钮放在带有细金色轮廓的区域的顶部。在 hdpi、xhdpi 和 xxhdpi 的每个 drawable 目录中都有其中之一。 hdpi图像为480x693像素，xhdpi图像为720x1040像素，xxhdpi图像为1080x1559像素，分辨率分别为213.34ppi、320ppi、480ppi。这些分辨率和尺寸使图像在点方面具有相同的图像大小(宽度和高度)。

Answer 1

您可以使用线性布局的权重属性来管理您的布局，它会自动调整屏幕

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

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_margin="10dp"
        android:background="#fff"
        android:orientation="vertical"
        android:padding="10dp" >

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:weightSum="3" >

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1" />

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1" />

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="20dp"
            android:orientation="horizontal"
            android:weightSum="1" >

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight=".1" />

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight=".4" />

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight=".4" />

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight=".1" />
        </LinearLayout>
    </LinearLayout>

</RelativeLayout>