(see the original Mangled Kerning post)
We decided when we started this blog it wasn't going to be a bunch of whine, whine, whine such-and-such doesn't work. If we couldn't find a workaround of some sort, then we were just polluting the search space with more of the same "anyone else have an answer?" You may have dug through some of that to get here. There's value in seeing you're not the only one out there, but it's so limited we decided to avoid it if at all possible.
So. You've got an autosized textfield. You want to use Anti-alias for readability. But you've noticed strange spacing problems around HTML anchors. You've got a few options. I've come back to edit this post several times after seeing opportunities to achieve the same fix with less effort, but I'm preserving some of the more complex work-arounds because the bug is so quirky, someone might have need to try one of the uglier approaches.
1) After setting the htmlText, access the height property of the field, then it's safe to turn off autoSize which will allow correct kerning behavior:
var temp1 = (field.height) field.autoSize = TextFieldAutoSize.NONE
You won't have to wait additional frames or anything like that. Just remember to turn autoSize back on before changing the text.
2) Set the antiAliasType property of the TextField to flash.text.AntiAliasType.ADVANCED after the field has already been on the stage for at least two (count 'em: 2) frames. That's frame 3 if you're following along at home and your TextField was present on frame 1. Use the visible property to avoid epileptic seizures.
3) It would appear that only authoring-tool-placed TextFields require the extra 2 frames. Create a TextField from code, and you can set the antiAliasType property of the TextField to flash.text.AntiAliasType.ADVANCED in the next frame. Again, use the visible property to hide the layout jump:
var field = new TextField( 20, 20, 500, 1)
addChild(field)
field.embedFonts = true
field.multiline = true
field.wordWrap = true
field.autoSize = TextFieldAutoSize.LEFT
var styles = new StyleSheet();
styles.setStyle("p", {fontFamily: "HelveticaNeueLT Std Med Cn", fontSize: "18", kerning: false, letterSpacing: 0, color: '#CCCCCC'})
styles.setStyle("a", {textDecoration: 'underline', kerning: false, letterSpacing: 0, color: '#FFFFFF'} );
field.styleSheet = styles
field.htmlText = "<p>This top line is necessary to push the content down because that matters somehow in this simple example of <a href=\"http://nowhere.com\">Quirky</a> text in Flash.</p>"
//NEXT FRAME:
field.antiAliasType = flash.text.AntiAliasType.ADVANCED
4) If you must be a sadist, use a hybrid approach to replace authoring tool-placed TextFields with runtime-created TextFields while preserving position, dimensions, autoSizing, styles, etc. And after you've gone to all the trouble, don't forget to set the antiAliasType to advanced. If you're willing to let the original field handle the autoSizing, you can turn off autoSize on the dynamic field, size it according to the first field, and avoid having to wait a frame to set the antiAliasType as in #2. Just remember that if you need to change the field's contents, you'll have to turn autoSize back on. NOTE: Your mileage may vary, but I found that wordwrap was uneffected by this bug, so even though the kerning sometimes jumps around aggressively, I didn't find any changes in wordwrapping, thus no changes in sizing to worry about ... so far.
