переместить форму с помощью S: переместить MXML

Question

Я пытаюсь создать анимацию с прямоугольником.Я хочу, чтобы прямоугольник перемещался в цикле от x = 150 до x = 50 и обратно до 150 и т. Д.

В данный момент я могу только перемещать прямоугольник вперед, и он останавливается после того, как он переместился на 100px.1003 *

Есть идеи, как создать цикл?

Это то, что я придумал.не очень знаю.

<s:Move id="moves" 
target="{rect2}"
xBy="-150"
duration="1000"
easer="{sineEasing}"/>

Answer 1

Попробуйте что-то вроде этого:

<mx:Sequence id="seq" repeatCount="0">
    <s:Move
        target="{rect}"
        xBy="150"
        duration="1000"
        easer="{sineEasing}"/>
    <s:Move
        target="{rect}"
        xBy="-150"
        duration="1000"
        easer="{sineEasing}"/>
</mx:Sequence>

Как вы можете видеть, основная идея здесь заключается в том, чтобы использовать Sequence эффект, чтобы заставить две Move анимации выполняться подряд, а затем зацикливать это * 1006.* эффект, установив для его свойства repeatCount значение 0.

Answer 2

Я бы предложил использовать библиотеку анимаций tweenlite и не использовать встроенные опции анимации Flex или MXML для анимации. Tweenlite имеет гораздо больше возможностей и очень прост в использовании.

С помощью приведенного ниже кода вы можете увидеть, как работает библиотека. Функция перемещает ваш объект прямоугольник в положение 65,117 с Sine.easeIn ослабление в течение 1 секунды.

TweenLite.to(rect, 1, {x:65, y:117, ease:Sine.easeIn});

Если вы затем используете некоторые дополнительные параметры, вы можете создать цикл, например так:

handleAnimation();

private function handleAnimation(e:Event=null):void
{
    var positionTo:Int = (rect.x == 150) ? 50 : 150;
    TweenLite.to(rect, 1, {x:positionTo, ease:Sine.easeIn, onComplete:handleAnimation});
}