How to make a layout flexible in android XML

Question

I have a horizontal arrangement of TextViews within a LinearLayout, and while the current layout works well on my device, I'm facing issues when the font size is increased, resulting in a messy appearance. Additionally, I'd like the layout to be flexible enough to handle small screens.

Below is the image when font size is normal- .

But suppose i increase font size of my phone it looks messy-

     <LinearLayout
        android:id="@+id/line2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="20dp"
        android:layout_marginEnd="20dp"
        android:padding="7dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/line1">

        <TextView
            android:id="@+id/coffee"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:layout_marginEnd="7dp"
            android:background="@drawable/selected_button_color"
            android:minHeight="34dp"
            android:gravity="center"
            android:text="Coffee"
            android:textAllCaps="false"
            android:textColor="@drawable/selected_text_color"
            android:textSize="13sp" />

        <TextView
            android:id="@+id/business"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginEnd="7dp"
            android:layout_weight="1"
            android:background="@drawable/selected_button_color"
            android:minHeight="34dp"
            android:gravity="center"
            android:text="Business"
            android:textAllCaps="false"
            android:textColor="@drawable/selected_text_color"
            android:textSize="13sp" />

        <TextView
            android:id="@+id/hobbies"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginEnd="7dp"
            android:layout_weight="1"
            android:background="@drawable/selected_button_color"
            android:minHeight="34dp"
            android:gravity="center"
            android:text="Hobbies"
            android:textAllCaps="false"
            android:textColor="@drawable/selected_text_color"
            android:textSize="13sp" />

        <TextView
            android:id="@+id/friendship"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content"
            android:background="@drawable/selected_button_color"
            android:minHeight="34dp"
            android:gravity="center"
            android:text="Friendship"
            android:textAllCaps="false"
            android:textColor="@drawable/selected_text_color"
            android:textSize="13sp" />
    </LinearLayout>

Is there a recommended approach or layout configuration to make the TextViews adapt to changes in font size and small screens? Ideally, I would like the TextViews to shift to the next line when necessary. Any insights or guidance on this matter would be greatly appreciated. Thank you!

Answer 1

• i notice you should make width of element wrap_content because 0dp is not suitable for LinearLayout but suitable for ConstraintLayout and put padding to save inner area
• or you can use external liberary like HashtagView