Overlapping graphics

programming flash
1

Hi,

This code draws a template example.


//charmedV2
var charmedV2:Sprite = new Sprite();
with (charmedV2.graphics) {
    lineStyle();//removes line
    beginFill(0xd6b2d4, 1);
    drawRect(0,0,239,41);//header 
    beginFill(0xe2d3b2, 1);
    drawRect(0,42,239,248);//content background 
    beginFill(0x6d5636, 1);
    drawRect(0,42,42,248);//left bar
    lineStyle(1, 0xB29679);//
    moveTo(21,42);
    lineTo(21,290);// line behind white balls
    lineStyle();//removes line
    beginFill(0xFFFFFF, 1);
    drawCircle(22,60,14);//top circle 
    drawCircle(22,92,14);//middle circle 
    drawCircle(22,124,14);//fat bottom circle
    for (var iko:int = 48; iko < 290; iko++) {
        drawCircle(233,iko,5);//Little white balls
        iko += 11;
    };
    beginFill(0xd6b2d4, 1);
    drawRect(0,291,239,22);//footer
};
addChild(charmedV2);

I need to split the code up into sections so that each graphic can change colors. So I broke it out into individual vars, push the vars into an array, then iterate through the array adding the children to a holder mc. When I do this, for some reason, the overlapping graphics mask each other giving unwanted results. I don’t understand why this happening or how to fix it. Any help?


//populates holder with selection
stage.addEventListener(Event.ENTER_FRAME, placeChT, false, 0, true);

//vars for element COLORS
var chHolder:MovieClip = new MovieClip();
var chlf:ColorTransform = new ColorTransform();//left footer
var chh1:ColorTransform = new ColorTransform();//headline
var chheaderC:ColorTransform = new ColorTransform();//header Color

//vars for array template elements
var chheader:Sprite;
var chfootl:Sprite;

var chV2header:Sprite = new Sprite();
with (chV2header.graphics) {
    beginFill(0xd6b2d4, 1);
    drawRect(0,0,239,41);//header 
};

var chV2fl:Sprite = new Sprite();
with (chV2fl.graphics) {
    beginFill(0xd6b2d4, 1);
    drawRect(0,291,239,22);//footer
};

var chV2images:Sprite = new Sprite();
with (chV2images.graphics) {
    lineStyle(1, 0xB29679);//
    moveTo(21,42);
    lineTo(21,290);// line behind white balls
    lineStyle();//removes line
    beginFill(0xFFFFFF, 1);
    drawCircle(22,60,14);//top circle 
    drawCircle(22,92,14);//middle circle 
    drawCircle(22,124,14);//fat bottom circle
    for (var iku:int = 48; iku < 290; iku++) {
        drawCircle(233,iku,5);//Little white balls
        iku += 11;
    };
};

var chV2Content:Sprite = new Sprite();
with (chV2Content.graphics) {
    beginFill(0xe2d3b2, 1);
    drawRect(0,42,239,248);//content background 
};
var chV2LB:Sprite = new Sprite();
with (chV2LB.graphics) {
    beginFill(0x6d5636, 1);
    drawRect(0,42,42,248);//left bar 
};

var V2chTemp:Array = new Array();
V2chTemp.push({headish: chV2header, lb: chV2LB, footl: chV2fl, content1: chV2Content, images: chV2images});


//assembles the template
function placeChT(evt:Event):void{
    for (var i1:int = 0; i1 < V2chTemp.length; i1++) {
        chHolder.addChild(V2chTemp[i1].headish);
        chHolder.addChild(V2chTemp[i1].content1);
        chHolder.addChild(V2chTemp[i1].lb);        
        chHolder.addChild(V2chTemp[i1].images);
        chHolder.addChild(V2chTemp[i1].footl);
        //names the element so its color can be changed
        //the vars are defined on lines 14 - 15
        chheader = V2chTemp[i1].headish;
        chfootl = V2chTemp[i1].footl;
    }; 
    addChild(chHolder);
};