浮动TextView和TableLayout

Question

我想设计这样的东西：

[TableLayout 1 Title] TextView1

[TableLayout 1]

[TableLayout 2 Title] TextView2

[TableLayout 2]

与CSS一样，我们只使用： Float：left ，将宽度设置为100％，一切都很好。

所以这是我的布局XML代码：

<RelativeLayout 
    android:layout_width="match_parent"
    android:background="#e9e9e9"
    android:layout_height="match_parent" >


    <TextView
        android:id="@+id/TextView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:text="Visitors per Category"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textColor="#324A61"
        android:layout_marginLeft="7dp"
        android:layout_marginTop="25dp"
        android:textStyle="bold" />

    <TableLayout
        android:id="@+id/TableLayout1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_marginTop="50dp"
        android:layout_marginBottom="10dp"
        android:layout_marginLeft="7dp"
        android:layout_marginRight="7dp"
        android:stretchColumns="2"
        android:background="@drawable/shape" >

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="15dp" >

            // Some EditText etc...

        </TableRow>

        //   Separator border
        <View   
            android:id="@+id/firstDivider"
            android:layout_height="2dp"
            android:layout_width="fill_parent"
            android:background="#666" />

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="15dp" >

            // Some textviews etc...

        </TableRow>
    </TableLayout>

    <TextView
        android:id="@+id/EditText2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_marginBottom="60dp"
        android:text="Scans per Gate"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textColor="#324A61"
        android:textStyle="bold" />

    <TableLayout
        android:id="@+id/TableLayout2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_marginTop="205dp"
        android:layout_marginBottom="10dp"
        android:layout_marginLeft="7dp"
        android:layout_marginRight="7dp"
        android:stretchColumns="2"
        android:background="@drawable/shape" >

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="15dp" >

            // some textviews etc...

        </TableRow>

        <View
            android:id="@+id/firstDivider"
            android:layout_width="fill_parent"
            android:layout_height="2dp"
            android:background="#666" />

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="15dp" >

            // Some textViews
        </TableRow>
    </TableLayout>

</RelativeLayout>

代码中的所有内容对我来说都很合适，但从图形上看，我有类似的内容：

TextView2

TextView1

TableLayout2

顶部的

TableLayout1

你对此有什么想法吗？

谢谢。

Answer 1

尝试使用垂直方向的线性布局

 <LinearLayout 
    android:layout_width="match_parent"
    android:background="#e9e9e9"
    android:layout_height="match_parent"
    android:orientation="vertical" >


    <TextView
        android:id="@+id/TextView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:text="Visitors per Category"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textColor="#324A61"
        android:layout_marginLeft="7dp"
        android:layout_marginTop="25dp"
        android:textStyle="bold" />

    <TableLayout
        android:id="@+id/TableLayout1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="left"
        android:layout_marginTop="50dp"
        android:layout_marginBottom="10dp"
        android:layout_marginLeft="7dp"
        android:layout_marginRight="7dp"
        android:stretchColumns="2"
        android:background="@drawable/shape" >

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="15dp" >

            // Some EditText etc...

        </TableRow>

        //   Separator border
        <View   
            android:id="@+id/firstDivider"
            android:layout_height="2dp"
            android:layout_width="fill_parent"
            android:background="#666" />

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="15dp" >

            // Some textviews etc...

        </TableRow>
    </TableLayout>

    <TextView
        android:id="@+id/EditText2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="left"
        android:layout_marginBottom="60dp"
        android:text="Scans per Gate"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textColor="#324A61"
        android:textStyle="bold" />

    <TableLayout
        android:id="@+id/TableLayout2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="left"

        android:layout_marginBottom="10dp"
        android:layout_marginLeft="7dp"
        android:layout_marginRight="7dp"
        android:stretchColumns="2"
        android:background="@drawable/shape" >

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="15dp" >



        </TableRow>

        <View
            android:id="@+id/firstDivider"
            android:layout_width="fill_parent"
            android:layout_height="2dp"
            android:background="#666" />

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="15dp" >


        </TableRow>
    </TableLayout>

</LinearLayout>

这应该有效