Search code examples
androidandroid-scrollviewandroid-constraintlayout

Unable to scroll constraint layout inside scrollview


I'm trying to add constraint layout inside ScrollView but the layout is not scrolling What i have already tried:

-> Putting constraint layout inside nestedscrollview

-> Putting scrollview inside of another constraint layout and setting height = "0dp", constraintTop_toTopOf = "parent", constraintTop_toTopOf = "bottom"

-> Adding android:isScrollContainer="true"

Here is the code:

<ScrollView android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:fillViewport="true"
xmlns:android="http://schemas.android.com/apk/res/android">

    <android.support.constraint.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">


        <TextView
            android:id="@+id/tvItemName"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginEnd="24dp"
            android:layout_marginLeft="24dp"
            android:layout_marginRight="24dp"
            android:layout_marginStart="24dp"
            android:layout_marginTop="32dp"
            android:text="Large antique wardrobe"
            android:textColor="@color/black1"
            android:textSize="24sp"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:id="@+id/textView10"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="0dp"
            android:layout_marginStart="0dp"
            android:layout_marginTop="16dp"
            android:text="@string/transit_charge"
            android:textColor="@color/colorPrimary50"
            android:textSize="12sp"
            app:layout_constraintStart_toStartOf="@+id/tvItemName"
            app:layout_constraintTop_toBottomOf="@+id/tvItemName" />

        <TextView
            android:id="@+id/textView11"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="48dp"
            android:layout_marginTop="16dp"
            android:text="@string/required_by"
            android:textColor="@color/colorPrimary50"
            android:textSize="12sp"
            app:layout_constraintStart_toEndOf="@+id/textView10"
            app:layout_constraintTop_toBottomOf="@+id/tvItemName" />

        <TextView
            android:id="@+id/tvPrice"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/black"
            android:textSize="16sp"
            android:textStyle="bold"
            app:layout_constraintStart_toStartOf="@+id/textView10"
            app:layout_constraintTop_toBottomOf="@+id/textView10"
            tools:text="$20" />

        <TextView
            android:id="@+id/tvRequiredByDate"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/black"
            android:textSize="16sp"
            android:textStyle="bold"
            android:text="dsafsadfsfdsadfasdfsadfsadf"
            app:layout_constraintStart_toStartOf="@+id/textView11"
            app:layout_constraintTop_toBottomOf="@+id/textView11"
            tools:text="Fri · May 18" />

        <android.support.v7.widget.RecyclerView
            android:id="@+id/rvItemsImages"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginEnd="8dp"
            android:layout_marginTop="24dp"
            android:overScrollMode="never"
            app:layout_constraintEnd_toEndOf="@+id/tvItemName"
            app:layout_constraintHorizontal_bias="1.0"
            app:layout_constraintStart_toStartOf="@+id/tvPrice"
            app:layout_constraintTop_toBottomOf="@+id/tvPrice">

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

        <android.support.constraint.ConstraintLayout
            android:layout_width="336dp"
            android:layout_height="0dp"
            android:layout_marginBottom="8dp"
            android:layout_marginEnd="24dp"
            android:layout_marginStart="24dp"
            android:layout_marginTop="8dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.0"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/rvItemsImages">

            <ImageView
                android:id="@+id/imageView2"
                android:layout_width="8dp"
                android:layout_height="8dp"
                android:layout_marginTop="24dp"
                android:src="@drawable/shape_ring"
                android:tint="@color/pickup"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent" />

            <TextView
                android:id="@+id/textView19"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="24dp"
                android:layout_marginTop="8dp"
                android:text="@string/pickup_address"
                android:textColor="@color/colorPrimary50"
                android:textSize="12sp"
                app:layout_constraintStart_toEndOf="@+id/imageView2"
                app:layout_constraintTop_toTopOf="parent" />

            <TextView
                android:id="@+id/tvPickupAddress"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginEnd="8dp"
                android:text="TextView"
                android:textAllCaps="false"
                android:textColor="@color/black1"
                android:textSize="16sp"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="@+id/textView19"
                app:layout_constraintTop_toBottomOf="@+id/textView19" />

            <TextView
                android:id="@+id/tvPickupAdditionalInfo"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginEnd="8dp"
                android:text="TextView"
                android:textAllCaps="false"
                android:textColor="@color/black1"
                android:textSize="16sp"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintHorizontal_bias="0.0"
                app:layout_constraintStart_toStartOf="@+id/textView22"
                app:layout_constraintTop_toBottomOf="@+id/textView22" />

            <TextView
                android:id="@+id/textView22"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="16dp"
                android:text="@string/additional_info"
                android:textColor="@color/colorPrimary50"
                android:textSize="12sp"
                app:layout_constraintStart_toStartOf="@+id/tvPickupAddress"
                app:layout_constraintTop_toBottomOf="@+id/tvPickupAddress" />

            <TextView
                android:id="@+id/textView27"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="16dp"
                android:text="@string/additional_info"
                android:textColor="@color/colorPrimary50"
                android:textSize="12sp"
                app:layout_constraintStart_toStartOf="@+id/tvDropOffAddress"
                app:layout_constraintTop_toBottomOf="@+id/tvDropOffAddress" />

            <TextView
                android:id="@+id/tvDropOffAddress"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginEnd="8dp"
                android:text="TextView"
                android:textAllCaps="false"
                android:textColor="@color/black1"
                android:textSize="16sp"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintHorizontal_bias="0.0"
                app:layout_constraintStart_toStartOf="@+id/textView24"
                app:layout_constraintTop_toBottomOf="@+id/textView24" />

            <TextView
                android:id="@+id/tvDropOffAdditionalInfo"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginEnd="8dp"
                android:text="TextView"
                android:textAllCaps="false"
                android:textColor="@color/black1"
                android:textSize="16sp"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintHorizontal_bias="0.0"
                app:layout_constraintStart_toStartOf="@+id/textView27"
                app:layout_constraintTop_toBottomOf="@+id/textView27" />

            <TextView
                android:id="@+id/textView24"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="16dp"
                android:text="@string/drop_off_address"
                android:textColor="@color/colorPrimary50"
                android:textSize="12sp"
                app:layout_constraintStart_toStartOf="@+id/tvPickupAdditionalInfo"
                app:layout_constraintTop_toBottomOf="@+id/tvPickupAdditionalInfo" />

            <ImageView
                android:id="@+id/imageView7"
                android:layout_width="8dp"
                android:layout_height="8dp"
                android:layout_marginBottom="16dp"
                android:src="@drawable/shape_ring"
                android:tint="@color/drop_off"
                app:layout_constraintBottom_toBottomOf="@+id/tvDropOffAddress"
                app:layout_constraintStart_toStartOf="parent" />

            <com.capcorp.utils.DottedLine
                android:id="@+id/dottedLine"
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:layout_marginBottom="8dp"
                android:layout_marginTop="8dp"
                app:layout_constraintBottom_toTopOf="@+id/imageView7"
                app:layout_constraintEnd_toEndOf="@+id/imageView2"
                app:layout_constraintStart_toStartOf="@+id/imageView2"
                app:layout_constraintTop_toBottomOf="@+id/imageView2" />

            <TextView
                android:id="@+id/tvDesc"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginEnd="24dp"
                android:layout_marginTop="32dp"
                android:gravity="start"
                android:text="It's a large teakwood wardrobe. Handle with care. Approx. Dimensions are 2 ft. by 4 ft"
                android:textColor="@color/black1"
                android:textSize="12sp"
                app:layout_constraintEnd_toEndOf="@+id/tvDropOffAdditionalInfo"
                app:layout_constraintHorizontal_bias="0.0"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/tvDropOffAdditionalInfo" />
        </android.support.constraint.ConstraintLayout>


    </android.support.constraint.ConstraintLayout>
</ScrollView>
-->

I'm using this constraint layout of version:

implementation 'com.android.support.constraint:constraint-layout:1.1.0'

Please help!!!


Solution

  • What you are doing is put the second ConstraintLayout inside the outer ConstraintLayout, which don't make sense, and set its height to 0dp. This way ConstraintLayout will auto arrange this View to match the parent size and the content is never scrollable.

    Two things need to be fixed here:

    • Use 1 ConstraintLayout only for the root container. ConstraintLayout itself is already "heavy" enough to arrange your layout with tons of constraint.
    • don't use layout_height="0dp" for any View inside ConstraintLayout so the parent's height expands to wrap all the children's height