0

为模糊的标题道歉。我想不出更好的方式来用这么几句话来表达它。

基本上，我正在创建一个自定义 ItemRenderer (IR)。IR 在左侧有一个标签，在右侧有一个图标。右侧的图标是动态的（可以是添加或删除图标或什么都没有）。这很好用，让我可以控制它。

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

它应该看起来如何： 在此处输入图像描述

通过拖动 Test3 使用手指（或模拟器中的鼠标）滚动后的外观： 在此处输入图像描述

如您所见，图标会发生变化，但标签不会发生变化。我的 Spark List 组件上的dragEnabled、dropEnabled和dragMoveEnabled全部设置为 false 。图标选择运行的唯一时间是 on 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;
    }
}

什么可能导致此问题？

4

1 回答 1

3

基本上，当触发 dataChange 事件时，您需要更新渲染器的标签和图标。CreationComplete 只触发一次。列表并没有真正滚动，只是 itemRenderers 中的数据发生了变化；使它看起来像是在滚动。我称之为渲染器回收。

这是我为执行您想要的移动应用程序创建的组件。它显示一个标签和一个图标（又名装饰者）。滚动时，标签和图标都会更新。您可以使用非常相似的方法。

<?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 组件（我上面的代码扩展了它）旨在完全满足您的需求。所以，可以这么说，您可能不必重新编写轮子。

于 2013-01-04T22:21:06.383 回答