Textview that stays as narrow as possible, but grows to wrap content - android

edited to clarify:
I have a TextView that defaults to 150dp in width, full height. I'm populating it with a string that varies in length. Sometimes the string is short enough that it doesn't fill up the given size of TextView, but other times it's larger than the default size. If the text won't fit in the textbox, I want the width of the box to grow to accommodate it, but I'd like it to default to be 150dp wide. Any suggestions?
<TextView
android:id="#+id/address"
android:layout_width="150dp"
android:layout_height="fill_parent"
android:layout_above="#+id/button1"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:minWidth="150dp"
android:textColor="#color/white"
android:textSize="18sp" />
This creates a textbox that cannot be resized to fit overlong text.
Changing the width to
android:layout_width="wrap_content"
just tries to create a textbox wide enough for the whole message.
The message is generally between 75 and 150 characters.
To sum up: i'm trying to create a textbox that is either 150 dp wide, or just wide enough to fit the entire message, whichever is greater.

Place the Textview inside a layout with a fixed width.
<RelativeLayout
android:layout_width="150dp"
android:layout_height="match_parent"
android:layout_above="#+id/button1"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" >
<TextView
android:id="#+id/address"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:textSize="18sp" />
</RelativeLayout>
This will make the textview take the width upto the layout width or less. If it is more length then it will take a new line.
Use android:gravity="center" for the layout, if neccesary to make the textview be in the center.
Hope you were looking out for this.

Related

Is padding only included in a view size if its set to wrap content?

In this example, there will be no text shown as it is covered by padding.
<TextView
android:padding="250px"
android:layout_width="500px"
android:layout_height="500px"
android:background="#color/yellow"
android:text="some text"
android:textColor="#color/red"/>
however, in this example the padding will be added onto the sizes thus there will be a larger textview and visible text.
<TextView
android:padding="250px"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/yellow"
android:text="some text"
android:textColor="#color/red"/>
Is there a way in pure xml to set an arbitrary width and/or height and have the view size include the padding just like with html?
Just decide on a certain size and add the paddings onto it.
<----------------- 1000px ---------------->
<-- 250px --><---- 500px ----><-- 250px -->
Otherwise you can still use a margin.

How to force a TextView to change width to the width of the text in Android

I have hints set on my TextViews which have android:layout_width="wrap_content" set and if the text that is typed into the TextView is not as wide as the width of the hint-text, then the TextView won't change its width to wrap the text. However, if the text that is entered is wider than the width of the hint-text, and given there is room for the TextView to widen, then it will grow to wrap the text.
Ideally, what I would like is for the TextView to shrink to my text regardless of what the width of the hint-text was (the original width of the TextView), but I will also except answers that provide a way to get the width of my text, so I can just call setWidth on the TextView with that width.
I've already tried changing the minimum width of the TextView to 0 after initializing it, but that doesn't solve the problem. The funny thing is if I enter text that is wider than the hint-text (forcing it to grow), it will shrink if I take away characters from that text until it gets back to the width that the hint-text forced it to have. What I want is for it to always shrink to the width of the text, regardless of the width of the hint-text.
Here's my layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center">
<TextView
android:id="#+id/month_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:hint="mm"
android:textColorHint="#color/hint_color"
android:singleLine="true"
android:textSize="40sp"
android:maxLength="2"/>
<TextView
android:id="#+id/first_hypen_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:hint="-"
android:singleLine="true"
android:textSize="40sp"/>
<TextView
android:id="#+id/day_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:hint="dd"
android:textColorHint="#color/hint_color"
android:singleLine="true"
android:textSize="40sp"
android:maxLength="2"/>
<TextView
android:id="#+id/second_hyphen_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:hint="-"
android:singleLine="true"
android:textSize="40sp"/>
<TextView
android:id="#+id/year_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:hint="yyyy"
android:textColorHint="#color/hint_color"
android:singleLine="true"
android:textSize="40sp"
android:maxLength="4"/>
</LinearLayout>
What I ended up doing was to set the hint on the TextView to "" when it had text in it, and then resetting the hint to the original hint if all the text was ever deleted from it. This way, once text was entered, whatever settings were forcing the TextView to have a minimum width -- because of the initial hint-text width -- would be reconfigured after the new hint was set, and the new minimum TextView width set to 0 because of the new hint-text width (""); and if all the text was deleted the hint would still show as expected.
Use "ems" with hint length
e.g. In XML design
android:ems="2"
Here for you day_textview has hint "dd", it's length is 2 then android:ems="2"
OR, In custom code
TextView tvDay = (TextView) findViewById(R.id.day_textview);
tvDay.setEms(tvDay.getHint().length());
So "ems" it turns out refers to the size of the widest character, typically an "M", get it? So setting minEms to an integer value say 3, on an EditText or TextView should ensure it's at least 3 characters wide. You can set the maxEms as well.
The thing I understood from you is, you want a text with hint characters length width. When you enter more text than hint length then your text should shrink till that entered text length. And once it's done and you remove all the entered text then again it should take the same hint's length width size.
For that above information is given.
Test e.g.
Add in you XML layout:
<EditText
android:id="#+id/edtCheck"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="end"
android:hint="abc"
android:maxLines="1"
android:text="I am an Android Developer" />
Add this to your activity:
EditText edt = (EditText) findViewById(R.id.edtCheck);
edt.setEms(3);//3 just for test
edt.setMaxEms(1000);//1000 just for test
Now run and check is it works exact for what you are looking.

