1、Text控件

外观：

代码：

<?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">

    <fx:Script>

        <![CDATA[

            import mx.controls.Alert;

            public function showMsg(msg:String):void

            {

                Alert.show(msg);

            }

        ]]>

    </fx:Script>

    <s:Panel title="TextSample" verticalCenter="0" horizontalCenter="0">

        <s:layout>

            <s:VerticalLayout/>

        </s:layout>

        <s:Label text="TextInput" fontWeight="bold"/>

        <s:TextInput id="TextInput"/>

        <s:Label text="TextArea" fontWeight="bold"/>

        <s:TextArea id="TextArea" textAlign="center" width="100%" height="40"/>

        <s:Label text="RichTextEditor" fontWeight="bold" color="#ff0000"/>

        <mx:RichTextEditor id="RichTextEditor" height="150" width="650"

                           borderSkin="mx.skins.spark.BorderSkin" borderColor="0x000fff"/>

        <s:Label text="RichEditableText" fontWeight="bold"/>

        <s:RichEditableText textAlign="center" color="#127892" backgroundColor="0xfff000" width="100%">

            <s:content>

                Greetings <s:span fontWeight="bold" color="#ff0000">people</s:span> of<s:br/>

                <s:span fontSize="20">EARTH!</s:span>

            </s:content>

        </s:RichEditableText>

    </s:Panel>

</s:Application>

TextSample

2、Date控件

外观：

代码：

<?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">

    <fx:Script>

        <![CDATA[

            import mx.controls.Alert;

            public function showMsg(msg:String):void

            {

                Alert.show(msg);

            }

        ]]>

    </fx:Script>

    <s:Panel title="DateSample" verticalCenter="0" horizontalCenter="0">

        <s:layout>

            <s:VerticalLayout/>

        </s:layout>

        <s:Label text="DateField" fontWeight="bold" backgroundColor="0xff0022"/>

        <mx:DateField text="12/05/2008" id="thisDateField"

                      change="showMsg(thisDateField.selectedDate.toString())"/>

        <s:Label text="DateChooser" fontWeight="bold" backgroundColor="0xff0022"/>

        <mx:DateChooser id="thisDateChooser"

                        maxYear="2010" minYear="2006"

                        selectedDate="{new Date(2008,10, 15)}"

                        change="showMsg(thisDateChooser.selectedDate.toString())">

        </mx:DateChooser>

    </s:Panel>

</s:Application>

DateSample

3、Numeric控件

外观：

代码：

<?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">

    <fx:Script>

        <![CDATA[

            import mx.controls.Alert;

            public function showMsg(msg:String):void

            {

                Alert.show(msg);

            }

        ]]>

    </fx:Script>

    <s:Panel title="NumericSample" width="360" height="240" horizontalCenter="0" verticalCenter="0">

        <s:layout>

            <s:HorizontalLayout/>

        </s:layout>

        <s:VGroup>

            <s:Label text="NumericStepper" fontWeight="bold" backgroundColor="0xff0022"/>

            <s:NumericStepper id="kids"

                              minimum="0"

                              maximum="10"

                              stepSize="1"

                              change="showMsg(kids.value.toString())"/>

            <s:HGroup>

                <s:Label text="Spinner" fontWeight="bold" backgroundColor="0xff0022"/>

                <s:Spinner minimum="0" maximum="10" id="collegeKids"/>

                <s:Label text="{collegeKids.value} in college"/>

            </s:HGroup>

            <s:Label text="HSlider" fontWeight="bold" backgroundColor="0xff0022"/>

            <mx:HSlider id="commuteTimeRange" minimum="0" maximum="180"

                        tickInterval="15"

                        labels="[0 mins,180 mins]"

                        thumbCount="2" snapInterval="5"

                        change="showMsg(commuteTimeRange.values.toString())">

            </mx:HSlider>

        </s:VGroup>

        <s:VGroup>

            <s:Label text="VSlider" fontWeight="bold" backgroundColor="0xff0022"/>

            <mx:VSlider id="yourHeight" minimum="0" maximum="300"

                        tickInterval="50" snapInterval="1"

                        labels="[0,50,100,150,200,250,300]"

                        change="showMsg(yourHeight.values.toString())"/>

        </s:VGroup>

    </s:Panel>

</s:Application>

NumericSample

4、Button组件

外观：

代码：

