0

I've been struggling with this problem for a while:

I have a string containing HTML and I'm using a regular expression to get the characters between the tags. I'm then attempting to apply a TextFormat to those characters.

The problem is that I'm using the TextField's "htmlText" property instead of it's "text" property (because I don't want the HTML tags to be visible). So, the character index that's returned from the regular expression is incorrect, when I apply the TextFormat.

Here is some sample code which illustrates the problem:

var txt:String = "<b>Sample</b> string with bold text";

var tf:TextField = new TextField();
addChild(tf);
tf.htmlText = txt;

var format:TextFormat = new TextFormat();
format.bold = true;

var regExp:RegExp = /<b>(.*?)<\/b>/g;
var match:Object = regExp.exec(txt);
while (match != null) {
    tf.setTextFormat(format, match.index, match.index + match[0].length);
    match = regExp.exec(txt);
}

This gives me:

"Sample string with bold text"

instead of the desired:

"Sample string with bold text"

because match[0].length is seven characters too long, due to the HTML tags <b></b>.

What can I do about this? Thanks!

MarkPlewis
  • 2,310
  • 1
  • 15
  • 13

2 Answers2

0
tf.setTextFormat(format, match.index, match.index + match[1].length);
Sam DeHaan
  • 10,246
  • 2
  • 40
  • 48
  • Great! Thank you. But `match.index` is still incorrect. Try the above solution with this string: `var txt:String = "Sample string with bold text and extra tags to make it longer";` This will give you: Sample string with bold text and extra tags to make it longer Because `match.index` is including the `` characters. – MarkPlewis Mar 01 '12 at 16:43
  • I apologize. I couldn't figure out how to use markdown to format this in a more readable way, and I'm not allowed to answer my own question. – MarkPlewis Mar 01 '12 at 16:50
  • That's going to be more difficult to address, for sure. Replacing `match.index` with `tf.text.indexOf(match[1])` will work, but only if each word is unique. You can do a liiittle better by storing each end index and making it `tf.text.indexOf(match[1],lastEndIndex)` but that's still not incredible. Will see what I can come up with. – Sam DeHaan Mar 01 '12 at 16:53
  • Have you looked at the answer to http://stackoverflow.com/questions/9502711/flash-is-ignoring-my-most-of-my-tags-in-a-html-textfield ? Not sure if you're using flex or straight flash. – Sam DeHaan Mar 01 '12 at 16:56
  • Also, this reference http://livedocs.adobe.com/flex/3/html/help.html?content=textcontrols_04.html from adobe may also help you render the html text properly. – Sam DeHaan Mar 01 '12 at 16:59
  • That should be fine for my purposes. I have control over the HTML string so I can ensure that there will only be one `` tag. Thank you! I'd be interested in seeing a more robust solution though, if you come up with something. – MarkPlewis Mar 01 '12 at 16:59
  • I'm using straight Flash. I believe the Flex framework includes a rich text editor component. I wish Adobe would port this over to pure Actionscript so we could use it in the Flash IDE! – MarkPlewis Mar 01 '12 at 17:02
0

Using TextField.htmlText, <b> tags should give bold text, without any need for TextFormat.bold or regexp, provided you embed the right fonts (or use device fonts).

But, I know there is sometimes issues with the HTML support in TextFields in combination with font handling, and perhaps your actual situation is more complex than the example with bold text. In that case I would recommend using StyleSheet formatting instead of the regexp/TextFormat combo. Besides the problem with offset mismatch that you have encountered, I believe that combining the two different approaches to text formatting - HTML and TextFormat - runs the risk of giving other problems, while using HTML text and StyleSheet are meant to be used together.

I started writing an example of using StyleSheet/htmlText, but since <b> should work anyway, without styling, it got a bit weird, so I scratched it. But let me know if you need example code.

Lars Blåsjö
  • 6,118
  • 2
  • 19
  • 23
  • Thanks. It's been years since I've imported CSS stylesheets into Flash, but I guess that's the only way. You're right, my situation is more complex than the example I posted. The formatting that's applied to the text between the tags could potentially be a completely different (embedded) font. Really, I could use any tag - it's just a wrapper to indicate that a different font or font weight should be applied to the text. The problem with using CSS is that both the CSS and the embedded font would have to be changed and kept in sync for everything to work properly, correct? I'll test it out. – MarkPlewis Aug 09 '12 at 23:48