I’m looking for a way to insert emoticons/smileys/any bitmap in a text field (LabelField, EditField, whatever). From what I’ve researched so far, there is no direct way to do this, so I’m stuck with trying to simulate this behavior.
I was thinking of using a normal text field and instead of smileys to insert blank spaces and then place some BitmapFields over the text field where the smileys should be. The problem is that I have no reliable/quick way of finding a character’s position on screen (x,y).
Can you give me some ideas?
Can you think of other approaches to this problem?
I’m sure a lot of people encountered this kind of problem at one time or another. I hope there is someone who managed to find a solution. I’m desperate enough to accept any solution, no matter how crazy/complex/difficult.
Also, I would like to use this in SDK 5.0 and up, but I will settle for only 6.0.
What you might be able to do is create a custom Manager that is a container for EditFields and BitmapFields. When the user clicks in the initial EditField that is inside of your Manager and begins typing, you let them type until they want an emoticon. When they select it you create a BitmapField right after the EditField and then place a new EditField to the right of the BitmapField. You’ll have to keep track of things like when the user hits backspace and empties an EditField, it should be removed, and then they are selecting the BitmapField, and a subsequent backspace would delete the BitmapField and put focus on the previous EditField.
You will have to also create your own EditField that you can control the size of, and BitmapField that allows for backspace to delete it.
As far as I can think ahead, you shouldn’t have any problem using this for 5.0
Edit for comments:
You’ll have to be implementing your own sublayout() of your Manager in any approach you take, so you know positions because you’re the one who put them there. If you want to want to do multi-line (my approach was for single-line), you can do one of three things:
1.) Just have new EditFields for each line and do the linking the same way I talked about where backspace drops you to the previous Field, in this case the last line. You have to keep measurements of how big the field is based off of the text, and see if that will move it to the next line. If it does just adjust where the EditFields are positioned.
2.) You can do your image placement in the multi-line field by implementing your own EditField that expands height, in which case you’ll know where the text is and what lines you are on. Drawing the Bitmap would be a matter of calculating (what line number you are) * (font height) and getAdvance(text_up_to_bitmap).
3.) Implement your own EditField where you have a focusable Manager that you manually do all of the drawing. You can parse a String that you save from capturing key strokes and maybe have a flag where an emoticon should be. Draw the text before it, draw the emoticon, then continue drawing the text. The difficulty with this is you will have to do things like determining where the cursor should be, bringing up the virtual keyboard, and handling some of the other tasks that the EditField does for you.