<?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">

    <fx:Script>

        <![CDATA[

            import mx.controls.Alert;

            import mx.collections.ArrayCollection;

            [Bindable]

            public var myArray:ArrayCollection = new ArrayCollection(['One','Two','Three']);

            public function showMsg(msg:String):void

            {

                Alert.show('You just clicked on ' + msg);

            }

        ]]>

    </fx:Script>

    <s:Panel title="ButtonSample" width="360" height="240" horizontalCenter="0" verticalCenter="0">

        <s:VGroup>

            <s:Button id="thisBtn" label="Button" click="showMsg('button')"/>

            <mx:LinkButton id="thisLinkBtn" label="LinkButton"/>    

            <s:Label text="ButtonBar" fontWeight="bold" backgroundColor="0xff0022"/>

            <s:ButtonBar id="thisBtnBar" labelField="ButtonBar"

                         dataProvider="{myArray}"

                         click="showMsg(ButtonBar(event.currentTarget).selectedItem)" />

            <s:Label text="LinkBar" fontWeight="bold" backgroundColor="0xff0022"/>

            <mx:LinkBar id="thisLinkBar"

                        dataProvider="{myArray}"

                        itemClick="showMsg(event.label)" />

            <s:Label text="ToggleButtonBar" fontWeight="bold" backgroundColor="0xff0022"/>

            <mx:ToggleButtonBar id="thisToggleBar"

                                dataProvider="{myArray}"

                                itemClick="showMsg(event.label)"/>

        </s:VGroup>

    </s:Panel>

</s:Application>

ButtonSample

5、选单控件

外观：

代码：

<?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">

        <fx:Script>

        import mx.controls.Alert;

        public function showMsg(msg:String):void

        {

            Alert.show(msg);

        }

    </fx:Script>

    <fx:Declarations>

        <s:RadioButtonGroup id="Spam"

                            itemClick="showMsg('User picked ' +

                            event.currentTarget.selectedValue)"/>

    </fx:Declarations>

    <s:Panel width="400" height="150" title="SelecterSample" horizontalCenter="0" verticalCenter="0">

        <s:layout>

            <s:VerticalLayout/>

        </s:layout>

        <s:HGroup>

            <s:Label text="CheckBox" fontWeight="bold" backgroundColor="0xff0022"/>

            <s:CheckBox id="cbVideoGames" label="Video Games"

                        click="showMsg('Video Games is ' + cbVideoGames.selected)"/>

            <s:CheckBox id="cbFishing" label="Fishing"

                        click="showMsg('Fishing is ' + cbFishing.selected)"/>

        </s:HGroup>

        <s:HGroup>

            <s:Label fontWeight="bold" text="RadioButton" backgroundColor="0xff0022"/>

            <s:RadioButton id="rbYes" value="Yes" groupName="Spam"

                           click="showMsg('Yes')" label="Yes"/>

            <s:RadioButton id="rbNo" value="No" groupName="Spam"

                           click="showMsg('No')" label="No"/>

        </s:HGroup>

        <s:HGroup>

            <s:Label fontWeight="bold" text="DropDownList" backgroundColor="0xff0022"/>

            <s:DropDownList id="combo"

                            close="showMsg('Favorite car is ' +

                            event.currentTarget.selectedItem)" >

                <mx:ArrayCollection>

                    <fx:String>Ferrari</fx:String>

                    <fx:String>Porsche</fx:String>

                    <fx:String>Hyundai</fx:String>

                </mx:ArrayCollection>

            </s:DropDownList>

        </s:HGroup>

        <s:HGroup>

            <s:Label fontWeight="bold" text="ColorPicker" backgroundColor="0xff0022"/>

            <mx:ColorPicker id="clr"

                            change="showMsg('Color ' +

                            event.currentTarget.selectedColor)"/>

        </s:HGroup>

    </s:Panel>

</s:Application>

SelecterSample

最新文章

  1. 博客已经迁移至 http://barretlee.com/entry/，时而同步分享到这里
  2. ScrollView中嵌套GridView，ListView只显示一行的解决办法
  3. 最详细的hadoop2.2.0集群的HA高可靠的最简单配置
  4. Tourist.js – 简单灵活的操作指南和导航插件
  5. 國王遊戲（2012年NOIP全国联赛提高组）
  6. 如何将Android默认的Camra程序导入到eclipse中
  7. SQL Server调优系列基础篇 - 索引运算总结
  8. eclipse下开发简单的Web Service
  9. Mac下Qt连接MySQL 驱动问题
  10. linux下安装rabbitmq
  11. python 写的几道题
  12. Struts+jdbc+分页 实例
  13. vue-08-axios-get-post-跨域
  14. ES 插入十万条数据耗时1573秒
  15. Socket网络编程--小小网盘程序(1)
  16. ASP.NET Core 的Windows和IIS宿主(自动翻译记录)
  17. C#客户端嵌入Chrome浏览器的实现
  18. mysql事务（一）——redo log与undo log
  19. 移动端meta标签设置
  20. centos7 python3 安装

热门文章

  1. IOS网络开发（三）
  2. linux下安装memcache（php版本5.3）
  3. ubuntu15.10跑裸机程序跑.bin文件
  4. ucos3的配置文件
  5. odoo.cli.main()做了什么？
  6. 【转载】Hadoop机架感知
  7. SQL2000的三种“故障还原模型”
  8. 在浏览器中输入Google.com并且按下回车之后发生了什么（转载）
  9. SUSE Linux 13服务器版
  10. mac 10.9开启有道词典取词功能