1

I've been using as3 for a lot of years but everytime I need to manipulate fonts I get crazy :(

My setup: I'm filling up via code a movieClip with a lot of dynamic textFields. Their values come from an external XML.

My problem: my client wants to insert html tags inside of the xml to have bold text in part of them. For example they want to have: "this string with this part bold". The Xml part is ok, formatted with CDATA and so on. If I trace the value coming from the xml is html, but it is shown as regular text inside the textfield....

The textfields are using client custom font (not system font), and have the font embedded via embedding dialog panel in Flash by the graphic designer.

Any help?

This is the part of code that fills up the textfields (is inside a for loop)

  var labelToWrite:String = labelsData.label.(@id == nameOfChildren)[VarHolder.activeLang];
    if (labelToWrite != "") {
        foundTextField.htmlText = labelToWrite; 
        // trace ("labelToWrite is -->" +labelToWrite);
    }

And the trace outputs me

 This should be <b>bold text with b tag</b> and this should be <strong>strong text </strong>.
Sr.Richie
  • 5,680
  • 5
  • 38
  • 62
  • might be a silly question, but are you setting the `textField.htmlText = ` instead of `textField.text = ` – BadFeelingAboutThis Sep 12 '12 at 23:21
  • you should post your relevant code, and at least a snippet of your xml – BadFeelingAboutThis Sep 12 '12 at 23:22
  • Likely problem is with the font. When you embed a font it doesn't always have a bold option. html text works best with system font. Try changing it to a system font like serif and see if that makes it work. Not a solution to your problem, but will narrow the cause – BadFeelingAboutThis Sep 12 '12 at 23:25

2 Answers2

2

Your code looks good. So the issue will be with the embedded Font. When you embed a font in flash, it doesn't embed any separate bold versions, so you may need to embed a bold version of your font.

Some resources: Flash CS4 <b> tag in with htmlText

I find that html text works best by using the style sheets to declare your fonts instead of text formats.

           var style:StyleSheet = new StyleSheet();
               style.setStyle(".mainFont", { fontFamily: "Verdana", fontSize: 50, color: "#ff0000"            } );
           var foundTextField:TextField = new TextField();
           foundTextField.embedFonts = true;
           foundTextField.autoSize = TextFieldAutoSize.LEFT;
           foundTextField.antiAliasType = AntiAliasType.ADVANCED;
           foundTextField.styleSheet = style;
           foundTextField.htmlText = "<div class=\"mainFont\">" + labelToWrite + "</div>";

See: flash as3 xml cdata bold tags rendered in htmlText with an embedded font

Other reasons maybe: Are you embedding the right type of font (TLF vs CFF)? If not using the flash IDE to make your textField, are you registering the font?

Font.registerFont(MyFontClass);
Community
  • 1
  • 1
BadFeelingAboutThis
  • 14,445
  • 2
  • 33
  • 40
  • thx, but the textfields are created by the graphic designer who designed all the stuff, and I checked and it embedded the regular when using regular, and the bold when using bold (in the same file) – Sr.Richie Sep 13 '12 at 00:53
  • but did you try not using an embedded font to see if that fixes the problem? – BadFeelingAboutThis Sep 13 '12 at 01:48
  • sorry I was in a hurry for deliver the beta and I skip this feature. I'm going to try with system fonts and I'll let you know. thx – Sr.Richie Sep 19 '12 at 14:24
  • I wasn't trying to suggest that changing it to a system font is the solution, only confirmation that the embedded font is the issue. – BadFeelingAboutThis Sep 19 '12 at 16:47
  • Did you try any of my other suggestions? StyleSheets, registering the font? – BadFeelingAboutThis Sep 19 '12 at 16:48
  • yes yes I know your proposal was for debugging. I'm trying with this one: http://stackoverflow.com/questions/2363903/flash-cs4-b-tag-in-with-htmltext and right now it's working, the only curious issue right now is that after the bold text it goes to a new line..... – Sr.Richie Sep 19 '12 at 16:52
  • I'm seeing it's a known problem: http://stackoverflow.com/questions/6489906/as3-bug-newline-automatically-entered-after-css-tag – Sr.Richie Sep 19 '12 at 17:03
0

You can work with embeded fonts in Animate graphic design. Just add fonts and create them with a class name.

At Adobe Animate objects library you can add and create fonts as class objects like this:

  • Select a font and styles to add

enter image description here

  • Assign a name and export as a Action Script Class

enter image description here

At code frame, you must add the fonts with same classes names created before:

var gothamMediumItalic = new GothamMediumItalic();
var formatMediumItalic:TextFormat = new TextFormat();
formatMediumItalic.font = gothamMediumItalic.fontName;

var gothamBookItalic = new GothamBookItalic();
var formatBookItalic:TextFormat = new TextFormat();
formatBookItalic.font = gothamBookItalic.fontName;

var gothamBoldItalic = new GothamBoldItalic();
var formatBoldItalic:TextFormat = new TextFormat();
formatBoldItalic.font = gothamBoldItalic.fontName;

this.embedFonts = true;
this.antiAliasType = AntiAliasType.ADVANCED;

Finally, you just need to use your box added as graphic object, and set format and content:

var yourText:String = "Some Text";
boxText.defaultTextFormat = formatBook; //My default text font style
boxText.text = yourText; //Full text in same format
boxText.setTextFormat(formatBookItalic,yourText.indexOf("<i>"),yourText.indexOf("</i>")); //Some text in another format found by custom chars

That works fine and lets you use less code and more interface options. I hope this could be usefull for someone.

Víctor
  • 493
  • 5
  • 7