什么是合理的布局方式?

In the image below, the yellow square represents a RelativeLayout that's within my overall layout.

在下图中，黄色方块代表了一个相对的布局，在我的总体布局中。

The top row "status message" is a ViewFlipper that responds to the ToggleButtons (A, B) that the user can press. Buttons C, D, and E do other stuff that reload the entire view. Our client is requesting that buttons A, B, C, D, and E be arranged as in the fashion below. (Vertical alignment isn't as important as horizontal alignment.)

第一行“状态消息”是一个ViewFlipper，它响应用户可以按下的ToggleButtons (a, B)。按钮C, D，和E做其他的事情来重载整个视图。我们的客户要求A、B、C、D、E按以下方式排列(垂直对齐没有水平对齐重要。)

EDIT to say A, B, C, D, and E are images about 20x20 dip; they are being aligned within a width of about 300dip. I want the buttons to maintain their aspect ratio.

编辑为A、B、C、D、E为20x20 dip的图像;它们的宽度在300度左右。我想让按钮保持它们的纵横比。

I've created an extension of LinearLayout that inflates buttons A and B (from an xml file), and then another LinearLayout that inflates buttons C, D, and E in another xml file.

我创建了一个线性布局的扩展，它使按钮A和B(来自xml文件)膨胀，然后在另一个xml文件中创建另一个线性布局，使按钮C、D和E膨胀。

Buttons A and B (are actually ToggleButtons):

按钮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>

Buttons C,D,E xml file:

按钮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>

My code basically works, but I have to fudge with the margins to make things line up correctly (which they don't yet). I wonder if there's some cleaner way of center aligning button-sets "A B" and "C D E"

我的代码基本上是可以工作的，但是我必须在空白处修改，以使代码正确地排列(他们还没有这样做)。我想知道是否有一种更干净的方式来对齐按钮设置A B和C D E

ps: the astute reader will notice that I'm extending LinearLayout, but inflating RelativeLayouts. (I don't know why it can even work at all, but) when I tried extending RelativeLayout instead, the "C D E" layout didn't even appear on my device. I don't know where it went.

精明的读者会注意到，我在扩展线性布局，但却在膨胀相对论。(我不知道为什么它甚至可以工作，但是)当我尝试扩展相对布局时，我的设备上甚至没有出现“C D E”的布局。我不知道它去哪儿了。

1 个解决方案

#1

Use a linear layout as the main body.

使用线性布局作为主体。

Then use layout_gravity on the individual horizontal linearlayouts to keep the content centred

然后使用layout_gravity对单个水平线性布局来保持内容的中心。

Use the layout_margin on each of the child view to space them apart. I have specified this as 15dip but you should use a dimension so you can modify them all together.

在每个子视图上使用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>