[ひよこの会] オーバーライト処理

トゥイーン・ライブラリを用いた、オーバーライト処理を試してみる。 :bouzu:

overwrite

:caution: 要 Flash Player 9 以上

Quad.easeOutの動き(5秒)の途中で、Elastic.easeOutの動き(1秒)に差し替える。 :boy:


[BetweenAS3]
This movie requires Flash Player 9.0.0
import org.libspark.betweenas3.BetweenAS3;
import org.libspark.betweenas3.tweens.ITween;
import org.libspark.betweenas3.events.TweenEvent;
import org.libspark.betweenas3.easing.*;


var itween:ITween;
playBtn.addEventListener(MouseEvent.CLICK, play, false, 0, true);
overwriteBtn.addEventListener(MouseEvent.CLICK, overwrite, false, 0, true);

function play(evt:MouseEvent):void {
  piyo.x = 100;
  itween = BetweenAS3.to(piyo, {x: 500}, 5, Quad.easeOut);
  itween.addEventListener(TweenEvent.COMPLETE, complete, false, 0, true);
  itween.play();

}
function overwrite(evt:MouseEvent):void {
  piyo.swingHead();
  itween = BetweenAS3.to(piyo, {x: 300}, 1, Elastic.easeOut);
  itween.addEventListener(TweenEvent.COMPLETE, complete, false, 0, true);
  itween.play();

}
function complete():void {
  //完了時の処理
}

途中で動きを変えても、動きは差し替わっているように見えるが、前の動きが残ってしまっているうえに、完了時の処理が2回行われてしまう。 :rain:
(オーバーライト機能なし)


[BetweenAS3]
This movie requires Flash Player 9.0.0
import org.libspark.betweenas3.BetweenAS3;
import org.libspark.betweenas3.tweens.ITween;
import org.libspark.betweenas3.events.TweenEvent;
import org.libspark.betweenas3.easing.*;


var itween:ITween;
playBtn.addEventListener(MouseEvent.CLICK, play, false, 0, true);
overwriteBtn.addEventListener(MouseEvent.CLICK, overwrite, false, 0, true);

function play(evt:MouseEvent):void {
  piyo.x = 100;
  itween = BetweenAS3.to(piyo, {x: 500}, 5, Quad.easeOut);
  itween.addEventListener(TweenEvent.COMPLETE, complete, false, 0, true);
  itween.play();

}
function overwrite(evt:MouseEvent):void {
  itween.stop();
  piyo.swingHead();
  itween = BetweenAS3.to(piyo, {x: 300}, 1, Elastic.easeOut);
  itween.addEventListener(TweenEvent.COMPLETE, complete, false, 0, true);
  itween.play();

}
function complete():void {
  //完了時の処理
}

途中で動きを変えても、動きは差し替わり、完了時の処理は1回しか行われない。 :sun:


[Tweener]
This movie requires Flash Player 9.0.0
import caurina.transitions.Tweener;

playBtn.addEventListener(MouseEvent.CLICK, play, false, 0, true);
overwriteBtn.addEventListener(MouseEvent.CLICK, overwrite, false, 0, true);

function play(evt:MouseEvent):void {
  piyo.x = 100;
  Tweener.addTween(piyo, {x: 500, time: 5, transition: "easeOutQuad", onComplete: complete});
}
function overwrite(evt:MouseEvent):void {
  piyo.swingHead();
  Tweener.addTween(piyo, {x: 300, time: 1, transition: "easeOutElastic", onComplete: complete});
}
function complete():void {
  //完了時の処理
}

途中で動きを変えても、動きは差し替わり、完了時の処理は1回しか行われない。 :sun:
(オーバーライト機能あり)


[KTween]
This movie requires Flash Player 9.0.0
import net.kawa.tween.KTween;
import net.kawa.tween.KTJob;
import net.kawa.tween.easing.*;


var job:KTJob;
playBtn.addEventListener(MouseEvent.CLICK, play, false, 0, true);
overwriteBtn.addEventListener(MouseEvent.CLICK, overwrite, false, 0, true);

function play(evt:MouseEvent):void {
  piyo.x = 100;
  job = KTween.to(piyo, 5, {x: 500}, Quad.easeOut, complete);
}
function overwrite(evt:MouseEvent):void {
  piyo.swingHead();
  job = KTween.to(piyo, 1, {x: 300}, Elastic.easeOut, complete);
}
function complete():void {
  //完了時の処理
}

途中で動きを変えても、動きは差し替わっているように見えるが、前の動きが残ってしまっているうえに、完了時の処理が2回行われてしまう。 :rain:
(オーバーライト機能なし)