Keep ImageView on the right size of the text and yet prevent long text to push it out of view?

The situation is the same no matter if I use LinearLayout or RelativeLayout. I think this is a old Android XMl bug, but I have no idea why it still exists.
Namely, in a layout where an ImageView is on the right side of a TextView can disappear from the screen when text becomes too long. It simply pushes it off the screen. I must NOT make TextView single line.
Here is the XML.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<TextView
android:id="#+id/txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="some long text blahblahblahblahblah"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="17sp"
android:layout_marginRight="10dp"
android:layout_centerVertical="true"
/>
<ImageView
android:layout_toRightOf="#+id/txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/key"
android:layout_centerVertical="true"
/>
</RelativeLayout>
I cannot use layout_weight attribute as image will then stick to the right side of the screen. It HAS to be on the right side of the text.
Anyone has any ideas how to solve this bug?
Check images when the text is short and long. On the 2nd image the text is long and the image is being pushed away from the screen.
You can achieve your task, if you use the layout_weight properly. Please refer the code below:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="horizontal"
>
<TextView
android:id="#+id/txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="The quick brown fox jumps over the lazy dog. As you can see it easily handles the long length of the text"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="17sp"
android:layout_marginRight="10dp"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"
/>
</LinearLayout>
The output for long text:
The output for short text:
EDIT:
This works because of the layout whose width is set as wrap_content. If it were match_parent then in all cases, all the extra space would have been given to TextView because of it's layout_weight but since the parent is wrap_content, there is no extra space for the TextView to fill when the text is small. But when the text is large, the weight property is applied to the TextView but since there is no layout_weight for the ImageView hence, it takes only the amount of space it has to.
Set
android:layout_marginRight="30dp"
for the TextView
and
android:layout_marginLeft="-20dp"
for the ImageView
You can change the values depending on your needs.
But, if the image can have different sizes, you will have to set margins programmatically.
there is 2 solutions for these
either set the image as a drawableRight to the textview
<TextView
android:id="#+id/txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="The quick brown fox jumps over the lazy dog. As you can see it easily handles the long length of the text"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="17sp"
android:layout_marginRight="10dp"
android:drawableRight="#drawable/ic_launcher"
/>
or
alignt the image to right and make textview toleft of the image

Expanding TextView with screen size up to maxWidth

