posts - 247,  comments - 25,  trackbacks - 0
7.Event 事件:捕获,定位,冒泡
    键盘事件:
        private function trapKeys(event:KeyboardEvent):void{
            Alert.show("charCode:"+String(event.charCode)+" | keyCode:"+String(event.keyCode));
            Alert.show(event.currentTarget.name);
       }
 
         <mx:TextArea id="text_area" name="mytest" keyDown="trapKeys(event)"/>
8.Flex 可视化组件
        Flex中所有可视化组件都继承自UIComponent,当自定义组件时,应该扩展该类,该基类包括宽度,高度,双击事件,id属性,样式及x ,y
9.组件事件处理示例:
      <mx:Script>
  <![CDATA[
   import mx.controls.Alert;
   import mx.controls.List;
   private function handleChageEvent(event:Event):void
   {
    Alert.show("you select the name:"+List(event.currentTarget).selectedItem.label);
   }
  ]]>
 </mx:Script>
 <mx:List change="handleChageEvent(event)">
  <mx:dataProvider>
   <mx:Array>
    <mx:Object label="zhang san"/>
    <mx:Object label="li si"/>
    <mx:Object label="wang wu"/>
   </mx:Array>
  </mx:dataProvider>
 </mx:List>
10.组件行为:
    行为:触发器也效果的结合
<mx:Fade id="fadeInstance" alphaFrom="0" alphaTo="1" duration="1000"/>
 <mx:Button label="Fade Button" creationCompleteEffect="{fadeInstance}"/>
11.为了使用组件的x和y属性,子组件的父容器必须使用绝对定位,,默认情况下,Canvas容器使用绝对定位,但对于Application,Box,Panel容器,必须将layout设置为absolute
12.集合定义的方法:
        <mx:ArrayCollection id="myArrayCollection">
                <mx:source>
                        <mx:Array>
                                <mx:String>United states</mx:String>
                                <mx:String>South Africa</mx:String>
                                <mx:String>United kingdom</mx:String>
                        </mx:Array>
                </mx:source>
        </mx:ArrayCollection>
或着
        import mx.collections.ArrayCollection;
        [Bindable]
        public var myCollection:ArrayCollection = new ArrayCollection(["United states","South Africa","United kingdom"]);
或着
        public var myCollection:arrayCollection = new ArrayCollection();
        var myArray:Array = ["United states","South Africa","United kingdom"];
        myColleaction.source = myArray;
13.集合的接口
IList:以顺序方式组织项的集合,不支持排序过虑或指针
        适合于在集合的特定索引获取、设置、添加、删除项
                    在集合末尾添加一项
                    获取集合中项的索引
                    获取集合中项的总数
                    获取集合中所有的项
IcollectionView:基于数据集合的视图,支持排序过虑,而不修改底层数据,为了访问项,此接口提供对IViewCursor对象的访问
                            适合于通过修改视图来排序数据,或过滤显示项的子集,而不修改底层数据
                                        移动集合中的项,并使用书签保存项在集合中的位置
                                        显示最初可能不用的远程数据,或显示器显示不同时间的不同数据
IviewCursor:实现对于集合视图的双向枚举,指针提供了定位搜索和设置标签功能
var myArrayCollection:ICollectionView = new ArrayCollection([ "Bobby", "Mark", "Trevor", "Jacey", "Tyler" ]);
      var cursor:IViewCursor = myArrayCollection.createCursor();
      cursor.seek(CursorBookmark.last);
      while (!cursor.beforeFirst)
      {
          trace(current);
          cursor.movePrevious();
      }


ArrayCollection 和XMLListCollection 类都城实现了IList 和ICollectionView接口
public function sortCollection():void
   {
    var sort:Sort = new Sort();
    sort.fields = [new SortField("label", true, true)];
    myCollection.sort = sort;
    myCollection.refresh();
   }
   
   public function filterCollection():void
   {
    myCollection.filterFunction = stateFilterFunc;
    myCollection.refresh();
   }
   
   private function stateFilterFunc(item:Object):Boolean
   {
    return item.label >= "A" && item.label < "N";
   }
   
   private function resetCollection():void
   {
    myCollection.filterFunction = null;
    myCollection.sort = null;
    myCollection.refresh();
   }
   
  ]]>
 </mx:Script>
 
 <mx:ArrayCollection id="myCollection">
  <mx:Array>
   <mx:Object label="LA" data="Baton Rouge" />
   <mx:Object label="NH" data="Concord" />
   <mx:Object label="TX" data="Austin" />
   <mx:Object label="MA" data="Boston" />
   <mx:Object label="AZ" data="Phoenix" />
  </mx:Array>
 </mx:ArrayCollection>
 
 <mx:List dataProvider="{myCollection}" width="200" />
 <mx:Button label="Sort Collection" click="sortCollection()" />
 <mx:Button label="Filter Collection" click="filterCollection()" />
 <mx:Button label="Reset Collection" click="resetCollection()" />

14.集合变化引发事件
        IList  ICollectionView接口实现类的集合发生变化时,都会分派CollectionEvent类事件
        <mx:Script>
  <![CDATA[
  
   import mx.events.CollectionEventKind;
   import mx.events.CollectionEvent;
   import mx.collections.SortField;
   import mx.collections.Sort;
   import mx.collections.ArrayCollection;
   
   private var index:Number = 0;
   
   public function collectionChange(event:CollectionEvent):void
   {
    switch (event.kind)
    {
     case CollectionEventKind.ADD:
      myTextArea.text += "Item Added\n";
      break;
     case CollectionEventKind.REPLACE:
      myTextArea.text += "Item Replaced\n";
      break;
     case CollectionEventKind.REMOVE:
      myTextArea.text += "Item Removed\n";
      break;
    }
   }
   
   public function addItem():void
   {
    myCollection.addItem({label: myTextInput.text, data: index});
    index++;
   }
   
   private function updateItem():void
   {
    if (myList.selectedItem != null)
     myCollection.setItemAt({label: myTextInput.text, data: index}, myList.selectedIndex);
   }
   
   private function removeItem():void
   {
    if (myList.selectedItem != null)
     myCollection.removeItemAt(myList.selectedIndex);
   }
   
  ]]>
 </mx:Script>
 
 <mx:ArrayCollection id="myCollection" collectionChange="collectionChange(event)" />
 
 <mx:TextInput id="myTextInput" />
 <mx:List id="myList" dataProvider="{myCollection}" width="200" height="200" />
 <mx:Button label="ADD" click="addItem()" />
 <mx:Button label="UPDATE" click="updateItem()" />
 <mx:Button label="REMOVE" click="removeItem()" />
 <mx:TextArea id="myTextArea" width="200" height="200" />
posted on 2011-01-18 09:38 林的 阅读(197) 评论(0)  编辑  收藏 所属分类: flex

只有注册用户登录后才能发表评论。


网站导航:
 
<2011年1月>
2627282930311
2345678
9101112131415
16171819202122
23242526272829
303112345

想回家了,呵呵!

常用链接

留言簿(6)

随笔分类

随笔档案

文章分类

文章档案

相册

收藏夹

搜索

  •  

最新评论

阅读排行榜

评论排行榜