1 Reply Latest reply on Jan 19, 2010 4:56 AM by RK...

    rectangles with colors

    venkateshk

      <mx:Canvas id="b1" x="10" y="10" height="40" width="300" borderStyle="solid" borderColor="black"/>

      to add rectangles side by side inside this canvas i wrote the following code

      for(var i:int=b1.x;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.drawRect(i,b1.y,15,b1.height);
                          this.addChild(line1);
                      }

      now I want to fill those rectangles with colored rectangles starting to ending

      i pass the units then units*15 will be calculated and the covered rectangles will be populated with colored rectangles for that i wrote the following code

                               var c:UIComponent = new UIComponent();
                              var xposstr:String = arr1.getItemAt(arr1.length).toString();
                              var xpos:int = parseInt(xposstr);
                             c.graphics.beginFill(0xFFCC00,1);
                              c.graphics.drawRect(xpos,0,numUnits*15,b1.height-2);
                              c.graphics.endFill();
                              b1.addChild(c);
                              arr1.addItem(c.x+numUnits*15);

      arr1 is the ArrayCollection

      but iam not getting the required output

        • 1. Re: rectangles with colors
          RK... Level 3

          This code draws rectangle (random background color),

           

          var colors: Array = [0x0000FF, 0x00FF00, 0xFF0000, 0xFF00FF]
          for(var i: int = 0; i < b1.width; i = i + 15) {
               var lineThickness1:Number = 1;
               var lineColor1:Number = 0x000000;
               var lineAlpha1:Number = 1;
               var bgColor: uint = colors[Math.floor(Math.random() * colors.length)];
          
               var g: Graphics = b1.graphics;
               g.lineStyle(lineThickness1,lineColor1,lineAlpha1);
               g.beginFill(bgColor, 1.0);
               g.moveTo(i, 0);
               g.drawRect(i, 0, 15, b1.height - 1);
               g.endFill();
          }