ScrollView与页面内容堆叠且背景重复问题技术求助

Hey Miguel, let's get to the bottom of why your ScrollView is showing duplicate content with its background. I checked your layout code and found a few critical issues that are causing this problem:

Key Problems in Your Layout #

• Invalid Constraint Attributes: You're using app:layout_constraintTop_toBottomOf and other ConstraintLayout-specific attributes on LinearLayouts inside your ScrollView. These attributes only work when the parent layout is a ConstraintLayout — since these LinearLayouts are nested inside another LinearLayout, those constraints do nothing. This breaks the vertical arrangement of your included layouts, leading to overlapping or duplicate-looking content.
• Unconstrained ScrollView: Your ScrollView has no layout constraints in the root ConstraintLayout. This means it starts rendering from the top of the screen, directly overlapping with the category_rv RecyclerView above it. The RecyclerView's background combined with the ScrollView's overlapping content creates the "duplicate display" effect you're seeing.
• Incorrect ScrollView Height: Setting android:layout_height="match_parent" without top constraints makes the ScrollView take up the entire screen, including the area occupied by the RecyclerView, worsening the overlap issue.

Fixed Layout Code #

Here's the corrected version of your layout with all issues addressed:

<?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"
    tools:context=".ui.home.HomeFragment">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/category_rv"
        android:layout_width="match_parent"
        android:background="@color/colorAccent"
        android:elevation="3dp"
        android:layout_height="wrap_content"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <!-- ScrollView now has proper constraints to sit below the RecyclerView -->
    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintTop_toBottomOf="@+id/category_rv"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent">

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

            <!-- Removed all invalid constraint attributes -->
            <LinearLayout
                android:id="@+id/LinearLayout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <include layout="@layout/horizontal_scroll_layout" />
            </LinearLayout>

            <LinearLayout
                android:id="@+id/LinearLayout1"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <include layout="@layout/sliding_ad_layout" />
            </LinearLayout>

            <LinearLayout
                android:id="@+id/LinearLayout2"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <include layout="@layout/grid_product_layout" />
            </LinearLayout>

        </LinearLayout>

    </ScrollView>

</androidx.constraintlayout.widget.ConstraintLayout>

What Changed? #

1. ScrollView Constraints: Added app:layout_constraintTop_toBottomOf="@+id/category_rv" and set height to 0dp (match_constraint) so it fills the space below the RecyclerView to the bottom of the screen.
2. Removed Invalid Constraints: Deleted all app:layout_constraintXXX attributes from LinearLayouts inside the ScrollView — since their parent is a vertical LinearLayout, they'll automatically stack vertically without constraints.
3. Fixed ScrollView Height: Using 0dp instead of match_parent ensures the ScrollView doesn't overlap with the RecyclerView.

After applying these changes, your ScrollView will render correctly below the RecyclerView, and its content will arrange properly without any duplicate display issues.

内容的提问来源于stack exchange，提问作者Miguel