Android FlexboxLayout не может обрабатывать длинный текст и портит пользовательский интерфейс

Question

У меня есть следующие XML -

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

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@android:drawable/list_selector_background"
        android:clickable="true"
        android:focusable="true"
        android:orientation="horizontal"
        android:paddingTop="10dp"
        android:paddingBottom="10dp">

        <ImageView
            android:id="@+id/changed_activity_image"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_gravity="center"
            android:layout_marginStart="14dp"
            tools:src="@drawable/task_complete" />


        <com.google.android.flexbox.FlexboxLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="14dp"
            app:flexWrap="wrap">

            <TextView
                android:id="@+id/changed_activity_operation_title"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="@color/colorPrimary"
                android:textSize="18sp"
                tools:text="Task has been complete." />

            <TextView
                android:id="@+id/changed_activity_username"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="5dp"
                android:textSize="16sp"
                android:textStyle="bold"
                app:layout_wrapBefore="true"
                tools:text="You" />

            <TextView
                android:id="@+id/changed_activity_action"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="5dp"
                android:layout_marginTop="5dp"
                android:textSize="16sp"
                tools:text="completed" />

            <TextView
                android:id="@+id/changed_activity_task_name"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="5dp"
                android:layout_marginTop="5dp"
                android:textSize="16sp"
                android:textStyle="bold"
                tools:text="Buy 2 bottles of dish soap" />


            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="5dp"
                android:layout_marginTop="5dp"
                android:text="@string/activities_list_view_holder_in"
                android:textSize="16sp" />

            <TextView
                android:id="@+id/changed_activity_group_name"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="5dp"
                android:textSize="16sp"
                android:textStyle="bold"
                app:layout_wrapBefore="true"
                tools:text="Galipoly 38 Tel Aviv Apt." />

            <TextView
                android:id="@+id/changed_activity_date"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="5dp"
                android:textColor="@color/grey_text"
                android:textSize="16sp"
                app:layout_wrapBefore="true"
                tools:text="July 8, 19:15 2020" />

        </com.google.android.flexbox.FlexboxLayout>


    </LinearLayout>


</layout>

Проблема в том, что он работает с небольшими объемами текста:

which is the expected way

But when the task name is long, the following happen -

введите описание изображения здесь

Кажется, что при появлении длинного текста строка без причины прерывается

Как исправить эту проблему, чтобы текст продолжался в той же строке?

Answer 1

Думаю, вместо использования нескольких TextView внутри FlexboxLayout вы можете использовать один TextView и SpannableStringBuilder для стилизации TextView

Вот так

    val username = "Alon Shlider"
    val activity = "Buy a toilet paper and 2 bottle of dish"
    val place = "Galipoly 38 Apt"
    val updated = "Updated"
    val inside = "in"
    val text = "$username $updated $activity $inside $place"

    val spannableStringBuilder = SpannableStringBuilder(text)
    spannableStringBuilder.setSpan(
        StyleSpan(Typeface.BOLD),
        0,
        username.length,
        Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
    )
    spannableStringBuilder.setSpan(
        StyleSpan(Typeface.BOLD),
        username.length + updated.length + 2,
        username.length + updated.length + activity.length + 2,
        Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
    )

    spannableStringBuilder.setSpan(
        StyleSpan(Typeface.BOLD),
        username.length + updated.length + activity.length + inside.length + 4,
        username.length + updated.length + activity.length + inside.length + place.length + 4,
        Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
    )
    textView.setText(spannableStringBuilder, TextView.BufferType.SPANNABLE)