Core Java| JSP| Servlets| XML| EJB| JEE5| Web Services| J2ME| Glossary| Questions?

 

 

 

 

 

 

 

 

 

 

 

 

 

Search Tutorials
Latest Questions
Comments
 
Flex Circle drawing example 
 

Example below draws a circle on the panel background of your application. Circle and its properties like color, size and dimensions will completely depend on you as here you are both the artist and the button operator.

 

Flex circle drawing example

                         

Example below draw circles on the panel background of your application. Circles drawn and its properties like color, size and dimensions will completely depend on you as here you are both the artist and the button operator. The circle is not a default feature, the instructions for drawing a circle is defined inside the Sprite class of flash.display package and so it has been imported in the application. The Sprite class elements demands UIComponent platform. In the program, we have used addChild function which is used by the UIComponents variable to call the sprite class variable inside them. 

In the program code, addChild function is been used by two components, first by an UIComponent variable regularObject  to call  the flash.Sprite variable circle inside it and second by a flex container Panel whose id is bond077,  to call the UIComponent variable regularObject inside it. 

In the program, a colorObject name variable is used which has value type Number. 

Within the action script portion of file, two packages have been imported namely:  flash.display and mx.core. This import is done to get Sprite and UIComponent classes instances. In the code, a geometrical figure is created and for creating this figure a Sprite type variable has been created.  Now graphics feature of Sprite class provides two methods: beginFill() and drawCircle(). Among these methods the first one fills color in the figure and the second one creates the figure. Now the Sprite variable is called inside the UIComponent variable through addChild function and  the UIComponent variable is called inside the panel container through the panel id. Here calling UIComponent variable inside the panel container means figures will form on the panel background.

circle.mxml

 