This issue relates to expanding elements with screen width, but only up to a maxWidth.
My scenario involves a vertically oriented LinearLayout containing a fixed sequence of rows. Each of those rows is a horizontal LinearLayout containing some EditText elements, separated by TextView elements. The TextView elements' text contains a mathematical symbol (e.g. + or - or /) and are meant to indicate that the contents of second box will be added to (or subtracted from, etc) the first box, for display elsewhere in the UI.
The EditText elements must stay their current fixed width, but I want the TextView elements (acting like separators) to expand in width if the screen will allow it, but only up to a maxWidth of 30dp. Currently the layout for one example row looks like:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingLeft="#dimen/row_side_padding"
android:paddingRight="#dimen/row_side_padding"
android:paddingTop="5dp"
android:paddingBottom="5dp">
<EditText
android:id="#+id/editTextBoxOne"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="#string/box_one_hint"
android:imeOptions="actionDone"
android:inputType="numberSigned"
android:maxLines="1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/plus" />
<EditText
android:id="#+id/editTextBoxTwo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="#string/box_two_hint"
android:imeOptions="actionDone"
android:inputType="numberSigned"
android:maxLines="1" />
</LinearLayout>
This current code wraps the width of the TextView to the width of the text (just a plus symbol in this example). This is exactly what I want on small screens!
However, on wider screens it would be nice if the TextView grew wider to space out the elements a bit. I am able to expand the TextView by setting it as:
<TextView
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/plus" />
But this makes the TextView too large. I want it to expand to a maximum of 30dp, if the screen width allows it. But from what I understand, android:maxWidth does not work with android:layout_width="match_parent" so any maxWidth is just ignored.
So how can I expand my TextView based on screen width, but only up to a maximum width, while leaving my EditText elements the same size?
Set android:layout_width to 0dip...it will help the TextView to take the space which are available after EditTexts size.
<TextView
android:layout_width="0dip"
android:layout_weight="1"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/plus" />
For those who are tackling the same problem...
It didn't seem as if there was a way to do this. Instead, the best route to go is to create some standalone layout files that are associated with certain screen widths (i.e. are in res/layout-w600dp as well as one in res/layout itself to catch the smallest screen widths). I specified a single TextView in my layout_plus.xml file:
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:gravity="center"
android:text="#string/plus" >
</TextView>
For each of these screen-width dependent layouts I used a different amount of paddingLeft and paddingRight, to manually perform the expansion of space around the TextView. You could change the TextView's width if you wanted.
Then in your main layout, remove the TextView you were attempting to expand and use the tag. This will allow your screen width dependent files to be dragged in automatically - whichever one is appropriate. My include looked like this:
<include
android:layout_width="wrap_content"
android:layout_height="wrap_content"
layout="#layout/layout_plus"/>
The documentation states that you should override the layout_width and layout_height attributes.
I wanted to override other attributes too, such as override the text to contain a minus instead of a plus (allowing me even more re-use). Unfortunately, include does not let you override other attributes, so I had to create a set of layout_minus.xml layouts for this purpose.
As an alternative to using with modified layouts, there is the option of simply creating screen width dependent versions of the string resource displayed by the TextView, into which you can insert spaces for the larger width versions. This would require less changes, and probably less new files, but hardcoding spaces inside strings makes it harder to tweak and tune later on.

How to center a text vertically in a narrow textview in Android?

I have a TextView which has a height of 30px and a textsize of 40px. Since the text is taller than the View, I only want to display the middle part of the text.Like this:
But with android:gravity="center_vertical", I only can display the upper part of the text with some bottom part cut off.
And this is my code:
<TextView
android:layout_width="wrap_content"
android:layout_height="30px"
android:textSize="40px"
android:text="ABCDEFG"
android:gravity="center_vertical"
/>
Anyone knows of any way to do that? Thanks!
Can't you simply wrap it in a LinearView set to the appropriate size and adjust the margin within the textview to about half (depending on padding) the font size?
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="20dp"
android:background="#android:color/white">
<TextView
android:gravity="center"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#android:color/black"
android:text="Sliced in half"
android:textSize="60dp"
android:layout_marginTop="-30dp"/>
</LinearLayout>
Resulting in:
http://i.stack.imgur.com/jEdxx.png
I highly doubt whether you can do that. All the options that I have come across while dealing with TextView are for when the Text is smaller than the View. This is the first question that I have come across which has the requirement otherwise.
One option which I had used before was android:scrollHorizontally="true" where in you specify whether the text is allowed to be wider than the View.
Interesting question. It would be great if you could add some code though.

Categories

Resources