A simple calculator using Adobe Flash Builder 4.0

Flex SDK is a free and open source product and can be downloaded from adobe's site
Flex is developer centric and so it does not have timelines, animation, movie clips, etc as in Flash. Flex uses MXML for defining the UI and actionscript for programming.
Using Flex we can build AIR(desktop) applications as well as Flash (web/RIA) applications.

Flex Builder is a commercial IDE for developing flex applications.
Later during the launch of its Flex v4.0, Adobe rechristened Flex Builder as Flash Builder.

Flash Builder 4 Standard is available for free (if you are a student or unemployed developer or faculty/staff of eligible educational institutions) from adobe website.

But we got Flash Builder 4 as free for the purchase of Adobe Master Collection Creative Suite 5. It is simple and easy to use. I’ve tried a simple calculator application (flash) in FB4.

The process of how i build a simple calculator using Flash Builder is explained below,

First Run the Flash Builder 4 software
In that click File > New Flex Project

A 'New Flex Project' Dialog box’ll pop up
In that mention the Project name as xCalc
Leaving other settings to default
Application type - Web
Flex SDK version - Use default SDK (currently "Flex 4.0")
Server technology - None/Other
and then click finish.

The xCalc.mxml file will be opened in the Source view.
Click the Design tab button to toggle to the Design view.
From the components window drag and drop a BorderContainer control into the Design Area.
Place a TextInput control inside that and add Button controls for numbers 0-9, operators +,-,*,/,=. Name the objects as per your wish and set the relevant Labels for them in the properties window.

Right click the button labeled ‘0’ and select 'Generate Click Handler', this will take u to the auto generated event handler function in the code view. Change the method name as per your wish in the fx:Script block as well as in the Button object tag. Remaining things in the code listed below are self explanatory.

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
      xmlns:s="library://ns.adobe.com/flex/spark"
      xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" height="198" width="225">
 <fx:Script>
  <![CDATA[
   import mx.core.*;
   var str:String;
   var operator:String;
   var i:int=0; 
   protected function btn_0(event:MouseEvent):void{  
    txtBx1.text=txtBx1.text+"0";  
   }
   protected function btn_1(event:MouseEvent):void{
    txtBx1.text=txtBx1.text+"1";
   }
   protected function btn_2(event:MouseEvent):void{
    txtBx1.text=txtBx1.text+"2";
   }
   protected function btn_3(event:MouseEvent):void{
    txtBx1.text=txtBx1.text+"3";
   }
   protected function btn_4(event:MouseEvent):void{
    txtBx1.text=txtBx1.text+"4";
   }
   protected function btn_5(event:MouseEvent):void{
    txtBx1.text=txtBx1.text+"5";
   }
   protected function btn_6(event:MouseEvent):void{
    txtBx1.text=txtBx1.text+"6";
   }
   protected function btn_7(event:MouseEvent):void{
    txtBx1.text=txtBx1.text+"7";
   }     
   protected function btn_8(event:MouseEvent):void{
    txtBx1.text=txtBx1.text+"8";
   }
   protected function btn_9(event:MouseEvent):void{
    txtBx1.text=txtBx1.text+"9";
   }
   protected function btn_add(event:MouseEvent):void{    
    operator="add";
    str=txtBx1.text;
    txtBx1.text="";
   }
   protected function btn_sub(event:MouseEvent):void{    
    operator="sub";
    str=txtBx1.text;
    txtBx1.text="";
   }
   protected function btn_mul(event:MouseEvent):void{    
    operator="mul";
    str=txtBx1.text;
    txtBx1.text="";
   }
   protected function btn_div(event:MouseEvent):void{    
    operator="div";
    str=txtBx1.text;
    txtBx1.text="";
   }
   protected function btn_eq(event:MouseEvent):void{
    i=parseInt(str);
    switch(operator)
    {
     case "add":
     {
      i+=parseInt(txtBx1.text); 
      break;
     }
     case "sub":
     {
      i-=parseInt(txtBx1.text); 
      break;
     } 
     case "mul":
     {
      i*=parseInt(txtBx1.text); 
      break;
     }
     case "div":
     {
      if(parseInt(txtBx1.text)!=0)
              i/=parseInt(txtBx1.text);
      else
              i=0;
      break;
     }
    }
    txtBx1.text=i.toString();
    str="";
    operator="";
    i=0;
   }
   protected function btn_clr(event:MouseEvent):void{    
    txtBx1.text="";
    str="";
    operator="";
    i=0;
   }
  ]]>
 </fx:Script>
 <fx:Declarations>
 <!-- Place non-visual elements (e.g., services, value objects) here -->
 </fx:Declarations>
 <s:BorderContainer x="6" y="6" width="213" height="136">
 <s:TextInput x="4" y="3" width="202" height="23" id="txtBx1"/>
 <s:Button x="110" y="31" label="=" id="btn10" click="{btn_eq(event)}" fontSize="12" width="45" height="20"/>
 <s:Button x="57" y="31" label="CE" id="btn15" click="{btn_clr(event)}" fontSize="12" width="45" height="20"/>
 <s:Button x="161" y="31" label="+" id="btn11" click="{btn_add(event)}" fontSize="12" width="45" height="20"/>
 <s:Button x="161" y="56" label="-" id="btn12" click="{btn_sub(event)}" fontSize="12" width="45" height="20"/>
 <s:Button x="161" y="82" label="*" id="btn13" click="{btn_mul(event)}" fontSize="12" width="45" height="20"/>
 <s:Button x="161" y="109" label="/" id="btn14" click="{btn_div(event)}" fontSize="12" width="45" height="20"/>
 <s:Button x="4" y="31" label="0" id="btn0" click="{btn_0(event)}" fontSize="12" width="45" height="20"/>
 <s:Button x="4" y="56" label="1" id="btn1" click="{btn_1(event)}" fontSize="12" width="45" height="20"/>
 <s:Button x="56" y="56" label="2" id="btn2" click="{btn_2(event)}" fontSize="12" width="45" height="20"/>
 <s:Button x="110" y="56" label="3" id="btn3" click="{btn_3(event)}" fontSize="12" width="45" height="20"/>
 <s:Button x="4" y="82" label="4" id="btn4" click="{btn_4(event)}" fontSize="12" width="45" height="20"/>
 <s:Button x="56" y="82" label="5" id="btn5" click="{btn_5(event)}" fontSize="12" width="45" height="20"/>
 <s:Button x="110" y="82" label="6" id="btn6" click="{btn_6(event)}" fontSize="12" width="45" height="20"/>
 <s:Button x="4" label="7" id="btn7" click="{btn_7(event)}" fontSize="12" width="45" height="20" top="109"/>
 <s:Button x="56" label="8" id="btn8" click="{btn_8(event)}" fontSize="12" width="45" height="20" top="109"/>
 <s:Button x="110" label="9" id="btn9" click="{btn_9(event)}" fontSize="12" width="45" height="20" top="109"/>
 </s:BorderContainer>
 </s:Application>

Once the coding is finished, we can test the application by running the project.

We can run the project by Clicking Run > Run xCalc or by pressing Ctrl+F11.
It’ll pop up a browser window to display the application(swf file) which is embedded into the html page.