Android Question EditText with formatted text is possible!

welu1805

Active Member
Licensed User
Longtime User
Hi all,

long time I was looking for a solution to format text in an edittext field (e.g. font size , bold, italic, font color, background color). Now I found a solution in the Android developer pages: Spannable.

"Spans" are the format informations which are stored together with the plain text in an edittext field.

I want to give a small example for people who are also interested in that problem.

If you selected a part of the text in an edittext field, you can set its type e.g. to bold by pressing the "BOLD" button.

With the designer I created an edittext called RTF and two buttons called btnBold and btnRed.

At first we need the SelectionStart and the SelectionEnd position of the selected text. Unfortunately the edittext has no method to get the SelectionEnd. We need a reflection object for RTF:

Dim refRTF as Reflector
refRTF.Target = RTF

Now we can get start and end:

Dim selStart as Int = refRTF.RunMethod("getSelectionStart")
Dim selEnd as Int = refRTF.RunMethod("getSelectionEnd")

We need the whole text with all span informations of the edittext field (at first no format spans are available because the text is not formatted).

Dim SpannableString As JavaObject ' in Java this object is called SpannableStringBuilder
SpannableString = refRTF.RunMethod("getText") ' includes the text with all spans

Now set our selected text to bold:

' We create a span object from type StyleSpan
Dim boldSpan As JavaObject
boldSpan.InitializeNewInstance("android.text.style.StyleSpan", Array As Object(Typeface.STYLE_BOLD))
SpannableString.RunMethod("setSpan", Array As Object(boldSpan, selStart , selEnd, 33)

33 is a constant SPAN_EXCLUSIVE_EXCLUSIVE

A further example to set the font color to red:

' We create a span object from type ForegroundColorSpan
Dim redSpan As JavaObject
redSpan.InitializeNewInstance("android.text.style.ForegroundColorSpan", Array As Object(Colors.Red))
SpannableString.RunMethod("setSpan", Array As Object(redSpan, selStart , selEnd, 33)

These are only 2 examples, but now we can format our edittext field like we want. There are many other spans for background color, underline, strikethrough, subscript, superscript and paragraph styles ...

I hope, this is interesting for someone

Greetings Lutz
 

Juzer Hussain

Active Member
Licensed User
Longtime User
Hi welu1805,
It is very useful code instead.
Will it be possible to insert image like smileys in between text as in Whatsapp exteding above functionality.
Pls reply.
Thanks
Juzer
 
Upvote 0

welu1805

Active Member
Licensed User
Longtime User
There is an ImageSpan for inserting images. I wrote this in Java:

#If JAVA
import android.text.SpannableStringBuilder;
import android.text.Spannable;
import android.text.style.ImageSpan;
import android.graphics.Bitmap;
import android.graphics.drawable.BitmapDrawable;

public void SetImageSpan(SpannableStringBuilder content, int start, int ende, Bitmap bm, String imagePath) {
BitmapDrawable draw = new BitmapDrawable(bm);
draw.setBounds(0, 0, bm.getWidth(), bm.getHeight());
ImageSpan imgSpan = new ImageSpan(draw, imagePath, 0);
content.setSpan(imgSpan, start, ende, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
}
#END IF

In Sub Process_Globals:
Private NativeMe As JavaObject

In Activity_Create:
If FirstTime Then
NativeMe.InitializeContext
End If

To insert an image:
NativeMe.RunMethod("SetImageSpan", Array As Object(SpannableString, selStart, selEnd, bitmap1, File.Combine(imageDir, imageFile)))

I hope this helps.
Lutz
 
Upvote 0

Mark Read

Well-Known Member
Licensed User
Longtime User
@welu1805, thank you for posting this information. It is definitely useful. In future, can you please use the code tags when posting as it makes things easier to read.
 
Upvote 0

welu1805

Active Member
Licensed User
Longtime User
@Informatix: Thank you for your tip. But I think, HTM tags are good if I use static text and the user can't change it.

In my case I have an edittext like a simple word processor where the user can write text and select some text and presses buttons to make the selected text e.g bold, italic, set foreground and background color, another textsize or insert an image. I think that is easier with spans.
 
Upvote 0

konradwalsh

Active Member
Licensed User
Longtime User
Sorry to reopen.. is there a way to undo the formatting? Is there a

B4X:
if boldspan is bold then style_normal?

I know I can select text - set it to normal

But let's say I have set it to bold and italics but then just want bold, I want to query its current state and set it based on this

I also want the buttons to reflect the current state of the selected text
 
Last edited:
Upvote 0
Top