[KTween]
This movie requires Flash Player 9.0.0
import net.kawa.tween.KTween;
import net.kawa.tween.KTJob;
import net.kawa.tween.easing.*;


var job:KTJob;
playBtn.addEventListener(MouseEvent.CLICK, play, false, 0, true);
overwriteBtn.addEventListener(MouseEvent.CLICK, overwrite, false, 0, true);

function play(evt:MouseEvent):void {
  piyo.x = 100;
  job = KTween.to(piyo, 5, {x: 500}, Quad.easeOut, complete);
}
function overwrite(evt:MouseEvent):void {
  job.abort();
  piyo.swingHead();
  job = KTween.to(piyo, 1, {x: 300}, Elastic.easeOut, complete);
}
function complete():void {
  //完了時の処理
}

途中で動きを変えても、動きは差し替わり、完了時の処理は1回しか行われない。 :sun:


[GTween]
This movie requires Flash Player 9.0.0
import com.gskinner.motion.GTweener;
import com.gskinner.motion.GTween;
import com.gskinner.motion.easing.*;


var gtween:GTween;
playBtn.addEventListener(MouseEvent.CLICK, play, false, 0, true);
overwriteBtn.addEventListener(MouseEvent.CLICK, overwrite, false, 0, true);

function play(evt:MouseEvent):void {
  piyo.x = 100;
  gtween = new GTween(piyo, 5, {x: 500}, {ease: Quadratic.easeOut, onComplete: complete});
}
function overwrite(evt:MouseEvent):void {
  gtween.paused = true;
  piyo.swingHead();
  gtween = new GTween(piyo, 1, {x: 300}, {ease: Elastic.easeOut, onComplete: complete});
}
function complete():void {
  //完了時の処理
}

途中で動きを変えても、動きは差し替わっているように見えるが、前の動きが残ってしまっているうえに、完了時の処理が2回行われてしまう。 :rain:
(オーバーライト機能なし)


[GTween]
This movie requires Flash Player 9.0.0
import com.gskinner.motion.GTweener;
import com.gskinner.motion.GTween;
import com.gskinner.motion.easing.*;


var gtween:GTween;
playBtn.addEventListener(MouseEvent.CLICK, play, false, 0, true);
overwriteBtn.addEventListener(MouseEvent.CLICK, overwrite, false, 0, true);

function play(evt:MouseEvent):void {
  piyo.x = 100;
  gtween = new GTween(piyo, 5, {x: 500}, {ease: Quadratic.easeOut, onComplete: complete});
}
function overwrite(evt:MouseEvent):void {
  gtween.paused = true;
  piyo.swingHead();
  gtween = new GTween(piyo, 1, {x: 300}, {ease: Elastic.easeOut, onComplete: complete});
}
function complete():void {
  //完了時の処理
}

途中で動きを変えても、動きは差し替わり、完了時の処理は1回しか行われない。 :sun:


[Tween24]
This movie requires Flash Player 9.0.0
import a24.tween.Tween24;

var atween:Tween24;
playBtn.addEventListener(MouseEvent.CLICK, play, false, 0, true);
overwriteBtn.addEventListener(MouseEvent.CLICK, overwrite, false, 0, true);

function play(evt:MouseEvent):void {
  piyo.x = 100;
  atween = Tween24.tween(piyo, 5, Tween24.ease.QuadOut).x(500);
  atween.onComplete(complete);
  atween.play();

}
function overwrite(evt:MouseEvent):void {
  piyo.swingHead();
  atween = Tween24.tween(piyo, 1, Tween24.ease.ElasticOut).x(300);
  atween.onComplete(complete);
  atween.play();

}
function complete():void {
  //完了時の処理
}

途中で動きを変えても、動きは差し替わるが、完了時の処理が2回行われてしまう。 :cloud:
(オーバーライト機能あり)


[Tween24]
This movie requires Flash Player 9.0.0
import a24.tween.Tween24;

var atween:Tween24;
playBtn.addEventListener(MouseEvent.CLICK, play, false, 0, true);
overwriteBtn.addEventListener(MouseEvent.CLICK, overwrite, false, 0, true);

function play(evt:MouseEvent):void {
  piyo.x = 100;
  atween = Tween24.tween(piyo, 5, Tween24.ease.QuadOut).x(500);
  atween.onComplete(complete);
  atween.play();

}
function overwrite(evt:MouseEvent):void {
  atween.pause();
  piyo.swingHead();
  atween = Tween24.tween(piyo, 1, Tween24.ease.ElasticOut).x(300);
  atween.onComplete(complete);
  atween.play();

}
function complete():void {
  //完了時の処理
}

途中で動きを変えても、動きは差し替わり、完了時の処理は1回しか行われない。 :sun: