Constraint layout not matching parent in Nested scrollview

Question

Constraint layout not matching parent in Nestedscrollview and all in coordinate layout. So, i am including layout file in Coordinate layout . Below is the code and Image of Layout .

 <?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_marginTop="10dp"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clipToPadding="true"

   >
<androidx.core.widget.NestedScrollView
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    >


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

       <TextView
           android:id="@+id/delivery_tv_label"
           android:layout_width="0dp"
           android:layout_height="wrap_content"
           android:text="Delivery"
           android:textSize="14sp"
           android:textAlignment="center"
           app:layout_constraintTop_toTopOf="parent"
           app:layout_constraintLeft_toLeftOf="parent"
           app:layout_constraintRight_toLeftOf="@id/rating_tv_label"
           app:layout_constraintHorizontal_weight="5"
           />
        <TextView
            android:id="@+id/rating_tv_label"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:text="Overall Rating"
            android:textSize="14sp"
            android:textAlignment="center"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintLeft_toRightOf="@id/delivery_tv_label"
            app:layout_constraintHorizontal_weight="5"
            />
        <TextView
            android:id="@+id/delivery_tv"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:text="21 Mins"
            android:textSize="16sp"
            android:textColor="@android:color/black"
            android:textStyle="bold"
            android:textAlignment="center"
            android:layout_marginTop="5dp"
           app:layout_constraintTop_toBottomOf="@id/delivery_tv_label"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toLeftOf="@id/rating_tv_label"
            app:layout_constraintHorizontal_weight="5"
            />

        <LinearLayout
            android:id="@+id/linear_layout"
            android:orientation="horizontal"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:gravity="center"
            app:layout_constraintTop_toBottomOf="@id/rating_tv_label"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintLeft_toRightOf="@id/delivery_tv"
            android:layout_marginTop="5dp"
            >
            <TextView
                android:id="@+id/rating_tv"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="4.2"
                android:textSize="16sp"
                android:textColor="@android:color/black"
                android:textStyle="bold"
                android:textAlignment="center"

                />

            <ImageView
                android:id="@+id/star_img"
                android:src="@drawable/ic_baseline_star_24"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:layout_constraintRight_toRightOf="parent"
                android:layout_marginTop="2dp"

                />
        </LinearLayout>
        <TextView
            android:id="@+id/rets"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:text="@string/large_text"
            android:textSize="16sp"
            android:textColor="@android:color/black"
            android:textStyle="bold"
            android:textAlignment="center"
app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            />

        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/rv_item_title"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            app:layout_constraintTop_toBottomOf="@id/linear_layout"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"

            />

    </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

This layout is one of the child of CoordinatorLayout

Lalit Fauzdar · Accepted Answer · 2020-08-30T19:21:42.880

Edit : As someone has downvoted this, I don't know why, I'm going to elaborate more on why this is the solution.

The reason you need fillViewPort is you've a RecyclerView inside which means you want to fill the available space with it as you've also used 0dp. But, the problem is without fillViewPort, it won't behave like fill available space (0dp) and will work as wrap_content. So, the moment you set fillViewPort, it fills all the available space even with less content. Check these images for its working.

You can also check similar question here.

Remember ScrollView child's default height is wrap_content and hence its child layout ConstraintLayout is also taking wrap_content as the height as mentioned in below image. This is not necessary in case of NestedScrollView but its child still acts as wrap_content.

You just have to set android:fillViewport="true" in NestedScrollView as

<androidx.core.widget.NestedScrollView
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:fillViewport="true"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    >
    ...
</androidx.core.widget.NestedScrollView>

Setting fillViewPort will do the trick as it will act like match_parent or in your case, 0dp.

Constraint layout not matching parent in Nested scrollview

1 Answers1