AS3 colorTransform over multiple frames?

Question

(Flash Professional, AS3)

I'm working on a custom avatar system where you can select various festures and colors. For example, I have a "hair" movieclip that has 10 hairstyles. Each frame has a movieclip of a different hairstyle (HairStyle1, HairStyle2, etc.). I also have a colorPicker to change the color.

Here's my code:

var hairColor:ColorTransform;
hairColor = mc_myAvatar.hair.colorLayer.transform.colorTransform; 
hairColor.color = 0xCCCC00; 
mc_myAvatar.hair.colorLayer.transform.colorTransform = hairColor;

This correctly changes the initial color. I have a "nextHair" button to advance mc_myAvatar.hair to the next frame. When I click the button, I get an error message saying that I have a null object reference. I added a trace, and mc_myAvatar.hair.colorLayer is null on frame 2. Why??? I've clearly named HairStyle2 as "colorLayer" in frame 2.

I think the problem is related to me using the same name for different classes/movieclips, but I don't know how to fix the problem...

I added a square movieclip below my hairStyle movieclips, named the square "colorLevel", and deleted the name from my hairStyle clips. When I click the next button, the square correctly maintains the color from frame to frame. However, having a square doesn't do me much good. :(

I tried converting the hairStyle layer to a mask. Doing this, however, results in yet another "null object" error - mc_myAvatar.hair.colorLayer is null after frame 1. I even tried "spanning" my colorLevel across all frames (no keyframes), thinking that this would give me just one movieclip to work with. No luck. Same error!

What's going on, here? Why am I getting these null objects, when they are clearly defined in my movieclip?

I'm also open to suggestions on a better way to do multiple frames and colors.

Answer 1

function miClick(e:MouseEvent) {
    content.gotoAndStop(e.currentTarget.parent.name);

    if(e.currentTarget.parent.name == "2") {
        content.addEventListener(Event.EXIT_FRAME, this.hdExitFrame);
        productMenu.alpha = 1;
        trace(content.products);
    } else {
        productMenu.alpha = 0;
    }
}

function hdExitFrame(e:Event) {
    trace(e.target.currentFrame + ", " + e.target.products);
    content.removeEventListener(Event.EXIT_FRAME, this.hdExitFrame);
}

I've tested this, content.products is null in miClick, however, in hdExitFrame, it was not. Hope this helps.