I am trying to make a chat app, for this I need a sender chat bubble and receiver chat bubble. Since receiver chat bubble stays in left of the screen, it's not the problem. But the sender chat bubble needs to be in completely right to the screen. I used Relative Layout and used android:layout_alignParentEnd="true" but the problem is, it does take all of its contents right but the space is still there. The picture will clear most of it-
As you can see here, the space of the left is still there. So whenever I use this layout as the content of an itemview of a recyclerview, if I click to the invisible left place of the itemview/sender chat bubble, it works, but is shouldn't work because the chat bubble content is actually in the right. The question is how to take the whole layout in the right and use it as a chat bubble? I hope I made some sense. The full XML code is below-
<?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="wrap_content"
android:layout_height="wrap_content">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/cons"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_marginStart="5dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="7dp"
android:layout_marginEnd="2dp"
android:layout_marginRight="5dp"
android:background="@drawable/sender_design"
android:maxWidth="400dp"
android:maxHeight="330dp"
android:minWidth="100dp"
android:minHeight="50dp">
<TextView
android:id="@+id/msg2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_marginBottom="5dp"
android:inputType="textLongMessage|textMultiLine|textNoSuggestions"
android:maxWidth="330dp"
android:maxHeight="290dp"
android:text="Hello, I am Baymax."
android:textColor="@color/black"
app:layout_constraintBottom_toTopOf="@+id/sender_time"
app:layout_constraintEnd_toEndOf="@id/guideline_hori"
app:layout_constraintEnd_toStartOf="@+id/guideline_ver"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@+id/guideline_hori" />
<TextView
android:id="@+id/sender_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="3dp"
android:text="06:00AM"
android:textColor="@color/black"
android:textSize="10sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/guideline_ver" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline_ver"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_end="16dp" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline_hori"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_begin="5dp" />
</androidx.constraintlayout.widget.ConstraintLayout>
<ImageView
android:id="@+id/react1"
android:layout_width="18dp"
android:layout_height="18dp"
android:layout_alignLeft="@id/cons"
android:layout_alignBottom="@id/cons"
app:srcCompat="@drawable/ic_like" />
</RelativeLayout>
I did use other layouts like Linear Horizontal Layout but it still keeps the invisible left space which isn't supposed to be there. I am out of options here.
Set the click listener on the layout that contains the TextView. You may also need to set android:clickable="true"
for that layout.
Touch events bubble up from the underlying layout to the overlaid child views. The idea is to capture the click event before the child views see it.