April 3rd, 2007 by Kyle
Tags: , , , , , , ,
Posted in: Flex Builder


Here is an example demonstrating how to use project references to refer to source files in other projects as well as swcs in other projects.

If you take a look at this zip file, you will find that it contains 3 projects.

The first project is a normal Flex project called globalIncludes which contains an actionscript file, vars.as.
A second project, Expando, is a library project, which contains an mxml component.

  • In the properties/Project References dialogue for this project there is a checked refererence to the globalIncludes project.
  • In the properties/sourcepath for this project, I have added the root folder from the globalIncludes project. (Just click the add Folder… button and navigate to the folder.) This folder is added as ${DOCUMENTS}\globalIncludes.

Now in your Expando project you can see a “virtual directory” from the globalIncludes project labeled – [source path] globalIncludes.

In my mxml component in the Expando project, I refer to the actionscript file from the globalIncludes project by doing an include:

    include "../globalincludes/vars.as";
 

Then in my component I use a variable defined in that vars,as actionscript file to expose a version number tooltip in my component.

Note:

In the Expando project, I have right clicked on the ExpandoComboBox.mxml and selected – “Include class in library”. That way, whenever I make changes to this component, the swc will be recompiled.

My third project, Sample, is a normal project that just has an application in it.

  • In the properties/Project References dialogue for this project there is a checked refererence to the Expando project.
  • In the properties/Flex Build Path/Library Path dialogue for this project, I have added the Expando Project (click Add Project… and you will be able to select the Expando project since it is in the list of Project references.)

Now you can launch the Sample.mxml application and see that the tooltip for the ExpandoComboBox is 1.0 which has come from the vars.as actionscript file in the globalIncludes project.




1 Comment »

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 »

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 »

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 »