0

I need to create a slide left and slide right effect. This will be used on a panel when it is added to stage.

Also, the canvas I want to use the effect on has its height determined by the "top" and "bottom" properties, I heard this may cause issues when applying such an effect.

4

2 回答 2

1

您可能想查看名为 TweenMax 的东西:http: //www.greensock.com/tweenmax/ 它极大地简化了许多事物的动画,并且它有很多您期望的选项,例如缓入/缓出、onTween 事件/回调,完成回调等。

我不是 100% 确定你想要做什么,但理论上你会想要从屏幕上开始你的画布,然后做这样的事情:

TweenMax.to(theCanvas, 1.0, {x:0});

这行代码将告诉 TweenMax(通过静态函数“to”)开始一个补间(动画)。动画的目标是theCanvas,动画的持续时间是1.0秒,被动画的属性是x。在这种情况下,.x 从它当前的“到”0 开始动画。如果你写:

TweenMax.to(theCanvas, 1.0, {x:100});

然后画布将从当前位置动画到 .x = 100。请注意,如果您为“值”指定字符串

TweenMax.to(theCanvas, 1.0, {x:"100"});

这被视为增量 - 所以画布不会在 x = 100 处结束,而是在 x = originalX + 100 处结束。

就画布的高度而言,应该可以使用顶部和底部样式设置来限制高度,但我不能 100% 确定这一点……但是你会想要明确定义画布的宽度,因为您需要明确(绝对)定义 x 位置。

编辑

这是一个例子,我认为它涵盖了基础知识。请注意,滑块画布的高度由顶部和底部定义,没有问题。

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas 
    width="500" height="500"
    xmlns:mx="http://www.adobe.com/2006/mxml"
>
<mx:Script>
    <![CDATA[
        import com.greensock.TweenMax;

        private function slideIn():void
        {
            TweenMax.to(theSlider, 1.0, {x:50});
        }

        private function slideOut():void
        {
            TweenMax.to(theSlider, 1.0, {x:300});
        }

    ]]>
</mx:Script>

<mx:Button label="Slide In" click="{slideIn()}"/>
<mx:Button x="80" label="Slide Out" click="{slideOut()}"/>


<mx:Canvas id="theWindow" 
    width="300" height="300"
    verticalCenter="0" horizontalCenter="0"
    borderColor="red" borderThickness="1" borderStyle="solid"
    verticalScrollPolicy="off" horizontalScrollPolicy="off"
>

    <mx:Canvas id="theSlider" 
        width="200"
        x="-200"
        top="10" bottom="10"
        backgroundColor="green" backgroundAlpha="1.0"
        verticalScrollPolicy="off" horizontalScrollPolicy="off"
    />

</mx:Canvas>

</mx:Canvas>
于 2012-05-29T12:56:10.443 回答
0

这是我不久前做的一些你可以开始的东西,这是将它移到 4 的 Flex3 版本“滑动画布”。查看源在导出的右键菜单中启用:http: //www.shaunhusain.com/ImageSlider/(不要被它的名称混淆,它允许您向其中添加任何 UIComponent 我刚开始使用图像) . 我没有立即意识到通过 top 和 bottom 属性定义其大小的任何问题,但如果您遇到问题将这些问题发布为问题,则可能需要进行调整。

于 2012-05-21T23:09:37.910 回答