Flex Monkey Patches

ActionScript (40) Air (23) BlazeDS (9) BlogReview (1) ColdFusion (6) Flash Player (31) Flex (105) Flex Builder (6) LCDS (21) RubberneckersReview (33) Uncategorized (17)

Using Runtime CSS to Change embedded True Type fonts at Runtime in Flex Applications

This is installment 3 in the series.
The previous 2 related posts are:

Changing embedded True Type fonts at Runtime in Flex Applications

Using Modules to Change embedded True Type fonts at Runtime in Flex Applications

This approach is a little different.
The application is very similar, but instead of using a loader or module loading, I use the StyleManager to load a runtime CSS swf (which was compiled from a CSS file).

Here is one of the style sheets that is tuned into a CSS swf:

/* CSS file */
@font-face {
    src:url("assets/arial.ttf");
    fontFamily: myFont;
}

@font-face {
    /* Note the different filename for boldface. */
    src:url("assets/arialbd.ttf");
    fontFamily: myFont; /* Notice that this is the same alias. */
    fontWeight: bold;
}

@font-face {
    /* Note the different filename for italic face. */
    src:url("assets/ariali.ttf");
    fontFamily: myFont; /* Notice that this is the same alias. */
    fontStyle: italic;
}
 
@font-face {
    /* Note the different filename for bold-italic face. */
    src:url("assets/arialbi.ttf");
    fontFamily: myFont; /* Notice that this is the same alias. */
    fontWeight: bold;
    fontStyle: italic;
}

.myPlainStyle {
    fontSize: 11;
    fontFamily: myFont;
 }
 
.myBoldStyle {
    fontSize: 11;
    fontFamily: myFont;
    fontWeight: bold;
}

.myItalicStyle {
    fontSize: 11;
    fontFamily: myFont;
    fontStyle: italic;
}

.myBoldItalicStyle {
    fontSize: 11;
    fontFamily: myFont;
    fontWeight: bold;    
    fontStyle: italic;
}
 

Read the rest of this post»



2 Comments »

Using Modules to Change embedded True Type fonts at Runtime in Flex Applications

This is really part 2 in the series. Part 1 was Changing embedded True Type fonts at Runtime in Flex Applications

The interface that I have each font swf implementing is the same, so I have not posted the code.

The application has undergone some slight refactoring and I have added a few things.
I chose to use the ModuleManager.getModule(url) rather than using the mx:ModuleLoader tag.
The module Manager was more flexible and really should be used for loading non-visual modules.

Note the way that you get access to the loaded module after it has loaded:

 var ml:IModuleInfo = e.target as IModuleInfo;
 loadedFont = ml.factory.create()as IFontModule;
 

Read the rest of this post»



No Comments »

Changing embedded True Type fonts at Runtime in Flex Applications

I’ve had a few customers ask me how they can switch out embedded fonts at runtime. This really isn’t too difficult and basically involves loading swfs at runtime that have the appropriate fonts embedded within.
You register the font after the “font swf” is loaded and apply the newly loaded font to whatever components you like. Check out the code and comments below.

First I define an interface that I want all my font swf classes to implement so I know how to determine what font(s) are loaded.

IFontModule.as:

package
{
    public interface IFontModule
    {
        function get fontName_Normal():String;
        function get fontName_Bold():String;
        function get fontName_Italic():String;
        function get fontName_BoldItalic():String;
    }
}

Read the rest of this post»



5 Comments »

Kyle Quevillon's Facebook profile
follow turdontherun at http://twitter.com
View Kyle Quevillon's profile on LinkedIn email address


Syndication
RSS Comments RSS Rubbernecker's Reviews RSS

Archives