RelativeLayout 中的第一个视图展开以填充剩余 space

First view in RelativeLayout expand to fill remaining space

我正在设计一个带有卡片视图、复选框和按钮的布局,其初始结构如第一张图片所示:

在这种情况下,直到用户单击卡片视图中的图像才会显示列表视图,因此当发生这种情况时,所需的结构就像 第二张图片

然而,由于列表视图实际上在一个片段内,我无法实现所需的布局,因为卡片视图的 wrap_content 和 match_parent 给了我下一个结果

如您所见,卡片视图与按钮重叠,复选框超出屏幕范围

现在这是我的布局:

<?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_width="match_parent"
            android:layout_height="match_parent"
            android:background="@android:color/white">

<android.support.v7.widget.CardView
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/card"
    android:layout_marginTop="5dp"
    android:layout_marginLeft="5dp"
    android:layout_marginRight="5dp"
    android:layout_alignParentTop="true"
    >

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="5dp"
        >


            <ImageButton
                android:layout_width="@dimen/event_invitation_expand_icon"
                android:layout_height="@dimen/event_invitation_expand_icon"
                android:id="@+id/shrink"
                android:src="@drawable/ic_shrink"
                android:background="@android:color/transparent"
                android:scaleType="fitCenter"
                android:layout_gravity="center_vertical"
                android:layout_marginRight="5dp"/>

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/shrink"
            android:layout_marginTop="5dp"
            android:id="@+id/list">

            <fragment
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:name="ListFragment"
                tools:layout="@layout/fragment_list"/>
        </RelativeLayout>

    </RelativeLayout>

</android.support.v7.widget.CardView>

<CheckBox
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/checkBox"
    android:layout_marginTop="20dp"
    android:layout_below="@+id/card"/>

<Space
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@+id/button"
    android:layout_below="@+id/checkBox"/>

<Button
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/button"
    android:layout_alignParentBottom="true"
    style="@android:style/Widget.DeviceDefault.Button.Borderless"
    />

我希望你能帮我设置当 space 被填充时卡片视图的最大高度停止增长。

我还尝试将复选框设置为始终位于底部的顶部,并将卡片视图设置为填充剩余的 space,虽然在展开列表视图时它为我提供了正确的结构,但它不起作用对于隐藏的列表,因为 cardview 没有填充 space。

更新

正如我所建议的那样,我尝试使用权重将根布局更改为 LinearLayout,但是,我得到了与以前相同的结果,如果我将 cardview 的权重更改为 1 并将复选框更改为 0,我能够得到扩展列表所需的布局,但不是隐藏案例的所需布局。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:tools="http://schemas.android.com/tools"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@android:color/white"
          android:orientation="vertical">



    <android.support.v7.widget.CardView
        xmlns:card_view="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/card"
        android:layout_marginTop="5dp"
        android:layout_marginLeft="5dp"
        android:layout_marginRight="5dp"
        android:layout_weight="0">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:padding="5dp"
            >



            <ImageButton
                android:layout_width="@dimen/event_invitation_expand_icon"
                android:layout_height="@dimen/event_invitation_expand_icon"
                android:id="@+id/shrink"
                android:src="@drawable/ic_shrink"
                android:background="@android:color/transparent"
                android:scaleType="fitCenter"
                android:layout_gravity="center_vertical"
                android:layout_marginRight="5dp"/>

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/shrink"
            android:layout_marginTop="5dp"
            android:id="@+id/list">

            <fragment
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:name="ListFragment"
                tools:layout="@layout/fragment_list"/>

        </RelativeLayout>

    </android.support.v7.widget.CardView>

<LinearLayout
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1">

    <CheckBox
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/check"
        android:id="@+id/check"
        android:layout_marginTop="20dp"
        android:layout_below="@+id/card"
        />

</LinearLayout>

<Button
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/button"
    android:textStyle="bold"
    android:textColor="@android:color/white"
    />

要完成您想要做的事情,最好使用垂直方向的 LinearLayout 作为根元素。这样做,您可以将 CardView 的权重设置为 1(并且 'height' 为 0dp,因为权重是如何工作的)而不给其他元素赋予权重,使其填充所有可用的 space 没有被其他两个元素占用。可以在此处找到执行此操作的方法: http://developer.android.com/guide/topics/ui/layout/linear.html#Weight

您需要使用 LinearLayout 并为孩子使用 Weight。 您可以在点击时更改所有视图权重。

但我认为您需要将 CheckBox 放在布局中并设置此布局权重。否则你会弄乱身高。
看起来不太接近您的布局,但您可能也需要为 CardView 这样做。
请记住这一点。

希望对您有所帮助