(AS3) Getting HTML character index in text field after word wrap

Question

I did not know how to phrase the name, so I'm sorry about that. If you have a better name offer, let me know and I will change it.

I have a piece of text that displays as HTML in a TextField. An example of this text:

1
<font size="30" color="#FF0000">When your only tool is a hammer, all problems start looking like nails.</font>
</br>
2
<i>99 percent of lawyers give the rest a bad name.</i>
<b>Artificial intelligence is no match for natural stupidity.</b>
<u>The last thing I want to do is insult you. But it IS on the list.</u>
</br>
3<showimage=Images/image1.jpg>
I don't have a solution, but I do admire the problem.
The only substitute for good manners is fast reflexes.
Support bacteria - they're the only culture some people have.
</br>
4
Letting the cat out of the bag is a whole lot easier than putting it back in.
Well, here I am! What are your other two wishes?

Run codeHide result

Most tags are basic, designed to display what I can do with formatting. However, since Adobe Air has a sandbox that prevents embedded images (via a tag <img src='foo.png'>), I had to come up with a different way to display images.

, - , , , , . , - , - .

<showimage=Images/image1.jpg>. y , TextField HTML . , y- ( getCharBoundaries), , .text .htmlText. TextField .htmlText, , .

y, HTML, , y - , , y, .

y HTML HTML?

, , - &&&&&showImage=Images/image1.jpg&&&&, , , , , .

Answer 1

, , HTMLLoader loadString? , img.

private var htmlLoader:HTMLLoader;
private function loadHtml(content:String):void
{
    htmlLoader = new HTMLLoader(); //Constructor
    htmlLoader.addEventListener(Event.COMPLETE, handleHtmlLoadComplete); //Handle complete
    htmlLoader.loadString(content); //Load html from string
}

private function handleHtmlLoadComplete(e:Event):void 
{
    htmlLoader.removeEventListener(Event.COMPLETE, handleHtmlLoadComplete); //Always remove event listeners!
    htmlLoader.width = htmlLoader.contentWidth; //Set width and height container
    htmlLoader.height = htmlLoader.contentHeight;
    addChild(htmlLoader); //Add to stage
}

Answer 2

html <showImage ..> , [showImage ..], , htmlString textField. xml, , y ( , ).

.

(ps HtmlLoader , )

Answer 3

myTextField.textHeight . , , , textHeight, .

- tMain - textField:

var iTextHeight: int = 0;
var sText: String = '<font size="30" color="#FF0000">When your only tool is a hammer, all problems start looking like nails.</font></br><i>99 percent of lawyers give the rest a bad name.</i><b>Artificial intelligence is no match for natural stupidity.</b><u>The last thing I want to do is insult you. But it IS on the list.</u></br><showimage=Images/image1.jpg> I don\'t have a solution, but I do admire the problem. The only substitute for good manners is fast reflexes. Support bacteria - they\'re the only culture some people have. </br>Letting the cat out of the bag is a whole lot easier than putting it back in. Well, here I am! What are your other two wishes?';
var aStringParts: Array = sText.split("<showimage=Images/image1.jpg>");
for (var i = 0; i < aStringParts.length; i++) {
    if (i == 0) {
        tMain.htmlText = aStringParts[i];
        trace("height of text: " + tMain.textHeight);
    } else {
        tMain.appendText(aStringParts[i]);
    }
}

sText gets split by the tag you are looking for (removes the text you are looking for and splits the remaining text into an array). The text leading to the tag is placed in a textField and tracked by textHeight. Then the rest of the text is placed in a textField. This gives you the pixel number y you need to organize things.

Let me know about any questions you have.