CODEWITHSUNDEEP
androidandroid-recyclerviewandroid-constraintlayout
pallav bohara
pallav bohara

Reputation: 6769

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

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) --- enter image description here

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 -

enter image description here

Can someone tell me what I am missing here?

Upvotes: 5

Views: 1805

Answers (4)

Pei
Pei

Reputation: 11643

I've had a similar issue with height and vertical constraints in a recycler view and finally ended up using new support library version 27.0.2 and constraint-layout version 1.1.0-beta4 to get expected behavior. Recommend everyone to bump to those versions if having some weird behaviors in constraint layouts.

Upvotes: 0

Arnold Brown
Arnold Brown

Reputation: 1433

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.

Upvotes: 11

Mehul Kabaria
Mehul Kabaria

Reputation: 6622

Try following.

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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="wrap_content">

    <TextView
        android:id="@+id/textView25"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="24 - January - 2017"
        android:textColor="@color/colorPrimaryDark"
        app:layout_constraintEnd_toStartOf="@+id/textView26"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/textView26"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:gravity="right"
        android:text="Saturday"
        android:textColor="@color/colorPrimaryDark"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintLeft_toRightOf="@+id/textView25"
        app:layout_constraintTop_toTopOf="@+id/textView25" />

    <TextView
        android:id="@+id/textView27"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:background="@color/colorAccent"
        android:text="Mahavir Jayanti"
        android:textAlignment="center"
        android:textColor="@android:color/black"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView25" />
</android.support.constraint.ConstraintLayout>

Upvotes: 0

rahul ramakrishnan
rahul ramakrishnan

Reputation: 59

Try to to update the item_holiday.xml like the below xml. I just added three labels and added their constraint properties. You will need to edit the label propertied as per your requirement.

<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="wrap_content">


    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="30dp"
        android:layout_marginEnd="88dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="32dp"
        android:text="TextView"
        app:layout_constraintEnd_toStartOf="@+id/textView2"
        app:layout_constraintHorizontal_bias="0.888"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="30dp"
        android:layout_marginEnd="88dp"
        android:layout_marginTop="32dp"
        android:text="TextView"
        app:layout_constraintEnd_toStartOf="@+id/textView3"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="30dp"
        android:layout_marginEnd="16dp"
        android:layout_marginTop="32dp"
        android:text="TextView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>

Upvotes: 0

Related Questions