Develop Reference

How LineSpace Affects StaticLayout Height in One Line Text

Consider this simple example:
I have a single line text like this: "Hello"
I wanna measure this text using StaticLayout. So I wrote something like this:
StaticLayout layout = new StaticLayout("Hello", myTextView.getPaint(), myTextView.getWidth(), Layout.Alignment.NORMAL, 1, lineSpace, false);
In above code I changed lineSpace variable in a for loop and every time log the layout's height:
for(int lineSpace=0; lineSpace<20;lineSpace++){
StaticLayout layout = new StaticLayout("Hello", myTextView.getPaint(), myTextView.getWidth(), Layout.Alignment.NORMAL, 1, lineSpace, false);
Log.d("TAG", "layout height: " + layout.getHeight());
}
When I run this code on device with android M layout't height doesn't changed with multiple values of lineSpace. But in lower android versions layout's height changed with line space respectively.
Although when your text is more than one line ,StaticLayout consider line space between two lines. But it seems Android M doesn't consider line space for last line but lower Android versions does.
My question is this: After what version of android StaticLayout consider line space for last line? Can I wrote something like this:
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
// in this version StaticLayout don't consider line space for last line
} else {
// in this version StaticLayout consider line space for last line
}

I did some quick digging in the source code, seems to be that this part is the culprit:
if (needMultiply && !lastLine) {
double ex = (below - above) * (spacingmult - 1) + spacingadd;
if (ex >= 0) {
extra = (int)(ex + EXTRA_ROUNDING);
} else {
extra = -(int)(-ex + EXTRA_ROUNDING);
}
} else {
extra = 0;
}
Older versions are missing the !lastLine condition and thus also add the spacing to the last line.
The condition was added in this commit, which, if my github foo doesn't fail me, should be included starting with Android 5.
Apparently, just like the commit mentions, this only affects single line texts, for multiline texts the height seems to be calculated correctly. So an easy fix might be to check whether the text only has a single line (using getLineCount()) and if the Android version is less than 5, and if so substract the line spacing once.

Duplicate images appear in EditText after insert one ImageSpan in Android 4.x

