TabNavigation in Flex

<?xml version="1.0"?>
<!-- Simple example to demonstrate the TabBar control. -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:Script>
        <![CDATA[

            import mx.events.ItemClickEvent;
            import mx.controls.TabBar;

            [Bindable]
            public var STATE_ARRAY:Array = [{label:"Alabama", data:"Montgomery"},
                {label:"Alaska", data:"Juneau"},
                {label:"Arkansas", data:"LittleRock"}
            ];
           
            private function clickEvt(event:ItemClickEvent):void {
                // Access target TabBar control.
                var targetComp:TabBar = TabBar(event.currentTarget);
                forClick.text="label is: " + event.label + ", index is: " +
                    event.index + ", capital is: " +
                    targetComp.dataProvider[event.index].data;
            }               
       ]]>
    </mx:Script>

    <mx:Panel title="TabBar Control Example" height="75%" width="75%"
        paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10">

        <mx:Label width="100%" color="blue"
            text="Select a tab to change the current panel."/>

        <mx:TabBar itemClick="clickEvt(event);">
            <mx:dataProvider>{STATE_ARRAY}</mx:dataProvider>
        </mx:TabBar>

        <mx:TextArea id="forClick" height="100%" width="100%"/>

    </mx:Panel>
</mx:Application>

DataGrid Using Flex

<?xml version="1.0"?>
<!-- DataGrid control example. -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:XMLList id="employees">
        <employee>
            <name>Christina Coenraets</name>
            <phone>555-219-2270</phone>
            <email>ccoenraets@fictitious.com</email>
            <active>true</active>
        </employee>
        <employee>
            <name>Joanne Wall</name>
            <phone>555-219-2012</phone>
            <email>jwall@fictitious.com</email>
            <active>true</active>
        </employee>
        <employee>
            <name>Maurice Smith</name>
            <phone>555-219-2012</phone>
            <email>maurice@fictitious.com</email>
            <active>false</active>
        </employee>
        <employee>
            <name>Mary Jones</name>
            <phone>555-219-2000</phone>
            <email>mjones@fictitious.com</email>
            <active>true</active>
        </employee>
    </mx:XMLList>

    <mx:Panel title="DataGrid Control Example" height="100%" width="100%"
        paddingTop="10" paddingLeft="10" paddingRight="10">

        <mx:Label width="100%" color="blue"
            text="Select a row in the DataGrid control."/>

        <mx:DataGrid id="dg" width="100%" height="100%" rowCount="5" dataProvider="{employees}">
            <mx:columns>
                <mx:DataGridColumn dataField="name" headerText="Name"/>
                <mx:DataGridColumn dataField="phone" headerText="Phone"/>
                <mx:DataGridColumn dataField="email" headerText="Email"/>
            </mx:columns>
        </mx:DataGrid>

        <mx:Form width="100%" height="100%">
            <mx:FormItem label="Name">
                <mx:Label text="{dg.selectedItem.name}"/>
            </mx:FormItem>
            <mx:FormItem label="Email">
                <mx:Label text="{dg.selectedItem.email}"/>
            </mx:FormItem>
            <mx:FormItem label="Phone">
                <mx:Label text="{dg.selectedItem.phone}"/>
            </mx:FormItem>
        </mx:Form>
       
    </mx:Panel>
</mx:Application>       

ComboBox using Flex

<?xml version="1.0"?>
<!-- Simple example to demonstrate the ComboBox control. -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;

            [Bindable]
            public var cards:ArrayCollection = new ArrayCollection(
                [ {label:"Visa", data:1},
                  {label:"MasterCard", data:2},
                  {label:"American Express", data:3} ]);
       
            private function closeHandler(event:Event):void {
                myLabel.text = "You selected: " +  ComboBox(event.target).selectedItem.label;
                myData.text = "Data: " +  ComboBox(event.target).selectedItem.data;
            }    
        ]]>
    </mx:Script>

    <mx:Panel title="ComboBox Control Example"
        height="75%" width="75%" layout="horizontal"
        paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10">

        <mx:ComboBox dataProvider="{cards}" width="150"
            close="closeHandler(event);"/>

        <mx:VBox width="250">
            <mx:Text  width="200" color="blue" text="Select a type of credit card."/>
            <mx:Label id="myLabel" text="You selected:"/>
            <mx:Label id="myData" text="Data:"/>
        </mx:VBox>        

    </mx:Panel>   
</mx:Application>      

Create alert using Flex

<?xml version="1.0"?>
<!-- Simple example to demonstrate the Alert control. -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:Script>
        <![CDATA[
            import mx.controls.Alert;
            import mx.events.CloseEvent;
       
            // Event handler function uses a static method to show
            // a pop-up window with the title, message, and requested buttons.       
            private function clickHandler(event:Event):void {
                Alert.show("Do you want to save your changes?", "Save Changes", 3, this, alertClickHandler);
            }
       
            // Event handler function for displaying the selected Alert button.
            private function alertClickHandler(event:CloseEvent):void {
                if (event.detail==Alert.YES)
                    status.text="You answered Yes";
                else
                    status.text="You answered No";
            }

            // Event handler function changes the default Button labels and sets the
            // Button widths. If you later use an Alert with the default Buttons,
            // you must reset these values.
            private function secondClickHandler(event:Event):void {
                Alert.buttonWidth = 100;
                Alert.yesLabel = "Magenta";
                Alert.noLabel = "Blue";
                Alert.cancelLabel = "Green";

                Alert.show("Select a color:","Color Selection",1|2|8,this);
               
                // Set the labels back to normal:
                Alert.yesLabel = "Yes";
                Alert.noLabel = "No";               
            }
        ]]>
    </mx:Script>

    <mx:Panel title="Alert Control Example" width="75%" horizontalAlign="center" paddingTop="10">
      <mx:Text width="100%" color="blue" textAlign="center"
          text="Click the button below to display a simple Alert window."/>
      <mx:Button label="Click Me" click="Alert.show('Hello World!', 'Message');"/>

      <mx:Text width="100%" color="blue" textAlign="center"
          text="Click the button below to display an Alert window and capture the button pressed by the user."/>
      <mx:Button label="Click Me" click="clickHandler(event);"/>
      <mx:Label id="status" fontWeight="bold"/>

      <mx:Text width="100%" color="blue" textAlign="center"
          text="Click the button below to display an Alert window that uses custom Button labels."/>
      <mx:Button label="Click Me" click="secondClickHandler(event);"/>
    </mx:Panel>

</mx:Application>