1 Reply Latest reply on Jan 21, 2010 7:01 AM by Gregory Lafrance

    how to highlighting

    venkateshk Level 1

      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
           backgroundImage="images.jpeg" creationComplete="cc()">
          <mx:Script>
              <![CDATA[
                  import mx.controls.Alert;
                  import mx.containers.Box;
                  private var box:Box;
                  private var arr:Array;
                  private function cc():void{
                      var count:int = Math.floor(hb1.width / 15);
                       for(var i:int=0;i<count;i++)
                      {
                          box = new Box();
                          box.width=15;
                          box.height = hb1.height-2;
                          box.setStyle("borderStyle","solid");
                          box.setStyle("borderColor","black");
                          hb1.addChild(box);
                      }
                      for(i=15;i<=hb2.width;i=i+15)
                      {
                          box = new Box();
                          box.width=15;
                          box.height = hb2.height;
                          box.setStyle("borderStyle","solid");
                          box.setStyle("borderColor","black");
                          hb2.addChild(box);
                      }
                      for(i=15;i<=hb3.height;i=i+15)
                      {
                          box = new Box();
                          box.width=hb3.width;
                          box.height = 15;
                          box.setStyle("borderStyle","solid");
                          box.setStyle("borderColor","black");
                          hb3.addChild(box);
                      }
                      for(i=15;i<=hb4.width;i=i+15)
                      {
                          box = new Box();
                          box.width=15;
                          box.height = hb4.height;
                          box.setStyle("borderStyle","solid");
                          box.setStyle("borderColor","black");
                          hb4.addChild(box);
                      }
                      for(i=15;i<=hb5.width;i=i+15)
                      {
                          box = new Box();
                          box.width=15;
                          box.height = hb5.height;
                          box.setStyle("borderStyle","solid");
                          box.setStyle("borderColor","black");
                          hb5.addChild(box);
                      } 
                  }
              ]]>
          </mx:Script>
         
          <mx:HBox id="hb1" width="210" height="50" x="40" y="40" horizontalGap="0"/>
          <mx:HBox id="hb2" width="210" height="60" x="40" y="92" horizontalGap="0"/>
          <mx:VBox id="hb3" width="50" height="210" x="400" y="40" verticalGap="0"/>
          <mx:HBox id="hb4" width="210" height="50" x="600" y="200" horizontalGap="0" rotation="45"/>
          <mx:HBox id="hb5" width="210" height="50" x="550" y="230" horizontalGap="0" rotation="45"/>
      </mx:Application>

      it's giving the HBoxes and VBox with Boxes filling inside

      what I want is that when i click on particular child(i.e Box) of the hb1 that is only need to be hilight with color

      please............ help me

        • 1. Re: how to highlighting
          Gregory Lafrance Level 6

          This solves your problem:

           

          <?xml version="1.0" encoding="utf-8"?>
          <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
          creationComplete="cc()">
              <mx:Script>
                  <![CDATA[
                      import mx.controls.Alert;
                      import mx.containers.Box;
                      private var box:Box;
                      private var arr:Array;
                      private function cc():void{
                          var count:int = Math.floor(hb1.width / 15);
                           for(var i:int=0;i<count;i++)
                          {
                              box = new Box();
                              box.width=15;
                              box.height = hb1.height-2;
                              box.setStyle("borderStyle","solid");
                              box.setStyle("borderColor","black");
                              box.addEventListener(MouseEvent.CLICK, changeBG);
                              hb1.addChild(box);
                          }
                          for(i=15;i<=hb2.width;i=i+15)
                          {
                              box = new Box();
                              box.width=15;
                              box.height = hb2.height;
                              box.setStyle("borderStyle","solid");
                              box.setStyle("borderColor","black");
                              box.addEventListener(MouseEvent.CLICK, changeBG);
                              hb2.addChild(box);
                          } 
                          for(i=15;i<=hb3.height;i=i+15)
                          {
                              box = new Box();
                              box.width=hb3.width;
                              box.height = 15;
                              box.setStyle("borderStyle","solid");
                              box.setStyle("borderColor","black");
                              box.addEventListener(MouseEvent.CLICK, changeBG);
                              hb3.addChild(box);
                          } 
                          for(i=15;i<=hb4.width;i=i+15)
                          {
                              box = new Box();
                              box.width=15;
                              box.height = hb4.height;
                              box.setStyle("borderStyle","solid");
                              box.setStyle("borderColor","black");
                              box.addEventListener(MouseEvent.CLICK, changeBG);
                              hb4.addChild(box);
                          } 
                          for(i=15;i<=hb5.width;i=i+15)
                          {
                              box = new Box();
                              box.width=15;
                              box.height = hb5.height;
                              box.setStyle("borderStyle","solid");
                              box.setStyle("borderColor","black");
                              box.addEventListener(MouseEvent.CLICK, changeBG);
                              hb5.addChild(box);
                          }  
                      }
                      
                      private function changeBG(evt:MouseEvent):void{
                        if(evt.currentTarget.getStyle("backgroundColor") != 0xFF0000){
                          evt.currentTarget.setStyle("backgroundColor", 0xFF0000);                
                        }else{
                          evt.currentTarget.setStyle("backgroundColor", null);
                        }
                      }
                  ]]>
              </mx:Script>
              
              <mx:HBox id="hb1" width="210" height="50" x="40" y="40" horizontalGap="0"/>
              <mx:HBox id="hb2" width="210" height="60" x="40" y="92" horizontalGap="0"/>
              <mx:VBox id="hb3" width="50" height="210" x="400" y="40" verticalGap="0"/>
              <mx:HBox id="hb4" width="210" height="50" x="600" y="200" horizontalGap="0" rotation="45"/>
              <mx:HBox id="hb5" width="210" height="50" x="550" y="230" horizontalGap="0" rotation="45"/>
          </mx:Application>
          


          If this post answers your question or helps, please mark it as such.


          Greg Lafrance - Flex 2 and 3 ACE certified

          www.ChikaraDev.com

          Flex / AIR Development, Training, and Support Services