Row item of recycle view in Constraint layout collapse instead taking parent width

Question

Recently, I started using Constraint layout but today encountered very strange behaviour using it. When I am using RelativeLayout as root instead of ConstraintLayout in fragment_holiday.xml output is as expected but I want to know what is wrong with ConstraintLayout. My code is as follows for fragment,item_row

And I am getting output with constraint layout as(And on scrolling it is showing different beheviour as you can see in screenshot I am sharing) ---

fragment_holiday.xml

    <android.support.constraint.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="com.thepsi.psidashboard.Fragments.HolidayFragment">

    <com.thepsi.psidashboard.CustomViews.CustomDatePicker
        android:id="@+id/customDatePicker_holiday"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:dateFormat="MONTH_YEAR"/>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recycle_view_holiday"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/general_margin_eight_dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/customDatePicker_holiday" />
</android.support.constraint.ConstraintLayout>

item_holiday.xml

    <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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="wrap_content">

    <TextView
        android:id="@+id/textView25"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:text="24 - January - 2017"
        android:textColor="@color/colorPrimaryDark"
         />

    <TextView
        android:id="@+id/textView26"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:text="Saturday"
        android:layout_alignParentEnd="true"
        android:textColor="@color/colorPrimaryDark"
        />

    <TextView
        android:id="@+id/textView27"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/colorAccent"
        android:text="Mahavir Jayanti"
        android:textAlignment="center"
        android:textColor="@android:color/black"
        android:layout_below="@+id/textView25"
        />
</RelativeLayout>

Expected Design -

Can someone tell me what I am missing here?

Answer 1

Try this...

Change the width of recyclerview as matchparent

Yeah! as per the documentation the widget in ConstraintLayout doesn't support matchparent as width.

We have to assign the width as 0dp and use constraintStart_toStartOf="parent" and constraintEnd_toEndOf="parent" to reflect matchparent like you used.

But the solution I gave will work on some cases as you have.