View被带有ConstrainLayout的NestedScrollView中的另一个视图覆盖

Question

我有以下布局：

<?xml version="1.0" encoding="utf-8"?>
<androidx.core.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fillViewport="true">

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

        <LinearLayout
            android:id="@+id/content_ll"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="@dimen/margin_32"
            android:orientation="vertical"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent">

            <androidx.cardview.widget.CardView
                android:id="@+id/online_card_cv"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginHorizontal="@dimen/margin_16"
                android:layout_marginTop="@dimen/margin_25"
                android:background="@color/white"
                app:cardCornerRadius="@dimen/margin_8">

                <androidx.constraintlayout.widget.ConstraintLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginVertical="@dimen/margin_8">

                    <androidx.appcompat.widget.AppCompatRadioButton
                        android:id="@+id/online_card_rb"
                        android:layout_width="@dimen/margin_22"
                        android:layout_height="@dimen/margin_22"
                        android:layout_marginStart="@dimen/margin_16"
                        app:layout_constraintBottom_toBottomOf="@id/online_card_ll"
                        app:layout_constraintEnd_toStartOf="@id/online_card_ll"
                        app:layout_constraintStart_toStartOf="parent"
                        app:layout_constraintTop_toTopOf="@id/online_card_ll" />

                    <LinearLayout
                        android:id="@+id/online_card_ll"
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_marginStart="@dimen/margin_16"
                        android:background="@color/white"
                        android:gravity="start"
                        android:orientation="vertical"
                        android:paddingVertical="@dimen/padding_16"
                        app:layout_constraintEnd_toStartOf="@id/cards_iv"
                        app:layout_constraintStart_toEndOf="@id/online_card_rb"
                        app:layout_constraintTop_toTopOf="parent">

                        <androidx.appcompat.widget.AppCompatTextView
                            android:id="@+id/online_card_tv"
                            style="@style/OnlineCardTitleTextStyle"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="@string/online_card_title"
                            app:lineHeight="@dimen/default_text_size_28" />

                        <androidx.appcompat.widget.AppCompatTextView
                            style="@style/OnlineCardSubTitleTextStyle"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="@string/online_card_now" />

                    </LinearLayout>

                    <androidx.appcompat.widget.AppCompatImageView
                        android:id="@+id/cards_iv"
                        android:layout_width="@dimen/margin_80"
                        android:layout_height="@dimen/margin_20"
                        android:layout_marginEnd="@dimen/margin_16"
                        android:src="@drawable/ic_visa_master"
                        app:layout_constraintBottom_toBottomOf="@id/online_card_ll"
                        app:layout_constraintEnd_toEndOf="parent"
                        app:layout_constraintTop_toTopOf="@id/online_card_ll" />

                    <androidx.constraintlayout.widget.ConstraintLayout
                        android:id="@+id/online_card_expanded_info_cl"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:visibility="gone"
                        app:layout_constraintTop_toBottomOf="@id/online_card_ll">

                        <View
                            android:id="@+id/online_card_divider"
                            style="@style/ViewDividerStyle"
                            android:layout_width="match_parent"
                            android:layout_height="1dp"
                            android:layout_marginTop="@dimen/margin_16"
                            app:layout_constraintTop_toTopOf="parent" />

                        <androidx.recyclerview.widget.RecyclerView
                            android:id="@+id/cards_list"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            app:layout_constraintTop_toBottomOf="@id/online_card_divider" />

                        <View
                            android:id="@+id/cards_list_divider"
                            style="@style/ViewDividerStyle"
                            android:layout_width="match_parent"
                            android:layout_height="1dp"
                            app:layout_constraintTop_toBottomOf="@id/cards_list" />

                        <TextView
                            android:id="@+id/read_more_tv"
                            style="@style/OnlineCardReadMoreTextStyle"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginStart="@dimen/margin_16"
                            android:layout_marginTop="@dimen/margin_16"
                            android:layout_marginBottom="@dimen/margin_8"
                            android:text="@string/read_more"
                            android:visibility="visible"
                            app:layout_constraintBottom_toBottomOf="parent"
                            app:layout_constraintStart_toStartOf="parent"
                            app:layout_constraintTop_toBottomOf="@id/cards_list_divider" />

                        <LinearLayout
                            android:id="@+id/additional_info_ll"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:layout_marginStart="@dimen/margin_21"
                            android:layout_marginTop="@dimen/margin_16"
                            android:layout_marginEnd="@dimen/margin_10"
                            android:layout_marginBottom="@dimen/margin_8"
                            android:orientation="vertical"
                            android:visibility="gone"
                            app:layout_constraintBottom_toBottomOf="parent"
                            app:layout_constraintStart_toStartOf="parent"
                            app:layout_constraintTop_toBottomOf="@id/cards_list_divider">

                            <TextView
                                android:id="@+id/online_card_less_info_tv"
                                style="@style/OnlineCardReadMoreTextStyle"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:text="@string/online_card_less_info" />

                            <TextView
                                android:id="@+id/check_card_type_title_tv"
                                style="@style/OnlineCardBottomTitleTextStyle"
                                android:layout_width="match_parent"
                                android:layout_height="wrap_content"
                                android:layout_marginTop="@dimen/margin_4"
                                android:text="@string/online_check_card" />

                            <TextView
                                android:id="@+id/check_card_type_info_tv"
                                style="@style/OnlineCardBottomDescriptionTextStyle"
                                android:layout_width="match_parent"
                                android:layout_height="wrap_content"
                                android:layout_marginStart="@dimen/margin_8"
                                android:layout_marginTop="@dimen/margin_4"
                                android:text="@string/online_check_card_info" />

                            <TextView
                                android:id="@+id/online_card_data_title_tv"
                                style="@style/OnlineCardBottomTitleTextStyle"
                                android:layout_width="match_parent"
                                android:layout_height="wrap_content"
                                android:layout_marginTop="@dimen/margin_4"
                                android:text="@string/online_card_data" />

                            <TextView
                                android:id="@+id/online_card_data_info_tv"
                                style="@style/OnlineCardBottomDescriptionTextStyle"
                                android:layout_width="match_parent"
                                android:layout_height="wrap_content"
                                android:layout_marginStart="@dimen/margin_8"
                                android:layout_marginTop="@dimen/margin_4"
                                android:text="@string/online_card_data_info" />

                            <TextView
                                android:id="@+id/online_card_confirmation_title_tv"
                                style="@style/OnlineCardBottomTitleTextStyle"
                                android:layout_width="match_parent"
                                android:layout_height="wrap_content"
                                android:layout_marginTop="@dimen/margin_4"
                                android:text="@string/online_card_confirmation" />

                            <TextView
                                android:id="@+id/online_card_confirmation_info_tv"
                                style="@style/OnlineCardBottomDescriptionTextStyle"
                                android:layout_width="match_parent"
                                android:layout_height="wrap_content"
                                android:layout_marginStart="@dimen/margin_8"
                                android:layout_marginTop="@dimen/margin_4"
                                android:text="@string/online_card_confirmation_info" />

                        </LinearLayout>

                    </androidx.constraintlayout.widget.ConstraintLayout>

                </androidx.constraintlayout.widget.ConstraintLayout>

            </androidx.cardview.widget.CardView>

            <androidx.cardview.widget.CardView
                android:id="@+id/bank_account_cv"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginHorizontal="@dimen/margin_16"
                android:layout_marginTop="25dp"
                android:background="@color/white"
                app:cardCornerRadius="@dimen/margin_8">

                <androidx.constraintlayout.widget.ConstraintLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_marginVertical="@dimen/margin_24">

                    <androidx.appcompat.widget.AppCompatRadioButton
                        android:id="@+id/bank_account_rb"
                        android:layout_width="@dimen/margin_22"
                        android:layout_height="@dimen/margin_22"
                        android:layout_marginStart="@dimen/margin_16"
                        app:layout_constraintBottom_toBottomOf="@id/bank_account_tv"
                        app:layout_constraintStart_toStartOf="parent"
                        app:layout_constraintTop_toTopOf="@id/bank_account_tv" />

                    <androidx.appcompat.widget.AppCompatTextView
                        android:id="@+id/bank_account_tv"
                        style="@style/OnlineCardTitleTextStyle"
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_marginStart="@dimen/margin_14"
                        android:text="@string/title_on_bank"
                        android:textAlignment="textStart"
                        app:layout_constraintEnd_toEndOf="parent"
                        app:layout_constraintStart_toEndOf="@id/bank_account_rb"
                        app:layout_constraintTop_toTopOf="parent" />

                    <View
                        android:id="@+id/bank_account_divider"
                        android:layout_width="match_parent"
                        android:layout_height="1dp"
                        android:layout_marginTop="@dimen/margin_16"
                        android:alpha="0.5"
                        android:background="#000001"
                        app:layout_constraintTop_toBottomOf="@id/bank_account_tv" />

                    <androidx.appcompat.widget.AppCompatTextView
                        android:id="@+id/iban_hint_tv"
                        style="@style/OnlineCardEditTextHintTextStyle"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginStart="@dimen/margin_16"
                        android:layout_marginTop="15dp"
                        android:text="@string/step7_iban_hint"
                        app:layout_constraintStart_toStartOf="parent"
                        app:layout_constraintTop_toBottomOf="@id/bank_account_divider" />

                    <androidx.appcompat.widget.AppCompatEditText
                        android:id="@+id/step1_phone"
                        android:layout_width="match_parent"
                        android:layout_height="@dimen/height_edittext"
                        android:layout_marginHorizontal="@dimen/margin_16"
                        android:layout_marginTop="@dimen/margin_2"
                        android:background="@drawable/rounded_edittext_with_border"
                        android:maxLines="1"
                        app:layout_constraintTop_toBottomOf="@id/iban_hint_tv" />

                    <androidx.constraintlayout.widget.Group
                        android:id="@+id/group"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:visibility="gone"
                        app:constraint_referenced_ids="step1_phone, iban_hint_tv, bank_account_divider" />

                </androidx.constraintlayout.widget.ConstraintLayout>

            </androidx.cardview.widget.CardView>

        </LinearLayout>

        <androidx.appcompat.widget.AppCompatButton
            android:id="@+id/step7_next_btn"
            android:layout_width="@dimen/width_button_next"
            android:layout_height="@dimen/height_button_next"
            android:layout_marginBottom="@dimen/margin_10"
            android:background="@drawable/rounded_button_next"
            android:text="@string/next"
            android:textColor="@color/button_text_green"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent" />

    </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.core.widget.NestedScrollView>

