android - RecyclerView 在 ConstraintLayout 中将其下方按钮推出屏幕

Question

我正在尝试设置一个布局，其中“X”按钮固定在屏幕顶部，然后两个元素位于 View 的中心。一个回收站 View ，然后固定在回收站 View 下方的表单提交按钮。我目前使用的布局，直到回收器 View 超出其范围。然后提交按钮被推到 View 边界下方，回收器 View 不会留在布局内。如果回收器 View 变大，我如何才能使两个回收器 View 和按钮 View 居中，但又不让按钮超出 View 边界？

View With Small Recycler View 显示为(它应该居中。我的示例略有偏差。)

View 应该如何显示更大的 Recycler View(recycler View 的内容太大而不适合它滚动)

View 实际如何显示更大的回收器 View (回收器 View 确实滚动，但现在它将按钮推离 View 底部，显示为按钮被切断)

XML 布局的相关代码块

<LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="0.45"
        android:orientation="vertical"
        android:background="@color/backgroundLightSecondary"
        android:padding="20dp" >

        <Button
            android:id="@+id/bt_close"
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:layout_gravity="end"
            android:background="@drawable/ic_close"
            android:textColor="@color/textLightPrimary"  />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:orientation="vertical"
            android:layout_weight="1"
            android:gravity="center_vertical">

            <androidx.constraintlayout.widget.ConstraintLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical">

                <androidx.recyclerview.widget.RecyclerView
                    android:id="@+id/rv_item_options"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="parent" />

            </androidx.constraintlayout.widget.ConstraintLayout>

            <Button
                android:id="@+id/bt_order"
                android:layout_width="150dp"
                android:layout_height="50dp"
                android:layout_weight="0"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                android:background="@drawable/bt_rounded_corner"
                android:fontFamily="@font/microbrew_two"
                android:padding="3dp"
                android:text="@string/btn_add_to_order"
                android:textColor="@color/backgroundLightSecondary"
                android:textSize="20sp" />

        </LinearLayout>

    </LinearLayout>

Answer 1

在这种情况下，最好的方法是使用 ConstraintLayout 作为容器。正如您在问题中提到的，您想将 RecyclerView 放在中心。因此，它导致将其顶部和底部绑定(bind)到按钮。

另一方面，如果我们在 RecyclerView 和 submitButton 之间建立一个垂直链样式为 packed 的链，submitButton 会粘在 RecyclerView 的底部(其高度是 wrap_content 能够增长)并随着它的底部移动直到它到达底部屏幕(因为 app:layout_constraintBottom_toBottomOf="parent")。

关键是要为RecyclerView设置app:layout_constrainedHeight="true"导致两个按钮不重叠。

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="8dp" >

    <androidx.appcompat.widget.AppCompatImageButton
        android:id="@+id/closeImageButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_baseline_close_24"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constrainedHeight="true"
        app:layout_constraintBottom_toTopOf="@id/submitButton"
        app:layout_constraintTop_toBottomOf="@id/closeImageButton"
        app:layout_constraintVertical_chainStyle="packed" />

    <androidx.appcompat.widget.AppCompatButton
        android:id="@+id/submitButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Submit"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/recyclerView" />

</androidx.constraintlayout.widget.ConstraintLayout>

视觉结果: