ItemRenderer对象更改属性

Question

模糊标题的道歉。我想不出用更少的话来说出更好的方法。

基本上，我正在创建一个自定义ItemRenderer（IR）。 IR的左侧有一个标签，右侧有一个图标。右侧的图标是动态的（可以是添加或删除图标，也可以是任何图标）。这工作很好，给我我需要的控制。

现在，问题是，当我在我的移动应用程序中滚动列表时，图标会改变。

应该怎么看：

如何它看起来通过拖动Test3的使用手指（或鼠标仿真器）滚动后：

正如你可以看到，图标改变，但标签不。我在我的Spark List组件上有dragEnabled，dropEnabled和dragMoveEnabled都设置为false。图标选择运行的唯一时间是creationComplete，所以在某个点上它没有办法选择不同的图标。我也可以验证数据本身是在发生这种变化后应该是什么。

下面是创建项目的MXML：用于选择

<s:HGroup width="100%" verticalAlign="middle" left="{this.sideSpacing}" right="{this.sideSpacing}" top="{this.sideSpacing}" bottom="{this.sideSpacing}"> 
    <s:Label id="text" width="100%"/> 

    <s:Image id="actionIcon" buttonMode="true" click="actionIconClick(event);"> 
     <s:filters> 
      <s:DropShadowFilter alpha=".45" angle="90" distance="3" blurX="3" blurY="3" quality="3"/> 
     </s:filters> 
    </s:Image> 
</s:HGroup> 

<s:Rect width="100%" height="1" bottom="0" alpha=".1"> 
    <s:fill> 
     <s:SolidColor color="#000000"/> 
    </s:fill> 
</s:Rect> 

而且可能过于复杂的AS3应显示的图标：

private function creationComplete(e:Event):void { 
    if (this.data.actionIcon != null) { 
     this.actionIconType = this.data.actionIcon; 
     if (this.data.actionIcon == ACTION_ICON_ADD) { 
      this.actionIcon.source = this.addBitmapSource; 
     } 
     else if (this.data.actionIcon == ACTION_ICON_REMOVE) { 
      this.actionIcon.source = this.removeBitmapSource; 
     } 
     else { 
      this.actionIcon.source = null; 
      this.actionIcon.visible = false; 
      this.actionIcon.includeInLayout = false; 
     } 
    } 
    else { 
     this.actionIcon.source = null; 
     this.actionIcon.visible = false; 
     this.actionIcon.includeInLayout = false; 
    } 
} 

什么可能会造成这个问题？

Answer 1

基本上，当dataChange事件触发时，您需要更新渲染器的标签和图标。 CreationComplete只会触发一次。该列表并未真正滚动，只是itemRenderer中的数据发生了变化;导致它看起来像滚动。我把这个渲染器称为回收。

这是我为移动应用程序创建的一个组件，它可以满足您的需求。它显示一个标签和一个图标（AKA装饰）。滚动标签和图标时都会更新。您可以使用非常类似的方法。

<?xml version="1.0" encoding="utf-8"?> 
<s:IconItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:s="library://ns.adobe.com/flex/spark" 
        dataChange="onDataChange(event)" alpha=".7" width="100%" cacheAsBitmap="true"> 
    <fx:Declarations> 
     <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations> 
    <fx:Script> 
     <![CDATA[ 
      import com.dotcomit.magondaMaze.managers.BoardDataManager; 
      import com.dotcomit.magondaMaze.managers.StatManager; 

      import mx.events.FlexEvent; 

      [Embed(source="assets/images/chooseLevel/completed78x78.png")] 
      private var completedImage:Class;        

      public var statManager :StatManager = StatManager.instance;  


      protected function onDataChange(event:FlexEvent):void 
      { 
       var itemAsXML :XML = data as XML; 
       var results :String = itemAsXML.@id + '. ' + itemAsXML.@title; 
       label = results; 
       if(statManager.isBoardComplete(itemAsXML.@id)){ 
        this.decorator = completedImage; 
       } else { 
        this.decorator = null; 
       } 
      } 
     ]]> 
    </fx:Script> 
</s:IconItemRenderer> 

我还会补充一点，IconItemRenderer组件 - 我的代码在上面扩展 - 设计用来完成你所需要的。所以，你可以不必重新写轮子说话。