当视图的一部分可见后，我的屏幕如下所示：

如您所见，按钮位于底部，并且没有任何其他视图重叠。但是当卡展开时，它看起来像这样：

如您所见，现在按钮与另一张卡片重叠，我需要将按钮放在卡片下方。因此，如何防止现有行为并将按钮放置在底部的所有卡下？预先感谢，我将不胜感激！

Answer 1

请参阅下面的最新答案。

Old

我看不到ConstraintLayout的目的。您可以删除它，并将按钮放置在LinearLayout中作为最后一项。 XML将如下所示：

NestedScrollingView
    LinearLayout
        CardView ...
        CardView ...
        AppCompatButton

您也可以使用ConstraintLayout而不是LinearLayout，但我认为两者都不需要。

这会带来一个问题：当内容未填满屏幕时，按钮不在底部。为了轻松解决，可以将ConstraintLayout与适当的约束一起使用。

[New] >>

我建议您使用ConstraintLayout。有了它，您可以实现平面布局层次结构。您可以这样使用链条和垂直偏差：

• 将第一张卡片绑在父母的顶端
• 将按钮绑定到父母的底部
• 将第二张卡绑在第一张卡的底部和按钮的顶部。施加0.0的垂直偏差。

结果：

以及示例的简单代码：

<?xml version="1.0" encoding="utf-8"?>
<androidx.core.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#dddddd"
    android:fillViewport="true">

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

        <androidx.cardview.widget.CardView
            android:id="@+id/card1"
            android:layout_width="0dp"
            android:layout_height="200dp"
            android:layout_margin="16dp"
            app:cardCornerRadius="8dp"
            app:cardElevation="8dp"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="First card" />

        </androidx.cardview.widget.CardView>

        <androidx.cardview.widget.CardView
            android:id="@+id/card2"
            android:layout_width="0dp"
            android:layout_height="800dp"
            android:layout_margin="16dp"
            app:cardCornerRadius="8dp"
            app:cardElevation="8dp"
            app:layout_constraintBottom_toTopOf="@id/button"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@id/card1"
            app:layout_constraintVertical_bias="0.0">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="Second card" />

        </androidx.cardview.widget.CardView>

        <androidx.appcompat.widget.AppCompatButton
            android:id="@+id/button"
            android:layout_width="0dp"
            android:layout_height="64dp"
            android:layout_marginBottom="16dp"
            android:background="#ffffff"
            android:text="Button text"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintWidth_percent="0.5" />

    </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.core.widget.NestedScrollView>