Question

在下图中，黄色方块表示在我的整体布局中的RelativeLayout。

顶行“状态消息”是一个ViewFlipper，它响应用户可以按下的ToggleButtons（A，B）。按钮C，D和E执行重新加载整个视图的其他内容。我们的客户要求按钮A，B，C，D和E按照下面的方式排列。（垂直对齐不如水平对齐重要。）

编辑说A，B，C，D和E是大约20x20倾角的图像;它们在约300dip的宽度内对齐。我希望按钮保持其纵横比。

looking to make this layout

我创建了一个LinearLayout的扩展，它扩展了按钮A和B（来自xml文件），然后是另一个LinearLayout，它使另一个xml文件中的按钮C，D和E膨胀。

按钮A和B（实际上是ToggleButtons）：

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:baselineAligned="true"
>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
    >
        <ToggleButton
            android:id="@+id/A"
            android:textOn=""
            android:textOff=""
            android:background="@layout/A"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="60dp"
            android:layout_marginRight="30dp"
        />
        <ToggleButton
            android:id="@+id/B"
            android:textOn=""
            android:textOff=""
            android:background="@layout/B"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="30dp"
            android:layout_marginRight="30dp"
        />
    </LinearLayout>
</RelativeLayout>

按钮C，D，E xml文件：

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:baselineAligned="true"
>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
    >
        <ImageView 
            android:id="@+id/C"
            android:src="@drawable/C"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="30dp"
            android:layout_marginRight="30dp"
        />
        <ImageView 
            android:id="@+id/D"
            android:src="@drawable/D"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="30dp"
            android:layout_marginRight="30dp"
        />
        <ImageView 
            android:id="@+id/E"
            android:src="@drawable/E"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="30dp"
            android:layout_marginRight="30dp"
        />
    </LinearLayout>
</RelativeLayout>

我的代码基本上有效，但是我必须用边缘来捏造才能使事情正确排列（他们还没有）。我想知道是否有一些更清洁的中心对齐按钮组“A B”和“C D E”的方式

ps：精明的读者会注意到我正在扩展LinearLayout，但却在膨胀RelativeLayouts。（我不知道为什么它甚至可以工作，但是）当我尝试扩展RelativeLayout时，“C D E”布局甚至没有出现在我的设备上。我不知道它去了哪里。

Answer 1

使用线性布局作为主体。

然后在单独的水平线性布局上使用layout_gravity以使内容保持居中

在每个子视图上使用layout_margin将它们分开。我已将此指定为15dip，但您应使用维度，以便可以一起修改它们。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView android:id="@+id/some_text"
        android:layout_height="wrap_content"
        android:text="Some random string." android:layout_gravity="center" android:layout_width="wrap_content"/>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center">
        <ToggleButton
            android:id="@+id/A"
            android:textOn=""
            android:textOff=""
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@layout/A"
            android:layout_margin="15dip"/>
        <ToggleButton
            android:id="@+id/B"
            android:textOn=""
            android:textOff=""
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@layout/B"
            android:layout_margin="15dip"/>
    </LinearLayout>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center">
        <ImageView 
            android:id="@+id/C"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/C"
            android:layout_margin="15dip"/>
        <ImageView 
            android:id="@+id/D"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/D"
            android:layout_margin="15dip"/>
        <ImageView 
            android:id="@+id/E"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/E"
            android:layout_margin="15dip"/>
    </LinearLayout>

</LinearLayout>

制作这种布局的合理方法是什么？

1 个答案: