Android - Resize Text to fit inside a TextView - android

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"/>

Related

How to distribute spaces between text views of linear layout to fit according to different text lengths

In the Image attached below, the red box represents the linear layout.
In each linear layout I have 2 children text views to display details. Text on the text views are getting filled from JSON data fetched from google books api.
What I am finding difficult is how to maintain space between both the text views according to different text length.
Like in the 5th list item "Fundamental Of Java..." can be extended more as there is many space left.
In the 1st item item Both Title and Author name is really long so both should be displayed equally (50-50)%
And in the 3rd list item "Pearson Education..." can be extended more as there is more blank space before it.
So How to can determine/Distribute space in layout which fits each situations.
Code Of Linear Layout:
<LinearLayout
android:id="#+id/header_ll"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:layout_toRightOf="#+id/image">
<TextView
android:id="#+id/title"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginLeft="8dp"
android:layout_weight="2.5"
android:ellipsize="end"
android:maxLines="1"
android:text="Java Programming is really long text right not"
android:textColor="#ffffff"
android:textSize="16sp"></TextView>
<TextView
android:id="#+id/publisher"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_weight="1"
android:ellipsize="end"
android:gravity="end"
android:maxLines="1"
android:text="John Wiley and its going long & Sons"
android:textColor="#ffffff"
android:textSize="10sp"></TextView>
</LinearLayout>
Try experimenting using RelativeLayout on your xml but you have to give priority on which textView that will consume most of the space - either of the two ( title or the publisher) then add a autoSizeTextType on your textView.
You can also use ConstraintLayout but you have to limit the number of items to be displayed in your recyclerview, or create a function that detects if the particular string consist of "n" characters long then adjust a padding or margin.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorAccent">
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_toLeftOf="#+id/publisher"
android:autoSizeTextType="uniform"
android:ellipsize="end"
android:maxLines="1"
android:text="Java Programming is really long text right not Java"
android:textColor="#ffffff"
android:textSize="16sp" />
<TextView
android:id="#+id/publisher"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:autoSizeTextType="uniform"
android:ellipsize="end"
android:gravity="end"
android:maxLines="1"
android:text="John Wiley & Sons sdafsdfsfsdf"
android:textColor="#ffffff"
android:textSize="16sp" />
</RelativeLayout>

Textview width doens't adjust after change content

I'm trying to update the content of a TextView with the data introduced by an EditText. But after change the text, if the original text (hint) was bigger than the new text, the width doens't change.
I have the next string in the Hint Attribute of the TextView, "Please, introduce a amount". If I put 25'5, for example, the textview doesn't resize it width.
First Screen
Second Screen
The Euro symbol is invisible behind the textview, and It's shown after insert some value.
The piece of code for the Amount:
<RelativeLayout
android:id="#+id/rlImporte"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/rel_layout_colors"
android:clickable="true"
android:paddingTop="8dp"
android:paddingBottom="8dp">
<ImageView
android:id="#+id/lst_img3"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_margin="5sp"
android:layout_marginTop="5dp"
android:src="#drawable/icon_importe"/>
<TextView
android:id="#+id/tvImporte"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="false"
android:layout_marginTop="5dp"
android:layout_toRightOf="#+id/lst_img3"
android:text="#string/IMPORTE_TITLE_STRING"
android:textColor="#android:color/black"
android:textSize="#dimen/title_text_size" />
<TextView
android:id="#+id/tvImporteDesc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tvImporte"
android:layout_toRightOf="#+id/lst_img3"
android:textColor="#android:color/darker_gray"
android:textSize="#dimen/subtitle_text_size"
android:visibility="visible"
android:hint="#string/IMPORTE_PLACEHOLDER_STRING"
android:textColorHint="#android:color/darker_gray"
android:ellipsize="start"
android:layout_marginRight="4dp" />
<TextView
android:id="#+id/tvEuroSymbol"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/tvImporte"
android:layout_toRightOf="#+id/tvImporteDesc"
android:textColor="#android:color/darker_gray"
android:textSize="#dimen/subtitle_text_size"
android:visibility="gone"
android:hint="#string/euro_symbol"
android:textColorHint="#color/blue_quantion"
android:ellipsize="start"
android:paddingLeft="4dp" />
</RelativeLayout>
You seem like you want to change the width of tvImporteDesc dynamically. The short of it is that Android does not allow this, though some people have developed work arounds. (Toggling the visibility that some answers suggest did not work for me). Similar questions:
Change Relative layout width and height dynamically
WRAP_CONTENT not working after dynamically adding views
Since you are trying to fit text on the same line it might be easier to use a single TextView for that line of text, and concatenate the euro symbol?

Edit Text view increase its size when inserted long text in android

