CS3 Component bug: Component Styles

I was reminded a few weeks ago by Phil Chung (of philterdesign fame) of a bug in the CS3 component framework which we encountered shortly after CS3 was released.

Basically it boils down to setting component-level styles before any components of that type have been created. The styles are created, but when the first component of that type is instantiated, it resets the component styles, and overwrites the changes that were made beforehand. Slap a button in the library of a new FLA, and add the following code:

import fl.controls.Button;
import fl.managers.StyleManager;
var tf:TextFormat = new TextFormat();
tf.color = 0xff0000;
StyleManager.setComponentStyle(Button, "textFormat", tf);
var b:Button = new Button();
addChild(b);

There is an easy workaround, which is to make sure you set component styles *after* a component of that type has been instantiated. You can also just create a dummy instance of the component, and destroy it (which properly creates the style definition) and eliminate the issue.

You can download this fix here. One thing to note is that the components do not compile based on the component source code that is included with CS3, but rather the compiled componentShim component included in each component. To use this updated class, drop it in the appropriate directory (fl/managers) relative to your project, or in any path that is part of your publish class paths. The components will prefer any class definition found locally over the componentShim.
Please note that this is not officially supported by Adobe, and we take no responsibility for its use.

So there you have it. I imagine at some point, an updated release of the components will solve this and other issues, but until then at least this issue is resolved.

Lanny McNie

As the dev mgr, Lanny oversees the technical day-to-day details of production and makes sure things get out the door.

@astrostyle

4 Comments

  1. I came across this independently recently, and found an alternate solution for those using Flex Builder for creating Actionscript projects. The core of the issue is in the Flash CS3 StyleManager class, which erases all styles if there isn’t a component. Creating a dummy component works, but if I remember correctly it needs to be rendered at least once. It can also cause “flashing” of the component.

    See linked URL.

  2. Thank you so much for this. I’ve spent a significant amount of time trying to figure out what I was doing wrong.

  3. Found this handy article: http://www.gskinner.com/blog/archives/2007/12/cs3_component_b.html

    Maybe you can tell me why flash doesn’t redraw components’ x,y positions if they have the same instance name and are on adjacent frames? If I have a button on frame 1 and a button on frame 2 both with the same instance name but different locations on the stage, frame 2’s button doesn’t show up in the position I placed it, it stays at the position of frame 1 but still has the properties of frame 2’s button. The label changes and everything. If I stick a button in between and give it a different instance name there is no problem. I tried your style manager and it didn’t seem to affect it but I think this is a different bug. This happens for textareas too and probably all components although I haven’t tried them.

    Thank you!

    // put this on frame 1 along with a button on the stage with instance name: b

    function btnClick(event) {

    trace(“button 1 clicked”);

    gotoAndStop(2);

    }

    b.addEventListener(MouseEvent.MOUSE_UP, btnClick);

    stop();

    // put another button on frame 2 along with this code and also make it’s instance name: b but move it so it’s not in the same x,y coordinates as the button on frame 1

    function btnClick2(event) {

    trace(“button 2 clicked”);

    gotoAndStop(1);

    }

    b.addEventListener(MouseEvent.MOUSE_UP, btnClick2);

    stop();

  4. I know this post is from 4 years back but it still saved my day.

    Thanks GSkinner 🙂

Leave a Reply

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