During the last fortnight I've needed to use htmlText with Flex 2. My needs were simple. But I still ran into lots of problems. As you probably know htmlText supports a subset of html elements (<p>,<a>, <b>, <i>, <u>, <img>, <br>, <font>). This short list can be enough for simple projects. But it's never as simple as it should be.
For future reference I offer the following list of problems I encountered using htmlText. The Flex documentation notes that the img element is not fully support and many of the problems below relate to images. Still displaying images in htmlText is too useful to ignore and so image problems are included in this list. I don't have many solutions and the ones I offer are hacks. But sometimes it's helpful to be forewarned.
- If you include more than one image and have text links within htmlText the links hit area is often too small. It is either a single pixel at the lower right edge of the text or a thin line below the text. The text itself doesn't act as a link. This problem may be cache related or relate to server response time as it may go away after frequent viewings.
- Text links often extend well beyond the end of the word. Typically they run the width of the component. But if you create a space below the link (i.e. <p> </p><br/>) then the entire space will act as a link.
- When using <font> within a list item to apply color to the text the color is inconsistently applied to the bullet. That is sometimes the bullet will be colored and sometimes it won't. This occurs infrequently and I can find no pattern to determine when it will occur.
- If an image is the last element in the htmlText the component may incorrectly measure the scroll height of the component. Consequently the scroll bar may not appear even though the image extends beyond the components bottom edge. This typically occurs when the component without the image wouldn't need to scroll. You may be able to work around this by including some text after the image and coloring the text the same as the background (i.e. <p><font color='#FFFFFF'>...</font></p>).
- If you want an image to occupy the entire width of the component you can try to force the text not wrap by setting a hspace value. But the component will always have a single character per line regardless of whether the characters are visible or not. Therefore it will appear that some characters are missing from the paragraph that follows the image. The workaround for this problem is the same as the previous problem. Except you need a character for each line the image requires.
Curious to hear any other htmlText problems you've found and even better any solutions you may have.