<?xml version = '1.0' encoding = 'ISO-8859-1'?>
<mx:Application xmlns:mx = 'http://www.adobe.com/2006/mxml' 
          creationComplete = 'mouseOverEvent()'>
  
  <mx:Script>
    
    <!-- flex packages -->
    
    import flash.display.Sprite;
    import mx.core.UIComponent;
    
    <!-- dimension variables -->
    
    public var x_axis:int = 0;  
    public var y_axis:int = 0;  
    public var z_axis:int = 0;
    
    
    <!-- 
      Defining functions for increasing and 
      decreasing the dimension variables values 
    -->
    
    public function Xdimension():void{
           x_axis = x_axis + 1;
    } 
    public function Ydimension():void{
        y_axis = y_axis + 1;  
    } 
    public function Zdimension():void{
        z_axis = z_axis + 1; 
    }
    
    public function minusXdimension():void{
        x_axis = x_axis - 1;
    }
    public function minusYdimension():void{
        y_axis = y_axis - 1;
    }
    public function minusZdimension():void{
        z_axis = z_axis - 1;
    }
    
    
    
    <!-- 
      Declaring color object for setting 
      colors to the figures 
    -->
    public var objectColor:Number;
    
    
    <!-- 
      creating functions for getting access
       to five different colors 
     -->  
      
      public function C0():void{
          objectColor = 0x6600FF;
      }
      public function C1():void{
          objectColor = 0xFF9900;
      }
      public function C2():void{
          objectColor = 0xCC00CC;
      }
      public function C3():void{
          objectColor = 0x99FF00;
      }
      public function C4():void{
          objectColor = 0x993300;
      }
    
    
    
    
    <!-- 
      creating function for creating required 
      figured variables 
    -->
    
    public function createCircle():void{
      
      <!-- a sprite type variable object -->
      
      var circle:Sprite;
        circle = new Sprite(); 
        
        circle.graphics.beginFill(objectColor);
        circle.graphics.drawCircle(x_axis, y_axis, z_axis);
    
      <!-- an UIComponent variable -->
      
        var regularObject:UIComponent;
            regularObject = new UIComponent();
            regularObject.addChild(circle);
    
        bond077.addChild(regularObject);
    }
    
  </mx:Script>
  


  <mx:Script>
    
    <!-- defining function for adding mouse over event over flex 
      button controls -->
    
    public function mouseOverEvent():void{
      b0.addEventListener(MouseEvent.MOUSE_OVER, task_0);    
      b1.addEventListener(MouseEvent.MOUSE_OVER, task_1);    
      b2.addEventListener(MouseEvent.MOUSE_OVER, task_2);    
      b3.addEventListener(MouseEvent.MOUSE_OVER, task_3);    
      b4.addEventListener(MouseEvent.MOUSE_OVER, task_4);    
    }

    
  <!-- functions for setting different text values to Label lb -->
  
    public function task_0(e:Event):void{
      lb.text = 'Blue-Violet';    
    }
    public function task_1(e:Event):void{
      lb.text = 'Intermediate (Red-Orange)';    
    }
    public function task_2(e:Event):void{
      lb.text = 'Secondary (Violet)';    
    }
    public function task_3(e:Event):void{
      lb.text = 'Intermediate (Yellow-Orange)';    
    }
    public function task_4(e:Event):void{
      lb.text = 'Intermediate (Red-Orange)';    
    }
    
  </mx:Script>


  
  <mx:Script>
  
    <!-- functions for getting dimension value details -->
    
    public function XDimensionDetails():void{
      txt_0.text = 'x axis :' + x_axis.toString();  
    } 
    public function YDimensionDetails():void{
      txt_1.text = 'y axis :' + y_axis.toString();  
    } 
    public function ZDimensionDetails():void{
      txt_2.text = 'z axis :' + z_axis.toString();  
    } 
    
  </mx:Script>
  
  
  <mx:Panel id = 'bond077' title = 'Choose appropriate dimension 
    select color and be a painter' width = '100%' 
    height = '100%' color = '#000066'/>

  
  
  
  <mx:Box>

       <mx:HBox>
            <mx:Button label = 'Execute' click = 'createCircle();' 
                x = '500' color = '#000000'/>
       </mx:HBox>
  
      <mx:HBox>
            <mx:Button label = '+ve x-axis' 
                click = 'Xdimension(); XDimensionDetails()'/>
            <mx:Button label = '+ve y-axis' 
                click = 'Ydimension(); YDimensionDetails()'/>
            <mx:Button label = '+ve z-axis' 
                click = 'Zdimension(); ZDimensionDetails()'/>
      </mx:HBox>
    
    <mx:HBox>
      <mx:TextArea id = 'txt_0' editable = 'false'/>
      <mx:TextArea id = 'txt_1' editable = 'false'/>
      <mx:TextArea id = 'txt_2' editable = 'false'/>
    </mx:HBox>
  
      <mx:HBox>
            <mx:Button label = '-ve x-axis' 
                click = 'minusXdimension(); XDimensionDetails()'/>
            <mx:Button label = '-ve y-axis' 
                click = 'minusYdimension(); YDimensionDetails()'/>
            <mx:Button label = '-ve z-axis' 
                click = 'minusZdimension(); ZDimensionDetails()'/>
      </mx:HBox>
  
  </mx:Box>


  <mx:HBox>
    <mx:Label text = 'Color picker Buttons' color = 'white'/>
  
    
    <mx:Button id = 'b0' label = 'C0' click = 'C0();'/> 
    <mx:Button id = 'b1' label = 'C1' click = 'C1();'/> 
    <mx:Button id = 'b2' label = 'C2' click = 'C2();'/> 
    <mx:Button id = 'b3' label = 'C3' click = 'C3();'/> 
    <mx:Button id = 'b4' label = 'C4' click = 'C4();'/> 
  </mx:HBox>

  <mx:Style>
    .weisz {color : #000000}
    Text {font-size : 18pt}
  </mx:Style>
  <mx:Text id = 'lb' styleName = 'weisz' />
  
</mx:Application> 

 

circle.swf

 

  

 

 

      

 

 

Download the code

                         

» View all related tutorials
Related Tags:

Leave your comment:

Name:

Email:

URL:

Title:

Comments:

Enter Code:
Audio Version
Reload Image
 

Note: Emails will not be visible or used in any way, and are not required. Please keep comments relevant. Any content deemed inappropriate or offensive may be edited and/or deleted.

No HTML code is allowed. Line breaks will be converted automatically. URLs will be auto-linked. Please use BBCode to format your text.
Add This Tutorial To:
  Del.icio.us   Digg   Google   Spurl   Blink   Furl   Simpy   Y! MyWeb 
Training Courses
Tell A Friend
Your Friend Name
Software Solutions
Least Viewed
Most Rated
Recently Viewed
Search Tutorials

 

 
 

Home | JSP | EJB | JDBC | Java Servlets | WAP  | Free JSP Hosting  | Search Engine | News Archive | Jboss 3.0 tutorial | Free Linux CD's | Forum | Blogs

About Us | Advertising On RoseIndia.net  | Site Map

India News

Indian Software Development Company | iPhone Development Company in India | Flex Development Company in India | Java Training Delhi | Java Training at Noida |

Send your comments, Suggestions or Queries regarding this site at roseindia_net@yahoo.com.

Copyright © 2008. All rights reserved.