Raghav Sharma
Raghav Sharma

Reputation: 800

Recyclerview listitem layout gravity issue

This is the chat bot. Some messages are left aligned and some are right aligned. Left aligned messages are working fine but right aligned messages also get left aligned. This is the required listitem. layout_gravity to be on the right. But when added to the recycledview, the list item moves to the left as depicted in another photo. I don't know what could be the culprit. Is it constraint_layout or linearlayoutmanager or something else.

`<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
        xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="300dp"
        android:layout_height="wrap_content"
        android:padding="@dimen/paddingBig"
        android:background="@drawable/balloon_outgoing_normal"
        android:layout_gravity="right"
        app:layout_constraintRight_toRightOf="parent"
        android:layout_margin="8dp">

    <TextView
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            android:id="@+id/text"
            android:layout_width="0dp"
            android:paddingRight="@dimen/paddingSmall"
            android:layout_height="wrap_content"
            tools:text="Hello hello Hellomnhbhvbhbvhbhvbhvbhbvhbvhbvhbvhbhvbhvbhvbhvbhbvhbvhbv hello Hello hello Hello hello Hello hello"/>

    <TextView
            android:id="@+id/time"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:layout_constraintRight_toLeftOf="@id/status"
            app:layout_constraintBottom_toBottomOf="parent"
            android:layout_marginTop="8dp"
            app:layout_constraintTop_toBottomOf="@id/text"
            tools:text="21/04/2016, 2:30 P.M."/>

    <ImageView
            android:id="@+id/status"
            tools:visibility="visible"
            android:src="@drawable/baseline_schedule_black_18"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintBottom_toBottomOf="@id/time"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" tools:ignore="ContentDescription"/>
</androidx.constraintlayout.widget.ConstraintLayout>`

<code>enter image description here</code>

`<?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:id="@+id/chat_fragment_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:animateLayoutChanges="true">

    <ImageView
            android:id="@+id/sendMessage"
            android:layout_width="52dp"
            android:layout_height="52dp"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            android:background="?android:attr/selectableItemBackground"
            android:padding="@dimen/paddingMedium"
            android:src="@drawable/send_disable" tools:ignore="ContentDescription"/>

    <EditText
            android:id="@+id/input"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:hint="@string/type_message"
            app:layout_constraintRight_toLeftOf="@id/sendMessage"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            android:inputType="textCapSentences|textMultiLine"
            android:maxLines="2"
            android:padding="@dimen/paddingMedium" tools:ignore="Autofill"/>

    <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/recyclerView"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:paddingBottom="20dp"
            app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintBottom_toTopOf="@id/input"
            tools:listitem="@layout/me_message"
            app:layout_constraintTop_toTopOf="parent">
    </androidx.recyclerview.widget.RecyclerView>

    <ProgressBar
            android:id="@+id/progressBar"
            style="?android:attr/progressBarStyle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            tools:visibility="visible"
            android:visibility="gone"/>

</androidx.constraintlayout.widget.ConstraintLayout>`

I have tried many things. Actually earlier I have used relativelayout for the same and using alignParentBottom that is working but I am amazed why constraintlayout is not working.

Upvotes: 1

Views: 463

Answers (3)

sanoJ
sanoJ

Reputation: 3128

You need to use a nested constraintlayout to achieve that view. Also in in your recyclerview set the width to match_parent

android:layout_width="match_parent"
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <androidx.constraintlayout.widget.ConstraintLayout
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:layout_width="300dp"
        android:layout_height="wrap_content"
        android:padding="@dimen/paddingBig"
        android:background="@drawable/balloon_outgoing_normal"
        android:layout_margin="8dp">

        <TextView
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            android:id="@+id/text"
            android:layout_width="0dp"
            android:paddingRight="@dimen/paddingSmall"
            android:layout_height="wrap_content"
            tools:text="Hello hello Hellomnhbhvbhbvhbhvbhvbhbvhbvhbvhbvhbhvbhvbhvbhvbhbvhbvhbv hello Hello hello Hello hello Hello hello"/>

        <TextView
            android:id="@+id/time"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:layout_constraintRight_toLeftOf="@id/status"
            app:layout_constraintBottom_toBottomOf="parent"
            android:layout_marginTop="8dp"
            app:layout_constraintTop_toBottomOf="@id/text"
            tools:text="21/04/2016, 2:30 P.M."/>

        <ImageView
            android:id="@+id/status"
            tools:visibility="visible"
            android:src="@drawable/baseline_schedule_black_18"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintBottom_toBottomOf="@id/time"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" tools:ignore="ContentDescription"/>

    </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

enter image description here

Upvotes: 1

A.J
A.J

Reputation: 143

Try this

     <TextView
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:id="@+id/text"
        android:layout_width="match_parent"
        android:paddingRight="@dimen/paddingSmall"
        android:layout_height="wrap_content"
        tools:text="Hello hello Hellomnhbhvbhbvhbhvbhvbhbvhbvhbvhbvhbhvbhvbhvbhvbhbvhbvhbv hello Hello hello Hello hello Hello hello"/>

Upvotes: 0

Chrisvin Jem
Chrisvin Jem

Reputation: 4070

Set your RecyclerView's layout_width to match_parent and set right gravity for it. That should work.

Upvotes: 0

Related Questions