java - android如何设计这个布局

Question

我有一个示例布局，我正在尝试使用 xml 在 android 中创建它。我能够创建类似的布局，但我觉得我的方法可能是错误的。

在这些情况下，我一直在做的是嵌套相对布局以充当“行”。下图演示了我会做什么。

你们如何创建与此类似的布局？我觉得嵌套相对布局好像有点矫枉过正，但我​​不确定如果不这样做，我如何才能让一切都居中。

当我没有嵌套我使用的布局时

android:layout_toRightOf="..."
android:layout_below="@+id/t1"

在 t5、t6 和 t7(来自图像)。结果看起来不正确。 t1、t2、t3 和 t4 不再水平居中。

有没有办法告诉相对布局，此点之后的所有内容都应出现在新行中？或者相对布局是错误的方式去做这样的事情吗？我认为表格布局无法正常工作，因为每一行不一定需要具有相同数量的 View ，并且它们需要居中。

任何建议表示赞赏!

Answer 1

您可以在垂直 LinearLayout 中嵌套两个水平 LinearLayout。可能不如 RelativeLayout 高效，但更容易获得您想要的居中行为。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TextView
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="@string/hello" />
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center_horizontal"
    android:orientation="horizontal" >
    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="A" />
    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="B" />
    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="C" />
    <Button
        android:id="@+id/button4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="D" />
</LinearLayout>
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center_horizontal"
    android:orientation="horizontal" >
    <Button
        android:id="@+id/button5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="E" />
    <Button
        android:id="@+id/button6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="F" />
    <Button
        android:id="@+id/button7"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="G" />
</LinearLayout>
</LinearLayout>

这是使用 RelativeLayout 的同一布局的另一个版本。我从上面的嵌套 LinearLayouts 开始，选择“Refactor > Android > Change Layout...”，选择 RelativeLayout，然后调整结果布局，直到我把东西居中。

我使用了一些技巧来解决问题。我首先将中间按钮置于父按钮的中央，然后向左和向右扩展。在顶行，中间有偶数个按钮和空间，我使用居中的 0 宽度 TextView 来锚定按钮。我想这有点 hacky，但它完成了工作。 :-)

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/RelativeLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_horizontal"
android:orientation="vertical" >
<TextView
    android:id="@+id/TextView1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:text="@string/hello" />
<TextView
    android:id="@+id/Dummy"
    android:layout_width="0dp"
    android:layout_height="48dp"
    android:layout_centerInParent="true"
    android:layout_below="@+id/TextView1" />
<Button
    android:id="@+id/button2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignTop="@+id/Dummy"
    android:layout_toLeftOf="@+id/Dummy"
    android:text="B" />
<Button
    android:id="@+id/button1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBaseline="@+id/button2"
    android:layout_alignTop="@+id/Dummy"
    android:layout_toLeftOf="@+id/button2"
    android:text="A" />
<Button
    android:id="@+id/button3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBaseline="@+id/button2"
    android:layout_alignTop="@+id/Dummy"
    android:layout_toRightOf="@+id/Dummy"
    android:text="C" />
<Button
    android:id="@+id/button4"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBaseline="@+id/button2"
    android:layout_alignTop="@+id/Dummy"
    android:layout_toRightOf="@+id/button3"
    android:text="D" />
<Button
    android:id="@+id/button6"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:layout_below="@+id/Dummy"
    android:text="F" />
<Button
    android:id="@+id/button5"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignTop="@+id/button6"
    android:layout_alignBaseline="@+id/button6"
    android:layout_toLeftOf="@+id/button6"
    android:text="E" />
<Button
    android:id="@+id/button7"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBaseline="@+id/button6"
    android:layout_alignTop="@+id/button6"
    android:layout_toRightOf="@+id/button6"
    android:text="G" />
</RelativeLayout>