How to fill canvas with lines

Question

<mx:Canvas id="b1" x="10" y="10" height="40" width="300" borderStyle="solid" borderColor="black"/>
when i want to draw lines with 15 pixels gap to fill the entire canvas i wrote as follows
               for(var i:int=b1.x+15;i<b1.x+b1.width;i=i+15)
                    var line1:UIComponent = new UIComponent();
                    var lineThickness1:Number = 1;
                    var lineColor1:Number = 0x000000;
                    var lineAlpha1:Number = 1;
                    line1.graphics.lineStyle(lineThickness1,lineColor1,lineAlpha1);
                    line1.graphics.moveTo(i,b1.y);
                    line1.graphics.lineTo(i,b1.y+b1.height);
                    this.addChild(line1);
it's working fine
lly,
<mx:Canvas id="b4" x="600" y="200" height="60" width="300" borderStyle="solid" borderColor="black" rotation="40"/>
I have the above canvas with id 'b4' only difference is that this canvas has the rotation
how to fill this canvas with lines just i did above?

Answer 1

Hope this code will help you,
for(var i: int = 15; i < b4.width; i = i + 15) {
     var line1: UIComponent = new UIComponent();
     var lineThickness1: Number = 1;
     var lineColor1: Number = 0x000000;
     var lineAlpha1: Number = 1;
     line1.graphics.lineStyle(lineThickness1, lineColor1, lineAlpha1);
     line1.graphics.moveTo(i, 0);
     line1.graphics.lineTo(i, b4.height - 1);
     //Add line in canvas instead of main container
     b4.addChild(line1);
<mx:Canvas id="b4" x="600" y="200" height="60" width="300" borderStyle="solid" borderColor="black" rotation="40"/>