Reputation: 55
Making an app looking like messaging with prefix texts of Frequently Asked Questions. The TextViews of on user's side (right/ purple) are not getting wrapped correctly, leaving a considerably big purple area on the right of the message.
Seems it calculates the width with different way of breaking lines as it finally does. Perhaps a problem with Greek fonts? In the 1st purple message, it's clear that small words should have stayed on the previous line.
The activity_main.xml looks like
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/purple_500"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:ignore="MissingConstraints">
<include layout="@layout/toolbar" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="30dp">
<include layout="@layout/page1"/>
<include layout="@layout/page2"/>
</LinearLayout>
</ScrollView>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Which includes the page_1.xml
<merge xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/page1"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="@+id/h1"
android:text="@string/p1h1"
style="@style/head"/>
<ProgressBar
android:id="@+id/pb1"
android:progress="1"
style="@style/ProgressBar"/>
<TextView
android:id="@+id/s1"
android:text="@string/p1s1"
style="@style/AppText"/>
<TextView
android:id="@+id/s2"
android:text="@string/p1s2"
style="@style/UserText"/>
<TextView
android:id="@+id/s3"
android:text="@string/p1s3"
style="@style/AppText"/>
<TextView
android:id="@+id/s4"
android:text="@string/p1s4"
style="@style/UserText"/>
</merge>
Text p1s2 & p1s4 are the ones i'm trying to fix, and their style is
<style name="UserText">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:padding">15dp</item>
<item name="android:background">@drawable/rounded_user</item>
<item name="android:layout_marginTop">10dp</item>
<item name="android:layout_marginBottom">10dp</item>
<item name="android:layout_marginLeft">50dp</item>
<item name="android:textSize">20sp</item>
</style>
I have tried to put TextViews inside ConstraintLayout, RelativeLayout and LinearLayout without success. Also, attributes that didn't help are:
android:singleLine="false"
android:width="0dip"
android:layout_weight="1"
android:singleLine="false"
android:ellipsize="end"
android:breakStrategy="simple"
Upvotes: 1
Views: 115
Reputation: 3393
In your LinearLayout
you have set padding. You will need to remove or reduce it and the purple area will get reduced, and change your layout_width
to match_constraint
.
<LinearLayout
android:layout_width="wrap_content" <!-- change this to match_constraint -->
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="30dp"> <!-- Remove or reduce this padding -->
Upvotes: 1