Austin Kottke's Code Site

Thoughts about Architecture – Java, C/C++, JS, Objective-C, Swift, Groovy, Grails, (RIP Flash)

February 28th, 2007

Styling with CSS and XML – Actionscript translations

actionscript, flash, flex, xml, by austin.

One thing which I found in dealing with all of the flash 8 and flex projects is that in translations for styling of CSS and XML – I’ve found a pretty effective way to do this so that in projects you can have a stylesheet applied with variable font sizes and XML being parsed at the same time.

It starts out with the fact that you have a TextLoader class which loads in the text similar to:



public static function loadText( aStyleSheetPath:String, anInterfaceDir:String ):Void
{
Logger.log("INFO", TextLoader.toString() + " loading stylesheets and text.");
var styleSheetDir:String = aStyleSheetPath;
var interfaceDir:String = anInterfaceDir;
var currentLanguage:String = LanguageManager.getLanguage();
var cssFilePath:String = styleSheetDir + "stylesheet_" + currentLanguage + ".css" ;
var xmlFilePath:String = interfaceDir + "interface_" +currentLanguage+".xml";

/*---------------------------------------------------------------------
* Now we load in the stylesheet and once it is loaded we can then
* get the current interface and load this.
*---------------------------------------------------------------------*/

var stylesheet:TextField.StyleSheet = new TextField.StyleSheet();
stylesheet.load( cssFilePath );
stylesheet.onLoad = Delegate.create(TextLoader, function( status ) {
/*---------------------------------------------------------------------
* Once the stylesheet is loaded we then apply this to the text and
* then get it applied and the text loaded.
*---------------------------------------------------------------------*/

var interfaceTextXml:XML = new XML();
interfaceTextXml.ignoreWhite = true;
interfaceTextXml.load( xmlFilePath );
interfaceTextXml.onLoad = Delegate.create(TextLoader, function( isLoaded:Boolean ) {
if( isLoaded ) {
Logger.log("INFO", TextLoader.toString() + "Interface XML loaded ["+ xmlFilePath+"] " );
Logger.log("INFO", TextLoader.toString() + "StyleSheet CSS loaded ["+cssFilePath+"] " );
TextLoader.initialize(interfaceTextXml, stylesheet);
TextLoader.notifyListeners( new TextLoadedEvent() );
} else {
Logger.log("ERROR", TextLoader.toString() + "Unable to load xml ["+xmlFilePath+"] " );
}
});
});

}

This then loads in a stylesheet and an xml file. Then once the class loads I dispatch a notifyListeners event which then lets all other classes know that the stylesheet and xml are loaded.

I then make any listeners implement the right events.

The TextLoader class then has a method called renderText which then looks like the following:



public static function renderText( t:TextField, textFromXML:String, aTextId:String ):Void {
var cssEntry:String = "";
var defaultFont:String = "ID_DefaultFont";
t.styleSheet = styleSheet;

if( aTextId.indexOf("_he") == -1 )
{
t.embedFonts = true;
} else {
t.embedFonts = false;
}

t.html = true;
t.multiline= true;
/****************************************************************************
* Do a check if this particular class exists, if it doesn't then don't apply
* the class.
*************************************************************************/
cssEntry = ( styleSheet.getStyle( "."+ aTextId ) != undefined ) ? "class='"+aTextId+"'" : "" ;

/****************************************************************************
* Check if the active language is hebrew and forward this to the hebrew
* parsing engine to reverse the text.
*************************************************************************/
if( LanguageManager.getLanguage() == "he" )
{
t.embedFonts = false;
if( styleSheet.getStyle( "."+defaultFont ) && (styleSheet.getStyle( "."+ aTextId ) == undefined) ) {
t.htmlText = Hebrew.getConversion( textFromXML, t, defaultFont );
} else {
t.htmlText = Hebrew.getConversion( textFromXML, t, aTextId );
}
//Logger.log("DEBUG", "TextLoader().renderText - Hebrew ["+t.htmlText+"] ");
return;
}

// If there is a default font, set it to this but not if there is already
// a style defined.
if( styleSheet.getStyle( "."+defaultFont ) && (styleSheet.getStyle( "."+ aTextId ) == undefined) ) {
cssEntry = "class='"+defaultFont+"'";
}

t.htmlText = "

" + textFromXML + "

";
//Logger.log("INFO", "TextLoader().renderText - cssStyle ["+t.htmlText+"] ["+aTextId+"] ");
}

public static function getText( aTextId:String ):String {
return interfaceXML['idMap'][ aTextId ].firstChild.nodeValue.toString();
}


This allows for the renderText to then be used like TextLoader.renderText() which can then render the text applying the stylesheet similar to

— this then allows for a stylesheet to have an exact id applied to it.

This is pretty organized. Not bad a for a scientology coder, eh?

Please follow and like us:
0

Back Top

Responses to “Styling with CSS and XML – Actionscript translations”

  1. kl

    Anonymous at Reply

Leave a Reply

Your email address will not be published. Required fields are marked *

*