如何在 Flex 4.5 应用程序中为 MovieClips 使用 Tween？答案

【问题标题】：How to use Tween for MovieClips in a Flex 4.5 application?如何在 Flex 4.5 应用程序中为 MovieClips 使用 Tween？
【发布时间】：2011-08-24 10:49:02
【问题描述】：

我是 Flex 新手，正在尝试将纯 Flash/AS3 card game 移植到 Flex 4.5。

它工作得很好，但我缺少一些拼图部分：

我创建了一个基于 UIComponent 的自定义组件，该组件表示一副纸牌（它们是一组 Sprite 或 MovieClips）：

在最初的纯 Flash/AS3 游戏中，我将 Tween 用于桌上的 3 张牌 - 向游戏用户显示谁放了哪张牌（通过将它们滑向桌子中间）：

import fl.transitions.*;
import fl.transitions.easing.*;

public class Deck extends UIComponent {
    private var _card:Array = new Array(3);
    private var _tween:Array = new Array(3);
            ....

    override protected function createChildren():void {
        _tween[YOU] = new Tween(_card[0], 'y', Regular.easeOut, _card[0].y + 40, _card[0].y, .5, true);
        _tween[LEFT] = new Tween(_card[1], 'x', Regular.easeOut, _card[1].x - 40, _card[1].x, .5, true);
        _tween[RIGHT] = new Tween(_card[2], 'x', Regular.easeOut, _card[2].x + 40, _card[2].x, .5, true);
             ....

但是 Flash Builder 4.5 似乎根本不知道 fl.transitions.* 包？

有没有人请教一下如何在这里使用Tween？

就像我写的其余部分一样（我的自定义 Flex 组件、移动卡片精灵等）效果很好。只需要注释 Tween 行。

谢谢！亚历克斯

【问题讨论】：

标签： apache-flex flex4 flex4.5 tween flash-builder4.5

【解决方案1】：

查看 Google 代码上的 Tweener 类。有了它，您可以指定和对象，以及它的属性及其所需值的映射以及时间，它会将这些属性从当前值“补间”到所需值。

Tweener.addTween(yourCard, {y:50, time:1});//for a 1 second tween

【讨论】：

【解决方案2】：

我的第一个下意识反应是将 flash.swc（由 Flash CS Pro 提供）添加到 Flex 构建路径，然后：

import fl.transitions.*;
import fl.transitions.easing.*;

可以再次使用。

但从长远来看，我可能会编写自己的函数来移动扑克牌并在Event.ENTER_FRAME 上运行它。因为我不想仅仅为了卡片滑动而包含 Tweener 或 Tweenlite 库。

        _tween[0] = _card[0].y;
        _tween[1] = _card[1].x;
        _tween[2] = _card[2].x;
                ....
        _card[0].y = _tween[0] + 20;
        addEventListener(Event.ENTER_FRAME, slideCardYou);

        _card[1].x = _tween[1] - 20;
        addEventListener(Event.ENTER_FRAME, slideCardLeft);

        _card[2].x = _tween[2] + 20;
        addEventListener(Event.ENTER_FRAME, slideCardRight);
                ....

    private function slideCardYou(event:Event):void {
        if (_card[0].y-- < _tween[0]) 
            removeEventListener(Event.ENTER_FRAME, slideCardYou);
    }

    private function slideCardLeft(event:Event):void {
        if (_card[1].x++ > _tween[1]) 
            removeEventListener(Event.ENTER_FRAME, slideCardLeft);
    }

    private function slideCardRight(event:Event):void {
        if (_card[2].x-- < _tween[2]) 
            removeEventListener(Event.ENTER_FRAME, slideCardRight);
    }

我还查看了 mx.effects.Tween 和 spark.effects.Animate，但它们似乎更适合 UIComponents 而不是 Sprites，就像我的情况一样。

【讨论】：