如何在Flex DataGrid中使用Image作为选择和悬停背景?

时间:2010-12-13 07:24:58

标签: flex flash skinning

我想在Flex DataGrid 中的项目选择和悬停(鼠标悬停)中显示图像而不是颜色。我怎么能这样做?

2 个答案:

答案 0 :(得分:1)

您可以使用内联项呈示器或自定义项呈示器执行此操作。这是一个快速而肮脏的示例,说明如何使用内联项呈示器。您可能希望稍微调整一下以适合您的解决方案,但它应该为您提供一个良好的起点。

<mx:DataGrid dataProvider="{myDataProvider}">
        <mx:columns>
            <mx:DataGridColumn dataField="someDataField" width="100">
                <mx:itemRenderer>
                    <fx:Component>
                        <mx:Canvas mouseOver="myImage.visible = true" mouseOut="myImage.visible = false" width="100">
                            <mx:Label text="{data.someDataField}" width="100%" x="0" y="0" />
                            <mx:Image id="myImage" x="0" y="0" source="{outerDocument.myImageClass}" visible="false" />
                        </mx:Canvas>
                    </fx:Component>
                </mx:itemRenderer>
            </mx:DataGridColumn>
        </mx:columns>
    </mx:DataGrid>

答案 1 :(得分:0)

假设你有一个

<mx:image id="img" src="sample.jpg" mouseOver="onHover()" mouseOut="onOut()"/>

一个功能

private function onHover():void{
   img.src="sample2.jpg";
   img.validateNow();

}

private function onOut():void{
   img.src = "sample.jpg";
   img.validateNow();
}

看看这是否有效。尚未测试,但可能存在逻辑。