I have edittext view in my application but when i insert long text in edit text this increases view size.I do not want happened in my app because it created bad imapact on app so I decided to use
android:singleLine="true"
android:ellipsize="end"
android:maxLine="1"
xml attribute to the edit text but it not worked for me .I don't have any idea how to prevent this from my problem.I did lot of R&D but i am not get satisfactory answer.Here is my Edit Text.
<EditText
android:id="#+id/etaccountholdersname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tvaccountholdername"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:background="#drawable/ic_input_field"
android:hint="Account holder's name"
android:singleLine="true"
/>
Here Is full code of Xml file
<RelativeLayout
android:id="#+id/innerrel1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true" >
<TextView
android:id="#+id/tvaccountholdername"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:background="#drawable/ic_account_holders_name_text"
android:gravity="left" />
<EditText
android:id="#+id/etaccountholdersname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tvaccountholdername"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:background="#drawable/ic_input_field"
android:hint="Account holder's name"
android:singleLine="true"
android:scrollbars="vertical" />
</RelativeLayout>
Please provide some help me to solve this issues.
In your layout design you have "wrap_content" for both parent and children views. Make the parent layout width as static. If you working with multiple screens, use the dimens.xml for the sizes of the views in different screen sizes.
Use either android:layout_weight property or use android:ems="7" it will work for you definetely
do not use
android:ellipsize="end"
its uses for textview
use
android:ems="10" (it limits edittext to show 10 charecters but you can insert many characters)
and you are good to go.

Multiline TextView with width "wrap_content"

I am wondering how to have a TextView display its content on several lines without hardcoding the width in the XML.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:singleLine="false"
android:text="Long multiline text"/>
<TextView
android:textColor="#color/text_color"
android:layout_width="130dp"
android:layout_height="wrap_content"
/>
</LinearLayout>
Any thought welcome.
EDIT: my problem is that when the text exceeds the width set (because it reaches the end of the screen) a portion of the text is just not displayed. I would expect the text to be split on two lines
Though I cannot reproduce the not wrapping problem, you can fix the positioning problem by using a weight on the first TextView. Using the following XML gives the expected output in the graphical layout view in Eclipse:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right"
android:orientation="horizontal">
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:singleLine="false"
android:text="Long multiline text"/>
<TextView
android:textColor="#color/text_color"
android:layout_width="130dp"
android:layout_height="wrap_content"
/>
</LinearLayout>
Also add
android:minLines="2"
android:scrollHorizontally="false"
You could try
android:inputType="textMultiLine"
in your TextView XML. This worked for me.
I think I had very similar problem. I had a TextView with a text, where I was not sure how much lines will it take. It was encapsulated by a LinearLayout having android:layout_width="match_parent" to ensure my text will fill out all the space horizontally. However, the problem was that my text did not fit into 1 line and when it did break into a new line, the next view component below it did not move downwards to give enough space for the second line to be viewable fully.
I could achieve the solution by changing the LinearLayout that was containing my TextView into a RelativeLayout. By this way, the element below the text (actually below the Layout itself) was moved automatically to give enough space for the multi-line text.

TextView text aligment is horrible! How to work around it?

I always seem to have the biggest issues with aligning a text on a layout. Seems like the TextView doesn't measure its text properly. The reported TextView width and height are a lot bigger than the actual text. One would expect the TextView width and height to be tightly wrapped around the text.
The image below shows how the number 18 and the text "SEC" are not aligning on the same bottom baseline. This is due to the larger text height being a lot bigger than the text is. My xml layout can be seen below.
How to achieve better text alignment accuracy?
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#drawable/scan_block_1_bg" >
<LinearLayout
android:id="#+id/staticCountDown"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="center"
android:orientation="vertical" >
<TextView
android:id="#+id/tvStaticScanning"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:shadowColor="#ffffff"
android:shadowDy="1.0"
android:shadowRadius="0.01"
android:text="SCANNING"
android:textColor="#878787"
android:textSize="20sp" />
<TextView
android:id="#+id/tvCountDown"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:shadowColor="#66000000"
android:shadowDy="-1.0"
android:shadowRadius="0.01"
android:text="03"
android:textColor="#b6b6b6"
android:textSize="81sp" />
</LinearLayout>
<TextView
android:id="#+id/tvStaticSeconds"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#id/staticCountDown"
android:layout_toRightOf="#id/staticCountDown"
android:gravity="left"
android:shadowColor="#ffffff"
android:shadowDy="1.0"
android:shadowRadius="0.01"
android:text="SEC"
android:textColor="#878787"
android:textSize="12sp" />
</RelativeLayout>
//use this attribute in your TextView
android:layout_alignBaseline="#id/staticCountDown"
and android:layout_marginBottom="-10dp"
As strange as it may sound if you look at the screen shot provided Both the textviews have the same bottom base alignment. Try putting letters "gj" in tv countdown. You can actually see both will come to have same bottom base alignment. Its better go with padma Kumar's answer.

Categories

Resources