Android TextView autosizing takes more space than regular TextView - android

I have this simple piece of code where I want the TextView Contents to be resized. On initial impression, the Text inside the TextView has the content shrunk, which is great, but upon enabling layout bounds I see that TextView with AutoSizing actually is taking more space on the screen than a TextView that does not for the same content.
Here is my code:
<androidx.constraintlayout.widget.ConstraintLayout 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="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<TextView
android:id="#+id/tv_1"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:maxLines="3"
android:text="Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello"
app:autoSizeMaxTextSize="12sp"
app:autoSizeMinTextSize="4sp"
app:autoSizeTextType="uniform"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/tv_2"
app:layout_constraintHorizontal_chainStyle="spread"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/tv_2"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:maxLines="3"
android:ellipsize="end"
android:text="Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/tv_1"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Am I missing something? Any input will be greatly appreciated.

With Android 8.0 (API level 26) and higher, you can instruct a TextView to let the text size expand or contract automatically to fill its layout based on the TextView's characteristics and boundaries.
Default setting lets the autosizing of TextView scale uniformly on horizontal and vertical axes.
https://developer.android.com/guide/topics/ui/look-and-feel/autosizing-textview

Related

Put on the bottom elements in an App on Android Studio

I have an issue with my App on Android Studio.
I want to know how can I put on the bottom of my layout (in a fixed position) without ruining the structure on various smartphones. I'm using a Linear Layout and the elements to put at the bottom are :
Edit-text (comments area) + Button "Send comment" in the right of the Edit-Text. Thank you.
Ideal approach is to use a ConstraintLayout, because it will give you a lot of options to do that. Using a LinearLayout if the linear layout height is match parent. You can set the item property of gravity=bottom.
Sample Code of constraint layout
<androidx.constraintlayout.widget.ConstraintLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText
android:id="#+id/editText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="16dp"
android:background="#drawable/bg_input"
android:hint="Taper votre message"
android:padding="16dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/button"
app:layout_constraintStart_toStartOf="parent" />
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:background="#drawable/bg_button"
android:text="Send"
android:textColor="#android:color/white"
app:layout_constraintBottom_toBottomOf="#+id/editText"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="#+id/editText" />
</androidx.constraintlayout.widget.ConstraintLayout>
Maybe you can use a new Layout called ConstraintLayout. You have to put this new layout at the same level as your linear layout and it will not destroy your work.

Ellipsize not show three dots at end of TextView

I know there are many similar questions, and I have read many answers, but none of them are what I want. I have tried almost all of them. The following are my attempts (I set ellipsize=end for each attempt):
singleLine=true (works)
lines=1 (not work)
maxLines=1 (not work)
set width of textView to specific value (not work)
ScrollHorizontally=true (not work)
Only the first one works, but I want multiple lines of text instead of one line
Is there any other way to achieve this
Any help will be appreciated
Edit:
And here is my xml layout(in attempt 2):
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="#dimen/x150"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:ellipsize="end"
android:lines="1"
android:text="hello hello hello hello hello hello hello hello hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/image" />
</androidx.constraintlayout.widget.ConstraintLayout>
I used ellipsize=true in the project I developed before, and it worked well in that project, I compared the code of the current project with the previous one. There is no difference between each other, so I am confused with the current project, so I pulled the previous project from github and ran it, and found that it NOT WORK in my xml renderer, but it WORKS on my phone.
Eventually I found it is the problem of the renderer. I found the button to upgrade the renderer. Now I use the latest renderer, and it also works fine in the redener now.
This is working fine for me
<TextView
android:id="#+id/textView8"
android:layout_width="0dp"
app:layout_constraintEnd_toEndOf="parent"
android:ellipsize="end"
android:lines="3"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
android:text="TextVie mbdfdsvffmnsvfbnsddfdfvfndvfnbdvfbndsvfnsdvfnsdvfnsdvfnsbfjnbdsvjfvdsjhfvsdjhvsdsdvfjdvfjsdvfjhsdvfjsdvfjdhsvfhjdvfjdvfhjdvfjdsvfjsvfhjsdvfjsdvfjsdvfjsdvfjsdvfnsdfvbnsdvfbnsdvfnsdvfnsdbvfnbsdvnsdvsdvbfsdnbfw"
android:textSize="16dp" />
try adding maxLines with the lines count you want
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:ellipsize="end"
android:maxLines="4"
android:text="hello\n hello\n hello\n hello hello hello hello hello hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/image" />
Please note that the ellipsis will only be shown if the text size exceeds the number of lines allowed or the text size width; otherwise, it will not be shown.
If what you want is that at the end of the text the ellipsis is always shown, you must create a method which concatenates the (text + "...").
something like this:
TextView textView = findViewById(R.id.textView);
String valueText = textView.getText().toString();
if (!valueText.isEmpty()) valueText = String.format("%s...", valueText);
textView.setText(valueText);
The following example shows the ellipsis mentioned above, the first text exceeds the size of the text view and the second does not.
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="end"
android:maxLines="2"
android:text="hello hello hello hello hello hdsafsfdfdel sdsdasdsadasdsadsadasdasdsadsaadssadsadsadsadsasadsadsadsadsadsadsaadsalo hello hello hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh"
android:textColor="#android:color/black"
android:textSize="16sp"
app:layout_constrainedWidth="true"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/image" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="50dp"
android:ellipsize="end"
android:maxLines="2"
android:text="hello hello hello hello hello hel sfdsafsafsfasfsafsafsahhhhhhhhhhhhhh"
android:textColor="#android:color/black"
android:textSize="16sp"
app:layout_constrainedWidth="true"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView" />
Set property in java file
yourTextView.setEllipsize(TextUtils.TruncateAt.END);
yourTextView.setMaxLines(3);
yourTextView.setText("long text");

