Search code examples
androidlistviewlayout

Android text breaking with buttons to the right


I have a list view with each list item being designed in a RelativeLayout. Within each relative layout I have three buttons and two text views. Everything should be in one row. The first text view is supposed to be left aligned, while the buttons are in one horizontal row aligned to the end of the parent, with the second text view being directly before them. My problem is, that very long text in the primary text view overlaps with the buttons and the second text view. The text does break into a second line if long enough, but I'd like it to break.

For now I have achieved the list to look like this. Sadly the text does not break before the buttons/associated text, but only at the end of the parent.

Previously I had a layout_marginEnd of 160dp, which worked fine on my personal phone, but since then I have received bug reports from users with other phones that own another brand.

My code looks as follows:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <TextView
        android:id="@+id/nameTextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_marginStart="10dp"
        android:layout_marginTop="12dp"
        android:layout_marginBottom="12dp"
        android:textIsSelectable="false"
        android:textSize="@dimen/listItemTextSize"
        tools:ignore="UnusedIds" />

    <LinearLayout
        android:id="@+id/buttonLayout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        tools:ignore="RelativeOverlap,UnusedIds">

        <TextView
            android:id="@+id/amountTextView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:layout_marginEnd="8dp"
            android:textIsSelectable="false"
            android:textSize="@dimen/listItemTextSize" />

        <ImageButton
            android:id="@+id/subtractButton"
            style="@style/Theme.ShoppingList.ImageButton"
            android:background="@drawable/ic_minus"
            android:contentDescription="@string/mainSubtractButtonDescription" />

        <ImageButton
            android:id="@+id/addButton"
            style="@style/Theme.ShoppingList.ImageButton"
            android:background="@drawable/ic_plus"
            android:contentDescription="@string/mainAddButtonDescription" />

        <ImageButton
            android:id="@+id/deleteButton"
            style="@style/Theme.ShoppingList.ImageButton"
            android:background="@drawable/ic_trash"
            android:contentDescription="@string/mainDeleteButtonDescription" />
    </LinearLayout>
</RelativeLayout>

Thank you in advance for your help!


Solution

  • Add android:layout_alignParentStart="true" and android:layout_toStartOf="@id/buttonLayout" to the nameTextLayout.

    This will break nameTextView before LinearLayout and keep nameTextView's text left aligned.