Comments on: Loading cascading style sheets on the fly using the Flex StyleManager class

By: Judah

Judah — Tue, 08 Mar 2011 08:59:04 +0000

Is it possible to load in a CSS file (not .swf) at runtime and get the same behavior? Using Flex Hero.

By: Anubhav Soni

Anubhav Soni — Fri, 18 Dec 2009 13:52:41 +0000

Thats a kool example,

thanks alot

By: Maverick

Maverick — Mon, 02 Nov 2009 15:44:08 +0000

I was receiving the error: Unable to load style(Error #2036: Load Never Completed.

The CSS that I wanted to use is named SimplicityGray.swf

in my application I set my style this way:
StyleManager.loadStyleDeclarations(‘simplicitygray.swf’,true);

I was struggling to determine why the CSS couldn’t be found. Then I realized the name is case-sensitive.
I solved the problem by using:
StyleManager.loadStyleDeclarations(‘SimplicityGray.swf’,true);

By: Matthew de Verteuil

Matthew de Verteuil — Fri, 24 Apr 2009 17:27:07 +0000

Trevor,

I was having the same issue as you, and in lieu of having to redo things with several Text in a mass hack effort I refused to give up on solving it.

All that aside, the solution to our problem was actually hidden what Mark said above.

It’s the creationPolicy and order of operations. My current set up is:

1. Initialize Preloader
2. Clear everything
3. Create Preloader Assets
4. Start loading (Progress events begin dispatching)
5. Complete event is heard
6. Load Styles (Style progress events begin dispatching)
7. Styles loaded event is heard
8. Invoke Application.application.createComponentsFromDescriptors() (initProgress dispatching now)
9. Init complete
…
11. Preloader dispatches complete event
12. Application displays (correctly now)

Hopefully, you are in a position where you can easily rearrange the order that the preloader is doing things.

Best,
Matthew

By: Trevor

Trevor — Mon, 13 Apr 2009 22:27:43 +0000

Have you had any problems with wrapping in text controls (mx.controls.Text) when loading css at runtime? Using this method it reduces all my text controls’ content to one line whether they have explicit htmltext line breaks or they have a fixed width to force them to wrap on their own. I haven’t been able to find a solid work around ANYwhere. It’s drivin me crazy. Some insight would be greatly appreciated.

Thanks,
Trevor

By: fly-in

fly-in — Mon, 02 Mar 2009 17:26:51 +0000

Cool I have been wondering how to get rif of that flicker.

Thanks guys!

By: Mark

Mark — Mon, 27 Oct 2008 05:13:49 +0000

Jai,

You can get around the flicker of the default theme by doing the following:

1) In your Application tag, set creationPolicy=”none”
2) Set a preinitialize handler in your Application tag
3) Have the preinit handler load in your css file and set an oncomplete handler for the file
4) In the oncomplete handler, put this line of code: createComponentsFromDescriptors();

In short, this stops your application rendering until the css file is loaded.

HTH,
Mark

By: Jai

Jai — Mon, 29 Sep 2008 07:40:20 +0000

Hi,

This is a great example. However, I see that that whenever I change the theme, the default theme shows up for a fraction of a second. Is there any way that can be removed. I want the transition to be smooth and direct. Please let me know if there is a solution to this.

cheers,

By: Benjamin

Benjamin — Tue, 27 May 2008 10:39:32 +0000

var myEvent:IEventDispatcher = StyleManager.loadStyleDeclarations("./css/stylz.swf");
myEvent.addEventListener(StyleEvent.COMPLETE,this.stylesLoaded);

By: Benjamin

Benjamin — Fri, 23 May 2008 12:23:30 +0000

I want to attach an event listener to know when the style is loaded. Problem is where to attach it?
Something like this:

myApplication.addEventListener(StyleEvent.COMPLETE,this.stylesLoaded);

function stylesLoaded(e:StyleEvent):void
{
   Do something...
}