layout direction not working in ConstraintLayout

I want to use the same layout for Arabic and English using ConstraintLayout.
When I am using LinearLayout, the ImageView and TextView horizontally aligned, and changes the layoutdirection with respect to language. But when I am using constraintlayout the image view and TextView not aligning from 'right to left' in Arabic Language.
layout preview screenshots
preview in english
preview in arabic
desired output in Arabic
But I am not getting this when using ConstraintLayout
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/rootView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:background="#color/white"
android:orientation="vertical">
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher_2"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:text="#string/work_name"
app:layout_constraintBottom_toBottomOf="#+id/imageView"
app:layout_constraintStart_toEndOf="#+id/imageView"
app:layout_constraintTop_toTopOf="#+id/imageView" />
</androidx.constraintlayout.widget.ConstraintLayout>
Aligning text from right side for TextView
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:text="#string/work_name"
android:gravity="center|right"
app:layout_constraintBottom_toBottomOf="#+id/imageView"
app:layout_constraintStart_toEndOf="#+id/imageView"
app:layout_constraintTop_toTopOf="#+id/imageView" />
android:gravity="center|right"
set layout direction in coding
1)Find out TextViews id in onCreate()
2) follow below code
textview.setGravity(Gravity.CENTER|Gravity.RIGHT);
OR
textview.setGravity(Gravity.CENTER|Gravity.LEFT);
3) Apply as per your text.
I recommended you to use 2 Image view and 2 text view in constraint layout , when you want to show English text then hide Right side image and text and show Left side image and text for Arabic text make vise-versa.
Try it.
If you want to keep Arabic layout same like English layout for the whole project then add this line Manifest:
<application
android:supportsRtl="false"
I would suggest that you make a separated XML file for each right to left language.
noting that right to left languages short code like (-ar, -fa, -ps, -sd, -ur) , if you got more arabic to left codes, let us know.

What's happen about my ConstraintLayout why I am running?

everyone
I am a beginner. I tried to use ConstraintLayout with Android studio 3.1.1 and genymotion. when I run the project on genymotion emulator, It is different from what I have coded. Images FYI.
Each component needs to be constrained to be able to display correctly. I think you should do it. Because some TextView components seem to have no constraints
For Constrain Layout, You can to pull all point from the box of your TextView (for example)to top, bottom, left and right to remain it in the position. It could takes sometimes if have lots of button or textView or what so ever.
ConstrainLayout
sampleCode
<android.support.constraint.ConstraintLayout
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="match_parent"
android:layout_height="match_parent">
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:text="Button"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.32" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="16dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:text="TextView"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
You have to pull the line from the dot of the box to everyside so it could stay at the position.
Since you are a beginner, I think You can consider LinearLayout.
As LinearLayout, it is align those textView and button or anything inside in arrangement. As long as You it in vertical or horizontal.
Example
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
....
//Edit your layout
</LinearLayout>
Another good layout for beginner is RelativeLayout
RelativeLayout you can drag and drop the textView or button or what so ever to the layout.
Example
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
....
//Edit your layout
</RelativeLayout>
U have to keep edit and arrange until the design is what you like.
However, I believe there is a lot of tutorial You can learn from Youtube. Check it Out.

Android - Resize Text to fit inside a TextView

I'm trying to resize the wrapping text in a TextView to fit within its bounds.
I've created a new class with the source from here and I've added it inside my layout:
<com.util.AutoResizeTextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="10dp"
android:layout_alignLeft="#id/ivBulb"
android:layout_marginTop="5dp"
android:layout_marginBottom="80dp"
android:layout_below="#id/ivBulb"
android:layout_marginRight="10dp"
android:id="#+id/textP"
android:ellipsize="none"
android:fontFamily="sans-serif"
android:textColor="#000"
android:textSize="100sp"/> <!--maximum size -->
The text that should be displayed inside the TextView is something like:
The sunset filled the entire sky with the deep color of rubies, setting the clouds ablaze. The waves crashed and danced along the shore, moving up and down in a graceful and gentle rhythm like they were dancing.
Some texts can be a multiline but some don't.
My problem is that the text font size is small (about 35dp) and it's always the same :(
I've added a ScrollView in order to be able to display all the text but I want to keep just the TextView and the text to resize
I'm new in Android development so please be gentle.
use from android.support.v7.widget.AppCompatTextView
and set
android:ellipsize="none"
android:singleLine="true"
app:autoSizeMaxTextSize="14sp"
app:autoSizeMinTextSize="12sp"
app:autoSizeStepGranularity="0.5sp"
app:autoSizeTextType="uniform"
in
<android.support.v7.widget.AppCompatTextView
android:ellipsize="none"
android:singleLine="true"
app:autoSizeMaxTextSize="14sp"
app:autoSizeMinTextSize="12sp"
app:autoSizeStepGranularity="0.5sp"
app:autoSizeTextType="uniform"
android:layout_width="match_parent"
android:layout_height="wrap_content" android:id="#+id/txt_ortopedi"
android:textColor="#color/text_color"
android:padding="4dp" android:hint="#string/search"
android:gravity="clip_vertical|center_horizontal" android:layout_gravity="center"
android:background="#color/white"/>

Categories

Resources