flex小结12

来源:互联网 发布:淘宝nba旗舰店 编辑:程序博客网 时间:2020/12/04 04:33

1 richtexteditor控件
   import mx.controls.Button;
   
   /**
    * 初始化
    * */
   private function InitApp():void
   {
    // 创建一个“打印”按钮
    var but:Button = new Button();
    but.label = "打印";
    but.addEventListener("click",PrintDialog);
    // 添加“打印”按钮到工具栏中
    rte.toolbar.addChild(but);
   }
<mx:RichTextEditor id="rte" x="10" y="10" title="Title" width="451">

2 文本框/多行文本框中选定被选择的文本
  // 创建一个 TextRange 对象,获取选中的内容
    var mySelect:TextRange = new TextRange(txtSelected, true);
    lbSelected.text = mySelect.text;
其中txtselected为文本框的内容,如果要获得文本编辑器里的文本,则
lbSelected.htmlText = mySelected.htmlText;

3 一个文本编辑器例子
   <![CDATA[
   import mx.controls.Button;
   
   /**
    * 初始化,添加文本编辑器的设计和代码按钮
    * */
   private function InitApp():void
   {
    // 隐藏
    taHtmlEditor.visible = false;
    btnDesign1.visible = false;
    btnCode1.visible = false;
    
    // 创建设计按钮
    var btnDesign:Button = new Button();
    btnDesign.label = "设计";
    btnDesign.addEventListener(MouseEvent.CLICK, btnDesign_Click);
    
    // 创建代码按钮
    var btnCode:Button = new Button();
    btnCode.label = "代码";
    btnCode.addEventListener(MouseEvent.CLICK, btnCode_Click);
    
    // 添加两个按钮到文本编辑器的工具栏中
    rteHtmlEditor.toolbar.addChild(btnDesign);
    rteHtmlEditor.toolbar.addChild(btnCode);
   }
   
   /**
    * 设计按钮的单击事件
    * */
   private function btnDesign_Click(e:MouseEvent):void
   {
    // 设置 taHtmlEditor 不可见
    taHtmlEditor.visible = false;
    // 设置两个按钮不可见
    btnDesign1.visible = false;
    btnCode1.visible = false;
    // 设置 rteHtmlEditor 可见
    rteHtmlEditor.visible = true;
   }
   
   /**
    * 代码按钮的单击事件
    * */
   private function btnCode_Click(e:MouseEvent):void
   {
    // 设置 taHtmlEditor 可见
    taHtmlEditor.visible = true;
    // 设置两个按钮可见
    btnDesign1.visible = true;
    btnCode1.visible = true;
    // 设置 rteHtmlEditor 不可见
    rteHtmlEditor.visible = false;
   }
   
   /**
    * 设计界面 change 事件
    * */
   private function rteHtmlEditor_change():void
   {
    // 同步两个视图中的内容
    taHtmlEditor.text = rteHtmlEditor.htmlText;
   }
   
   /**
    * 代码界面 change 事件
    * */
   private function taHtmlEditor_change():void
   {
    // 同步两个视图中的内容
    rteHtmlEditor.htmlText = taHtmlEditor.text;
   }
  ]]>
 </mx:Script>
 <mx:RichTextEditor id="rteHtmlEditor" x="10" y="10" title="Title" width="757"

height="385"
  change="rteHtmlEditor_change()">
 </mx:RichTextEditor>
 <mx:TextArea id="taHtmlEditor" x="10" y="10" height="355" width="757"

change="taHtmlEditor_change()" fontSize="12"/>
 <mx:Button id="btnDesign1" x="654" y="373" label="设计" click="btnDesign_Click

(event)"/>
 <mx:Button id="btnCode1" x="710" y="373" label="代码" click="btnCode_Click(event)"/>

4 有图片的按钮
   <mx:Button x="40" y="33" label="有图片的按钮"
  icon="@Embed(source='assets/buttonIcon.jpg')" 
  fontSize="14"/>
5 复选框
  <mx:CheckBox x="56" y="37" label="足球" fontSize="14" change="checkBox_change(event)"/>
