Flex：tilelist中的图像切换位置答案

【问题标题】：Flex: image switching place in tilelistFlex：tilelist中的图像切换位置
【发布时间】：2009-10-26 21:18:33
【问题描述】：

我在 TileList 中遇到了一个关于 itemRenderers 的奇怪问题。

这是一个没有 itemRenderer 的工作示例：152.org/flex/

这是带有 itemRenderer 的损坏版本：152.org/brokenExample/
（我没有代表将这两个都设为链接）

两个示例都启用了“查看源代码”。

要使用损坏的示例查看问题，请选择一个相册并向下滚动一行。向上滚动，图像将被切换。如果您在工作示例上尝试此操作，则很好。

这似乎是一个广为人知的错误，但我找不到解决方案。

更新
我又开始玩这个例子，发现了别的东西。事实证明，您不必覆盖数据设置器。您可以在 itemRenderer 中创建一个新方法，该方法在磁贴想要刷新时设置。所以诀窍是不要依赖于 initialize 或 creationComplete 方法。

这就是我在应用程序中的 itemRenderer。

<itemRenderers:ImageTile img="{data}"/>

这是我在 itemRenderer 中的代码。

public function set img(value:String) : void {
  trace("setting source: " + value);
  this.source = value;
  this.name = value.toString().split("/").pop().split(".").shift();
}

I updated my example 反映这一变化。

【问题讨论】：

标签： apache-flex itemrenderer tilelist

【解决方案1】：

我手边没有您的应用程序，因此无法进行端到端测试，但我查看了您的源代码。您可能需要覆盖 itemRenderer 中的 data 设置器：

<?xml version="1.0" encoding="utf-8"?>
<mx:Image xmlns:mx="http://www.adobe.com/2006/mxml" initialize="init()">

 <mx:Script>
  <![CDATA[

   override public function set data(value:Object):void
   {
    super.data = value;
    this.source = data;
    this.name = data.toString().split("/").pop().split(".").shift();
   }

   private function init() : void {
    // Removed from your source and transplanted above
   }

  ]]>
 </mx:Script>

</mx:Image>

Flex 将尝试在列表中重用项目渲染器（这意味着您可能期望的生命周期事件——初始化、创建完成等——不会总是触发），所以如果你想确定你的渲染器当数据项更改时更新（就像发生滚动事件时一样），最佳实践是覆盖渲染器的数据属性。这很可能会解决问题。

【讨论】：

覆盖数据设置器就可以了。缺少的部分是将 super.data 设置为传入的值。一旦我这样做了，瓷砖就会正确显示。谢谢你的帮助！这已经让我绞尽脑汁将近一个月了。
啊，好点——我已经调整了我的答案以反映这一点。很高兴它有帮助！

【解决方案2】：

也许尝试在 creationComplete 时失效？

根据我对 DataGrids 的回忆（它的工作方式有点类似于 tilelist），当一个项目成为焦点时，它会重新创建。

<mx:itemRenderer>
  <mx:Image id="myImage" creationComplete="myImage.invalidate()" />
</mx:itemRenderer>

尚未尝试过此代码，但我认为这是您想要开始寻找的地方。我查看了您的 itemRenderer 组件。尝试用 creationComplete 代替 initialize 来调用你的函数

【讨论】：