flex第一个应用

<?xml version="1.0"?>
<!-- Simple example to demonstrate the ColumnChart and BarChart controls. -->
<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" >
 <s:layout>
  <s:VerticalLayout/>
 </s:layout>
 <fx:Style source="Dom.css"/>
 <fx:Script>
  <![CDATA[
   protected function sendMessage(event:MouseEvent):void
   {
   var val:Object= new Object();
   val.sets = cbb.selectedItem.label;
   val.time = df.selectedDate.getTime();
   
  
   service.send(val);
   }
   
   import mx.collections.ArrayCollection;
   import mx.controls.Alert;
   import mx.events.CalendarLayoutChangeEvent;
   import mx.events.DropdownEvent;
   
   [Bindable]
   public var cards:ArrayCollection = new ArrayCollection(
    [ {label:"QQ", data:1},
     {label:"土豆视频", data:2},
     {label:"新闻", data:3},
     {label:"CCTV1", data:4},
     {label:"微博", data:5}]);
   
   [Bindable]
   private var date1:ArrayCollection = new ArrayCollection( [ 
    { message: "QQ", Gold: 35, Silver:39, Bronze: 29 },
    { message: "土豆视频", Gold: 32, Silver:17, Bronze: 14 },
    { message: "新闻", Gold: 27, Silver:27, Bronze: 38 },
    { message: "CCTV1", Gold: 27, Silver:27, Bronze: 38 },
    { message: "微博", Gold: 27, Silver:27, Bronze: 38 }]);
  ]]>
 </fx:Script>
 
 <fx:Declarations>
  
  <!-- 定义数据表静态数据-->
  <!--
  
  -->
  <!--远程数据连接,可以进行数据提交和数据查询获取-->
  
  <mx:HTTPService
   id="service"
   url="../config.xml"
   useProxy="false"
   fault ="" 
   result ="">
  </mx:HTTPService>
  
 </fx:Declarations>
 <s:Panel x="10" y="25" width="100%" height="100%">
  <!--label应用名称标签-->
  <s:Label x="150" y="50" text="应用名称" width="92" height="30" fontSize="20" color="#0B0B0B" fontFamily="中易宋体"/>
  
  <!--下拉菜单-->
  <s:ComboBox  width="150" id="cbb" x="246" y="50" height="30" dataProvider="{cards}"/>
  
  <!--label时间标签-->
  <s:Label x="620" y="50" text="时间" height="30" width="50" fontSize="20" color="#050505" fontFamily="中易宋体" fontWeight="bold"/>
  
  <!--时间选择表单-->
  <mx:DateField id="df" x="680" y="50" height="30"/>
  
  <!--button查询按钮-->
  <s:Button x="800" y="50" label="查询" height="30" color="#772E2E" click="sendMessage(event)"/>
  
  <!--二维数据表格-->
  <mx:DataGrid x="580" y="200" height="267" id="dg" width="325" dataProvider="{service.lastResult.message}">
   <mx:columns>
    <mx:DataGridColumn headerText="应用名称" dataField="name"/>
    <mx:DataGridColumn headerText="总流量"  dataField="phone"/>
    <mx:DataGridColumn headerText="总访问次数" dataField="countnum"/>
   </mx:columns>
  </mx:DataGrid>
  
  <!-- 柱状数据显示--> 
  <mx:ColumnChart x="150" y="200" id="columnchart1" width="350" height="267">
   <!--X轴标识名-->
   <mx:horizontalAxis>
    <mx:CategoryAxis dataProvider="{date1}" categoryField="message"/>
   </mx:horizontalAxis>
   <!--柱状图数据-->
   <mx:series>
    <mx:ColumnSeries displayName="Series 1"  dataProvider="{date1}" xField="message" yField="查询数据" />
   </mx:series>
   <!--X/Y轴横纵标识数据-->
   <mx:verticalAxis>
    <mx:LinearAxis minimum="4000.00" maximum="5000.00"/>
   </mx:verticalAxis>
   <mx:secondVerticalAxis>
    <mx:LinearAxis minimum="110" maximum="170"/>
   </mx:secondVerticalAxis>
   <!--折线数据展示-->
   <mx:secondSeries>
    <mx:LineSeries id="ls" displayName="Series 2" dataProvider="{date1}" yField=""/>
   </mx:secondSeries>
   
  </mx:ColumnChart>
  
  <mx:Legend dataProvider="{columnchart1}" x="485" y="127" height="60" width="88"/>
  
 </s:Panel>
 
</s:Application>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值