Flex显示/隐藏鼠标上/下

时间:2010-03-23 08:08:16

标签: flex mouseover

我有两个容器,一个在另一个上面,

我需要在

时显示第二个

第一个鼠标上方有一只鼠标 和 当它离开第一个时隐藏它

我也希望第二个容器内容可用(鼠标点击/移动)

我该怎么做?

2 个答案:

答案 0 :(得分:1)

Biroka有正确的想法,但还有另一种方式。将容器放在视图堆栈中并更改rollOver和rollOut上的selectedChild。这应该可以消除你的闪烁。这是一个功能齐全的样本

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init()">
    <mx:Script>
        <![CDATA[
            private function vsRollOver():void{
                viewstack1.selectedChild = container2;
            }
            private function vsRollOut():void{
                viewstack1.selectedChild = container1;
            }
        ]]>
    </mx:Script>

    <mx:ViewStack x="10" y="10" id="viewstack1" width="200" height="200" rollOver="vsRollOver();" rollOut="vsRollOut();">
        <mx:Canvas id="container1" label="View 1" width="100%" height="100%" backgroundColor="0x0000ff">
        </mx:Canvas>
        <mx:Canvas id="container2" label="View 2" width="100%" height="100%" backgroundColor="0xff0000">
        </mx:Canvas>
    </mx:ViewStack>
</mx:Application>

答案 1 :(得分:0)

第二个容器必须高于第一个容器并且:

private function init():void // call this on creationComplete event
{
    container2.visible = false;
     container1.addEventListener(MouseEvent.ROLL_OVER,overFunction);
     container1.addEventListener(MouseEvent.ROLL_OUT,outFunction);
 }   

private function overFunction(e:MouseEvent):void
{
    container2.visible = true;
}

private function outFunction(e:MouseEvent):void
{
    container2.visible = false;
}

我建议container1应该比container2大1-2个像素