Flex 4项目管理员名单

Question

我刚开始使用Flex。我知道这很可悲，但这是一个漫长的故事。 现在，我面临的问题是我有一个列表组件，它上面有一个数据提供器。我想要做的是点击列表上的项目时，我想在标签旁边有一个检查标记。

以下是部分：

<s:List id="tabList" width="100%" 
         borderVisible="false" click="tabList_clickHandler(event)" 
         selectedIndex="{this.hostComponent.selectedIndex}" 
         itemRenderer="MultiTabListRenderer" /> 

下面的itemRenderer代码：

protected function AddCheck_clickHandler(event:MouseEvent):void { 
     // TODO Auto-generated method stub 
     var checkLabel:Label; 
     checkLabel = new Label(); 
     checkLabel.text = "checkMark"; 

     var e: ItemClickEvent = new ItemClickEvent(ItemClickEvent.ITEM_CLICK, true); 
     e.item = data; 
     e.index = itemIndex; 
     dispatchEvent(e); 
     this.checkRectGroup.addElementAt(checkLabel, e.index); 
    } 

<s:Label id="customMultitabList" text="{data.label}" 
      left="10" right="0" top="6" bottom="6" click="AddCheck_clickHandler(event)"/> 

我在函数内部代码是错误的，其主要是由于这样的事实，我不明白每一切都在弹性。我没有心情去详细学习这门语言，因为这对我来说不是一个长期的工作。另外，在渲染器文件中，当我使用s：List而不是s：label时，我再也看不到标签了。当然，我用dataprovider = {data.selectedItem}替换属性文本。

Answer 1

解决此问题的一种方法是向dataProvider中的对象添加一个字段，用于跟踪是否已选择该项目。

然后，在您的项目渲染器中，检查此字段并决定是否显示复选标记。这里有一个工作示例应用程序和渲染器：

应用：

<?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" minWidth="955" minHeight="600" xmlns:local="*" 
       creationComplete="application1_creationCompleteHandler(event)"> 
    <fx:Script> 
     <![CDATA[ 
      import mx.collections.ArrayCollection; 
      import mx.events.CollectionEvent; 
      import mx.events.CollectionEventKind; 
      import mx.events.FlexEvent; 
      import mx.events.PropertyChangeEvent; 
      import mx.events.PropertyChangeEventKind; 

      private var collection:ArrayCollection; 

      protected function application1_creationCompleteHandler(event:FlexEvent):void 
      { 
       collection = new ArrayCollection([ 
        { label: 1, selected: false }, 
        { label: 2, selected: false }, 
        { label: 3, selected: false }]); 

       listbert.dataProvider=collection; 
      } 

      protected function listbert_clickHandler(event:MouseEvent):void 
      { 
       var index:int = listbert.selectedIndex; 
       var item:Object = listbert.selectedItem; 
       item.selected = !item.selected; 
       // Create these events because the items in the ArrayCollection 
       // are generic objects. It shouldn't be necessary if items in 
       // your collection are a Class that extends EventDispatcher 
       // see ArrayList::startTrackUpdates() 
       var e:PropertyChangeEvent = new PropertyChangeEvent(
        PropertyChangeEvent.PROPERTY_CHANGE, false,false, 
        PropertyChangeEventKind.UPDATE, 'selected', !item.selected, 
        item.selected, item); 

       collection.dispatchEvent(new CollectionEvent(
        CollectionEvent.COLLECTION_CHANGE, false,false, 
        CollectionEventKind.UPDATE, index, index, [e])); 
      } 

     ]]> 
    </fx:Script> 

     <s:List id="listbert" click="listbert_clickHandler(event)" itemRenderer="TestRenderer"/> 
</s:Application> 

项渲染：

<?xml version="1.0" encoding="utf-8"?> 
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
       xmlns:s="library://ns.adobe.com/flex/spark" > 
    <fx:Script> 
     <![CDATA[ 

      override public function set data(value:Object):void 
      { 
       super.data = value; 
       labelDisplay.text = value.label; 
       if (value.selected) 
        checkMarkLabel.text = "✓"; 
       else 
        checkMarkLabel.text = ""; 
      } 
     ]]> 
    </fx:Script> 

    <s:layout> 
     <s:HorizontalLayout/> 
    </s:layout> 
    <s:Label id="labelDisplay" /> 
    <s:Label id="checkMarkLabel" /> 
</s:ItemRenderer>