我有一个带有缩略图的 TileList。在每个缩略图图像下,我显示图像的名称。我想构建重命名功能。所以在 TileList 下是一个“重命名所选图像”按钮。
单击此按钮时,我想更改 itemRenderer 组件的状态。图像下方的标签将变为 TextInput,以便用户可以键入新名称。这很像 Windows 重命名文件功能。
如何访问所选图像的 itemRenderer?我怎样才能让它监听重命名按钮的点击事件?
一些代码:
<mx:TileList id="imageTileList" width="100%" height="100%" doubleClickEnabled="true"
itemsChangeEffect="{tileListEffect}" dataProvider="{images}"
keyDown="{tileListKeyDownHandler(event)}"
itemRenderer="com.n200.components.htmlElement.ImageTile"
columnWidth="128" rowHeight="128" itemDoubleClick="{insertImage()}"
horizontalScrollPolicy="off" verticalScrollPolicy="auto" />
<mx:LinkButton label="Rename selected image" labelPlacement="left"
enabled="{imageTileList.selectedIndex>0}"
styleName="rename24" click="{renameSelectedImage()}" />
<mx:Script>
<![CDATA[
private function renameSelectedImage():void
{
// Need to access itemRenderer of selected image here
}
]]>
</mx:Script>
itemRenderer 只是一个带有 mx:Image 和 mx:Text 的 mx:VBox。在另一个 mx:State 中,mx:Text 变为 mx:TextInput:
<mx:states>
<mx:State name="rename">
<mx:RemoveChild target="{imageName}" />
<mx:AddChild>
<mx:TextInput id="newName" text="{originalName}" keyDown="{textInputKeyDownHandler(event)}"
width="100%" focusOut="{commit()}" focusThickness="0" />
</mx:AddChild>
</mx:State>
</mx:states>
<enterComponents:P200Image source="{imgFunction?imgFunction.fileId:null}" width="82" height="82" verticalAlign="bottom" stretch="true" />
<mx:Text id="imageName" text="{imgFunction.name}" selectable="false" truncateToFit="true"
textAlign="center" width="82" toolTip="{imgFunction.name}" />