Android:布置一堆简单的盒子？

Question

这应该很容易，但对于我来说我无法弄清楚。我想制作一堆盒子，如图所示:

+------------------+
| +------o-------+ |
| |  Banner      | |
| +------o-------+ |
| | Buttons      | |
| |              | |
| +------o-------+ |
| |              | |
| |              | |
| | ViewFlipper  | |
| |              | |
| |              | |
| |              | |
| |              | |
| +------o-------+ |
| | Buttons      | |
| +------o-------+ |
| | Footer       | |
| +------o-------+ |
+------------------+

每个盒子——包括外面的盒子——代表一个包含其他小部件(甚至是一个单独的小部件)的布局。外盒与设备的宽度和高度相匹配。堆叠的宽度和高度必须与外部容器匹配。盒子的边缘彼此粘合，并粘合到容器的顶部和底部边缘，如“o”所示。所有的内部布局都紧紧包裹着它们的内容，除了最大的 - 一个 ViewFlipper - 它包含一个可滚动的列表框并且可以根据需要扩展或收缩。箱子的数量并不重要，只要是四个或更多即可。

ViewFlipper 包含许多 width/height=fillparent 的垂直 LinearLayout(我的理解是父级是 ViewFlipper)。

到目前为止，在我的尝试中，我在外部 RelativeLayout 和缝合内部框的边缘方面取得了一些成功:android:layout_below="@+id/former_box 和 android:layout_above="@+id/following_box，但这是一个不稳定的情况，盒子开始表现得很奇怪(例如第二个完全覆盖其他，等等)每次我改变设计(例如，通过插入另一个中间盒子)。请注意，这是一个设计时布局，不涉及花哨的动态运行时重新安排。

我现在正在试验 TableLayout(单列)，基本上没有值得报告的乐趣。我显然不是 Android 专家，但仍然是。执行此操作的最佳方法是什么？

编辑 - 插入实际代码由于省略实际代码似乎使问题变得模糊(我希望它能澄清它，我的错误)我在这里插入工作版本。您会注意到它缺少横幅和页脚。如上所述，每次我尝试插入额外的框时，它都会在我身上爆炸 - 经常出现循环引用。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_margin="0dip"        
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" 
        tools:context=".TomActivity" >

  <RelativeLayout
      android:id="@+id/spinnerbox"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:gravity="center_horizontal"
      android:onClick="left"
      android:layout_alignParentTop="true"
      android:layout_alignParentLeft="true"
      android:layout_alignParentRight="true"
      android:orientation="horizontal" >

    <Button
        android:id="@+id/leftarrow"
    android:background="#888888"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="left"
        android:minHeight="0dip"
        android:minWidth="0dip"
        android:layout_alignParentLeft="true"       
        android:onClick="left"
        android:text="Button" />

    <TextView
    android:id="@+id/spintitle"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_toRightOf="@+id/leftarrow"
    android:layout_toLeftOf="@+id/rightarrow"
    android:layout_centerInParent="true"
    android:layout_toEndOf="@+id/leftarrow"
    android:layout_toStartOf="@+id/rightarrow"
    android:gravity="center"
    android:text="Label" />

    <Button
    android:id="@+id/rightarrow"
    android:background="#888888"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:gravity="right"
    android:minHeight="0dip"
    android:minWidth="0dip"
    android:onClick="right"
    android:text="Button" 
    />

  </RelativeLayout>


  <ViewFlipper
      android:id="@+id/view_flipper"
      android:layout_margin="0dip"      
      android:layout_alignParentLeft="true"
      android:layout_alignParentRight="true"
      android:layout_below="@+id/spinnerbox"
      android:layout_above="@+id/buttonbox"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent">

    <LinearLayout
    android:layout_margin="0dip"        
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:gravity="center" >

      <ListView
      android:id="@+id/CoursesView"
      android:layout_margin="0dip"      
      android:background="#ffffff"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_weight="1" >
      </ListView>
    </LinearLayout>
    <LinearLayout
    android:layout_margin="0dip"        
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:gravity="center" >

      <ListView
      android:id="@+id/FutureCoursesView"
      android:layout_margin="0dip"
      android:background="#ffffff"      
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_weight="1" >
      </ListView>
    </LinearLayout>
    <LinearLayout
    android:layout_margin="0dip"        
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:gravity="center" >

      <ListView
      android:id="@+id/MessagesView"
      android:layout_margin="0dip"
      android:background="#ffffff"  
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_weight="1" >
      </ListView>
    </LinearLayout>     
  </ViewFlipper>

  <LinearLayout
      android:id="@+id/buttonbox"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_alignParentLeft="true"
      android:layout_alignParentRight="true"
      android:layout_alignParentBottom="true"
      android:orientation="horizontal"
      >

    <Button
    android:id="@+id/CurrentCoursesButton"
    android:background="#888888"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:text="Button" />

    <Button
    android:id="@+id/FutureCoursesButton"
    android:background="#888888"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:text="Button" />

    <Button
    android:id="@+id/UnreadMessagesButton"
    android:background="#888888"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:text="Button" />

    <Button
    android:id="@+id/RefreshButton"
    android:background="#888888"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:onClick="refreshAll"
    android:text="Button" />

    <Button
    android:id="@+id/LogoffButton"
    android:background="#888888"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:onClick="logOff"
    android:text="Button" />


  </LinearLayout>


</RelativeLayout>

干杯，

经过编辑以更清楚地显示布局并提供基本原理信息

Answer 1

构建复杂/多层布局时，首先准备最内层的布局。然后将你的外部布局迭代地包裹在最里面的布局周围。这样一来，使用哪个布局容器之类的决定就变得有点简单了。

查看以下内容是否与您要查找的内容相似:

我在这里发布了布局的 xml:Link(pastebin) Link(file)

我所做的是使用您提供的布局并将其放置在垂直方向的 LinearLayout 中。顶部和底部的“横幅”被赋予 layout_weight="0" 而内容区域(您提供的代码)的 layout_weight 设置为 1。因此，顶部和底部横幅占据固定的空间，内容占据剩余空间。