private function checkBox_change(e:Event):void
   {
    // 判断该项目是否选中
    if(e.target.selected)
    {
     // 获取选择的项目
     lbItems.text = lbItems.text + e.target.label + " ";
    }
6 设置弹出式菜单popupbutton
   private function initApp():void
   {
    // 创建一个菜单
    itMenu = new Menu();
    // 定义一个数组对象,作为数据源
    var dp:Object = [
         {label:"台式机"},
         {label:"笔记本"},
         {label:"打印机"},
         {label:"数码相机"}
        ];
    // 菜单对象与数据源绑定
    itMenu.dataProvider = dp;
    itMenu.addEventListener("itemClick", itemClickHandler);
    // 设置弹出的菜单
    puBtnIT.popUp = itMenu;
   }
   
   /**
    * 选择菜单事件
    * */
   private function itemClickHandler(event:MenuEvent):void
   {
    // 获取菜单选项内容
    var label:String = event.item.label;
    lbSelectItem.text = label;
    // 设置按钮标签内容,并关闭菜单
    puBtnIT.label = label;
    puBtnIT.close();
    // 设置菜单的索引为选项的索引值
    itMenu.selectedIndex = event.index;
   }
  ]]>
 </mx:Script>
 <mx:PopUpButton fontSize="14" id="puBtnIT" label="请选择产品类型"
  creationComplete="initApp()"  x="46" y="26" />
 <mx:Label id="lbSelectItem" x="206" y="32" text="没有选择任何类型" fontSize="14" />
7  在LIST中嵌入图片
   // 定义手机图标,并嵌入到程序中
   [Embed(source="assets/mobileIcon.jpg")]
   private var mobileSymbol:Class;

   /**
    * 初始化,绑定数据
    * */
   private function InitApp():void
   {
    // 定义数组
    var mobileArr:Array =
    [
     {mobileIcon:mobileSymbol, mobile:"摩托罗拉",

ballot:"12.9%"},.............................
8 获得combox的点击
    // 下拉列表控件的 change 事件
   private function cmbCity_change(event:Event):void
   {
    // 设置 lbCity 文本控件的内容
    lbCity.text = "城市编号:" +

event.currentTarget.selectedItem.data;
    lbCity.text += " 城市名称:" +

event.currentTarget.selectedItem.label;
   }
9 获得 datagrid的点击
    private function itemClickHandle(event:ListEvent):void
   {
    // 获取城市名称
    lbCity.text = event.currentTarget.selectedItem.city;
    // 获取人口
    lbPopu.text = event.currentTarget.selectedItem.population;
   }
  ]]>
 </mx:Script>

 <mx:DataGrid id="dg" x="36" y="28" itemClick="itemClickHandle(event)">
10 DATAGRID控件的排序
    <mx:RadioButtonGroup id="rbgCitySort" change="rbgCitySort_change(event)" />
 <mx:RadioButton id="rbByCity" x="39" y="24" label="按城市排序"
  groupName="rbgCitySort" fontSize="14"/>
 <mx:RadioButton id="rbByPopu" x="142" y="24" label="按人口排序"
  groupName="rbgCitySort" fontSize="14"/>
/**
    * 按照城市名称和人口排序
    * */
   private function rbgCitySort_change(event:Event):void
   {
    // 创建 Sort 对象
    var sortCity:Sort = new Sort();
    // 创建两个 SortField 对象,并设置参数
    var sortByCity:SortField = new SortField("city", true, true);
    var sortByPopu:SortField = new SortField("population", true,

true, true);
    // 获取单选按钮ID
    var sortId:String = event.target.selection.id;
    
    // 根据选择的类型,排序
    switch(sortId)
    {
     case "rbByCity":
      // 按城市排序
      sortCity.fields = [sortByCity];
      break;
     case "rbByPopu":
      // 按人口排序
      sortCity.fields = [sortByPopu];
      break;
     default:
      break;
    }
    
    // 排序
    cityArrColl.sort = sortCity;
    // 刷新数据集
    cityArrColl.refresh();
   }
  ]]>
  这里也演示了如何获得一个 radiobuttongroup中的某个单选按钮