I have below code slice to insert a bitmap into an EditText widget. With Android 5.x, it works fine, but with Android 4.x, duplicate images will show after insert one bitmap. Dose anyone know how to fix this with Android 4.x?
insertPicIntoEditText(getBitmapSpannable(resized_bm, upload_uri));
private SpannableString getBitmapSpannable(Bitmap pic, String uri_string) {
SpannableString ss = new SpannableString(uri_string);
ImageSpan span = new ImageSpan(this, pic);
ss.setSpan(span, 0, uri_string.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
return ss;
}
private void insertPicIntoEditText(SpannableString ss) {
Editable et = mContentEditor.getText();
int start = mContentEditor.getSelectionStart();
et.insert(start, ss);
et.insert(start + ss.length(), "\n");
mContentEditor.setText(et);
mContentEditor.setSelection(start + ss.length() + 1);
}

This was being caused by the height set in setBounds being greater than that of the Bitmap the drawable was created from earlier in the activity. When this occurs there are two things that seem to happen..
First, if the size only slightly (I haven't extensively tested this once I got it working so I'm unsure of exact figures) exceeds the size of the Bitmap then a large blank space is added to the span, this blank space is the same size as the bitmap inserted.
Second, an extra copy of the Drawable is added to the span, directly below the blank space.
The resolution was relatively simple.. Ensure that the Bitmap used to create the Drawable was set to the intended final size before creating the Drawable and calling setBounds.
This may not work in all cases but worked for me and hopefully will be helpful for someone.

I also noticed images are repeated if the spannable string has line breaks.

Prevent Android's TextView from breaking links

This question is probably the same as this one, but since none of its answers really solve the problem, I'll ask again.
My app has a TextView that occasionally will display very long URLs. For aesthetic reasons (and since the URLs contain no spaces), the desirable behaviour would be to fill each line completely before jumping to the next one, something like this:
|http://www.domain.com/som|
|ething/otherthing/foobar/|
|helloworld |
What happens instead, is the URL being broke near the bars, as if they were spaces.
|http://www.domain.com/ |
|something/otherthing/ |
|foobar/helloworld |
I tried extending the TextView class and adding a modified version of the breakManually method (found here) to trick the TextView and do what I need, calling it on onSizeChanged (overridden). It works fine, except for the fact that the TextView is inside a ListView. When this custom TextView is hidden by the scrolling and brought back, its content goes back to the original breaking behaviour, due to the view being re-drawn without onSizeChanged being called.
I was able to work-around this problem by calling breakManually inside onDraw. This presents the expected behaviour at all times, but at a high performance cost: since onDraw is called whenever the ListView is scrolled and the breakManually method isn't exactly "lightweight", the scrolling gets unacceptably laggy, even on a high-end quad-core device.
Next step was to crawl through the TextView source code, trying to figure where and how it splits the text, and hopefully override it. This was a complete failure. I (a newbie) spent the whole day fruitlessly looking at code I mostly couldn't understand.
And that brings me here. Can someone please point me the right direction about what I should override (assuming that it's possible)? Or maybe there is a simpler way of achieving what I want?
Here's the breakManually method I mentioned. Due to the use of getWidth(), it only works if called after the view is measured.
private CharSequence breakManually (CharSequence text) {
int width = getWidth() - getPaddingLeft() - getPaddingRight();
// Can't break with a width of 0.
if (width == 0) return text;
Editable editable = new SpannableStringBuilder(text);
//creates an array with the width of each character
float[] widths = new float[editable.length()];
Paint p = getPaint();
p.getTextWidths(editable.toString(), widths);
float currentWidth = 0.0f;
int position = 0;
int insertCount = 0;
int initialLength = editable.length();
while (position < initialLength) {
currentWidth += widths[position];
char curChar = editable.charAt(position + insertCount);
if (curChar == '\n') {
currentWidth = 0.0f;
} else if (currentWidth > width) {
editable.insert(position + insertCount , "\n");
insertCount++;
currentWidth = widths[position];
}
position++;
}
return editable.toString();
}
To everyone who bothered reading this, thanks for your time.

If you're not using a monospace font, then in some cases it's not even possible to align it very well. Since you have no whitespaces in a URL, it's not likely that a Justify-like alignment will solve the problem. I suggest that you use a monospace font for that particular TextView. Then, decide on a fixed number of characters per line and break the string to display with "\n" after those many characters.
This isn't answering your question but it's the smoothest way possible, I guess.

SpannableString(Builder) is not selectable in EditText

I have created an EditText and added some text which contains formatting to it as in the following code:
EditText richTextView = (EditText)findViewById(R.id.rich_text);
// this is the text we'll be operating on
SpannableStringBuilder text = new SpannableStringBuilder("Lorem ipsum dolor sit amet");
// make "Lorem" (characters 0 to 5) red
text.setSpan(new ForegroundColorSpan(Color.RED), 0, 5, 0);
// make "ipsum" (characters 6 to 11) one and a half time bigger than the textbox
text.setSpan(new RelativeSizeSpan(1.5f), 6, 11, 0);
// make "dolor" (characters 12 to 17) display a toast message when touched
final Context context = this;
ClickableSpan clickableSpan = new ClickableSpan() {
#Override
public void onClick(View view) {
Toast.makeText(context, "dolor", Toast.LENGTH_LONG).show();
}
};
text.setSpan(clickableSpan, 12, 17, 0);
// make "sit" (characters 18 to 21) struck through
text.setSpan(new StrikethroughSpan(), 18, 21, 0);
// make "amet" (characters 22 to 26) twice as big, green and a link to this site.
// it's important to set the color after the URLSpan or the standard
// link color will override it.
text.setSpan(new RelativeSizeSpan(2f), 22, 26, 0);
text.setSpan(new ForegroundColorSpan(Color.GREEN), 22, 26, 0);
// make our ClickableSpans and URLSpans work
richTextView.setMovementMethod(LinkMovementMethod.getInstance());
// shove our styled text into the TextView
richTextView.setText(text, BufferType.EDITABLE);
My problem is that the text is not selectable when running the program (tried on both the emulator and my own device). If I click on any of the words except "dolor", no cursor appears, but if I type, it starts typing from before "Lorem". However, if I click "dolor", it selects the word and I can replace it (but I can't type without replacing).
I can't select any other parts of the words, and can't place the cursor where I want it (it doesn't even show up).
I am wondering how I can get normal text selection features like those that are present when using normal text instead of SpannableString or SpannableStringBuilder? (I have tried both) If I use plain text, I can select any part of any word and start inputting text from there.
Edit1
The text selection works in landscape mode, but not in portrait. So the code is valid to some degree...
Edit2
Actually text selection works in landscape mode on my phone, but not on the emulator.

Just figured it out. The problematic code was richTextView.setMovementMethod(LinkMovementMethod.getInstance());
So I just removed it. It makes the links non-responsive, but I don't really need links anyway so it's fine.
Used in this way, setMovementMethod was completely blocking selection by touch events for some reason (I'll have to dig into the source to figure out exactly why).
Note to self: Don't add code till you fully understand it.

Android TextView's subscript being clipped off

The Android TextView clips off my text subscripts (see image below) even when I use android:layout_height="wrap_content" for the TextView.
Is there a fix/work-around for this?
P/S: Superscripts work fine
Note: padding doesn't work.
I tried even adding a padding of 50dip but it did not help.
I can use an absolute height such as 50dip but that messes everything up when I need text to wrap around.
Sample Code:
mtTextView.setText(Html.fromHtml("HC0<sub>3</sub>"));

Most answers suggest to add paddings or to use smaller sub/superscripts. These might be serviceable workarounds, but they don't really solve the problem. Ideally, we want Android to take the sub/superscript into account when calculating line height. I think I found how to do it, and I'm sharing it for people googling this issue.
SpannableStringBuilder sb = new SpannableStringBuilder("X2");
sb.setSpan(new SuperscriptSpan(), 1, 2, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
textView.setText(sb, BufferType.SPANNABLE);
The trick is in BufferType.SPANNABLE. Apparently it makes TextView pay more attention to the markup and calculate line heights properly.

This solution worked for me.
Superscripted text is usually made smaller when the browser renders it, that doesn't seem to happen here so you can replicate that (and solve this problem) by doing this:
someTextView.setText(Html.fromHtml("Some text<sup><small>1</small></sup>"));

For subscript a slight variation to the above suggestion is needed, two small tags:
textView.setText(Html.fromHtml(
"HCO<sub><small><small>3</small></small></sub>));

android:lineSpacingExtra="4dp" should solve it
this will add extra line spacing below your text, and keep subscript from getting cutoff. I haven't tried it with superscript so it might now fix that.

I had the same issue, so after reading the posts, I found this to be working.
Example : H2O
simply use :
textView.setText(Html.fromHtml("H<sub>2</sub>O"),BufferType.SPANNABLE);
BufferType.SPANNABLE is important as it will tell textview to consider the superscript span.
If you are using custom tag handler for HTML you can also use it like this:
textView.setText(Html.fromHtml(data, null, new CustomHtmlTagHandler(),BufferType.SPANNABLE);
Hope it helps someone looking for same problem.

I'm displaying fractions and mixed numbers so I'm using both super and subscripting together. The Html.fromHtml didn't work for me, it either clipped the top or the bottom.
Oddly, mixed numbers worked correctly, but fractions by themselves did not.
I ended up using a SpannableString with a SubscriptSpan or a SuperscriptSpan, then setting the font size in a TextAppearanceSpan.
Once I had done that I had to expand the height of the TextView as well.
TextView number = (TextView)findViewById(R.id.number);
String temp = "1 1/2";
SpannableString s = new SpannableString(temp);
// if the string has a fraction in it, superscript the numerator and subscript the denominator
if (temp.indexOf('/') != -1)
{
int len = temp.length();
s.setSpan(new SuperscriptSpan(), len - 3, len - 2, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
s.setSpan(new TextAppearanceSpan(null, 0, fractionFontSize, null, null), len - 3, len - 2, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
s.setSpan(new TextAppearanceSpan(null, 0, fractionFontSize, null, null), len - 2, len - 1, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
s.setSpan(new SubscriptSpan(), len - 1, len, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
s.setSpan(new TextAppearanceSpan(null, 0, fractionFontSize, null, null), len - 1, len, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
}
number.setText(s);
Then I had to expand the height:
RelativeLayout.LayoutParams parms = (RelativeLayout.LayoutParams)number.getLayoutParams();
Rect frame = CalcSize(number.getTextSize(), quantityMaxString);
parms.height = frame.height() + fractionAdjustment;
number.setLayoutParams(parms);
CalcSize returns a bounding rectangle of the largest string in the array of display elements.
fractionAdjustment is an emperically selected value that works for the selected font size adjusted for screen geometry.
Note: This is TextView is inside a ListView, so that might have some impact as well.
// calculate the field dimensions, given the font size and longest string
private static Rect CalcSize(float fontSize, String maxString)
{
Rect bounds = new Rect();
paint.setTypeface(Typeface.DEFAULT);
paint.setTextSize(fontSize);
paint.getTextBounds(maxString, 0, maxString.length(), bounds);
return bounds;
}
Empirical values:
fractionAdjustment = (int)TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 14, resources.getDisplayMetrics());
fractionFontSize = (int)TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, 11, resources.getDisplayMetrics());

I have faced the same issue in ICS and below android versions. I fixed the issue by a simple step
Give a minimum height to the Text View . It will fix the problem.
You can set minimum height through xml .
android:minHeight="30dp"
Or dynamically
if (android.os.Build.VERSION.SDK_INT < android.os.Build.VERSION_CODES.JELLY_BEAN) {
tv.setMinHeight(52);
}

This worked for me along with the Small tag.
Inside the TextView add
android:paddingBottom="1dp"
Use the small Tag after the subscript
yourTextView.setText(Html.fromHtml("" +" Hey< sub >< small >2< /small > < /sub >"));
Note Please note , step 1 is important , My text was still cutting down in some case,using paddingBottom resolved it.
Don't forget to remove the spaces in sub and small tags that are present in my answer :)

The More number of <small> </small> tags in there, the smaller the subscript will get and you should be able to see it without being clipped.
Eg: H2O
Html.fromHtml("H<sub><small><small><small>2</small></small></small></sub>O");