mx.transitions.Tweenクラス を拡張
スクリプトでトゥイーンさせるのに便利な mx.transitions.Tweenクラス。
デフォルトのものだと一定の強さでしか動作してくれないのでイージング加減を調節できるようなものを作ってみました。
CustomTween.as/**
* mx.transitions.Tweenクラスを拡張
*/
class CustomTween extends mx.transitions.Tween {
// 変化の度合いを制限する数値
var MAX_EASING:Number = 10;
// strength イージングの強さ
var _s:Number = 0;
/**
* CustomTween(obj:Object, prop:String, func:Function, begin:Number, finish:Number, duration:Number, useSeconds:Boolean, strength:Number);
* @param obj Tween インスタンスのターゲットになるムービークリップオブジェクトです。
* @param prop 値がトゥイーンされる obj のプロパティのストリング名です。
* @param func トゥイーンされるオブジェクトのプロパティ値のイージング効果を計算するイージングメソッドです。 詳細については、イージングクラスとメソッドについてを参照してください。
* @param begin prop (トゥイーンされるターゲットオブジェクトのプロパティ) の開始値を示す数値です。
* @param finish prop (トゥイーンされるターゲットオブジェクトのプロパティ) の終了値を示す数値です。
* @param duration トゥイーンモーションの継続時間を示す数値です。 省略した場合、デフォルトで継続時間が無限に設定されます。
* @param useSeconds duration パラメータで指定した値の単位に関して、秒 (true の場合) またはフレーム (false の場合) のどちらを使用するかを示すブール値です。
* @param strength イージングの強さ。0-100で設定。0だと等速。
*/
function CustomTween(obj, prop, func, begin, finish, duration, useSeconds, strength) {
super(obj, prop, func, begin, finish, duration, useSeconds);
if (strength != undefined) {
// イージングの度合い(1~MAX_EASING+1の範囲へ変換)
_s = Math.max(Math.min(strength/100*MAX_EASING, MAX_EASING), 0)+1;
}
}
// イージングメソッドに引数を渡すように変更
function getPosition(t:Number):Number {
if (t == undefined) {
t = this._time;
}
return this.func(t, this.begin, this.change, this._duration, this._s);
}
}
Custom.as
class Custom {
// 等速
public static function easeNone(t:Number, b:Number, c:Number, d:Number):Number {
return b+c*t/d;
}
// 加速
public static function easeIn(t:Number, b:Number, c:Number, d:Number, s:Number):Number {
return b+c*Math.pow(t/d, s);
}
// 減速
public static function easeOut(t:Number, b:Number, c:Number, d:Number, s:Number):Number {
return b+c*(1-Math.pow(1-t/d, s));
}
// 加速-減速
public static function easeInOut(t:Number, b:Number, c:Number, d:Number, s:Number) {
return (t<=(d /= 2)) ? b+c/2*Math.pow(t/d, s) : b+c-c/2*Math.pow(2-t/d, s);
}
// 減速-加速
public static function easeOutIn(t:Number, b:Number, c:Number, d:Number, s:Number) {
return (t<=(d /= 2)) ? b+c/2*(1-Math.pow(1-t/d, s)) : b+c/2*(1+Math.pow(t/d-1, s));
}
}
フレーム1
// // 例: test_mc の x 座標を 30フレームで 50 から 350 に移動する。最後の引数がイージング加減。
new CustomTween(test_mc, "_x", Custom.easeOut, 50, 350, 30, false, 80);
Customクラスの計算式は Tatsuo Katoさんの dynTweenMX の function をクラス化したものです。
ちなみに easingクラス は標準で Back、Bounce、Elastic、Regular、Strong、None の6種類しかありませんが。
http://www.robertpenner.com/easing/ こちらからもう少し多くのクラスを入手できます。
Flashのヘルプ - Tween クラス
Team Macromedia : Tatsuo Kato
Macromedia - Using the Tween and Transition Classes in Flash MX 2004*
Fumiononaka.com - TransitionManager と Tweenクラス
Fumiononaka.com - Tweenクラス
デフォルトのものだと一定の強さでしか動作してくれないのでイージング加減を調節できるようなものを作ってみました。
CustomTween.as
* mx.transitions.Tweenクラスを拡張
*/
class CustomTween extends mx.transitions.Tween {
// 変化の度合いを制限する数値
var MAX_EASING:Number = 10;
// strength イージングの強さ
var _s:Number = 0;
/**
* CustomTween(obj:Object, prop:String, func:Function, begin:Number, finish:Number, duration:Number, useSeconds:Boolean, strength:Number);
* @param obj Tween インスタンスのターゲットになるムービークリップオブジェクトです。
* @param prop 値がトゥイーンされる obj のプロパティのストリング名です。
* @param func トゥイーンされるオブジェクトのプロパティ値のイージング効果を計算するイージングメソッドです。 詳細については、イージングクラスとメソッドについてを参照してください。
* @param begin prop (トゥイーンされるターゲットオブジェクトのプロパティ) の開始値を示す数値です。
* @param finish prop (トゥイーンされるターゲットオブジェクトのプロパティ) の終了値を示す数値です。
* @param duration トゥイーンモーションの継続時間を示す数値です。 省略した場合、デフォルトで継続時間が無限に設定されます。
* @param useSeconds duration パラメータで指定した値の単位に関して、秒 (true の場合) またはフレーム (false の場合) のどちらを使用するかを示すブール値です。
* @param strength イージングの強さ。0-100で設定。0だと等速。
*/
function CustomTween(obj, prop, func, begin, finish, duration, useSeconds, strength) {
super(obj, prop, func, begin, finish, duration, useSeconds);
if (strength != undefined) {
// イージングの度合い(1~MAX_EASING+1の範囲へ変換)
_s = Math.max(Math.min(strength/100*MAX_EASING, MAX_EASING), 0)+1;
}
}
// イージングメソッドに引数を渡すように変更
function getPosition(t:Number):Number {
if (t == undefined) {
t = this._time;
}
return this.func(t, this.begin, this.change, this._duration, this._s);
}
}
Custom.as
// 等速
public static function easeNone(t:Number, b:Number, c:Number, d:Number):Number {
return b+c*t/d;
}
// 加速
public static function easeIn(t:Number, b:Number, c:Number, d:Number, s:Number):Number {
return b+c*Math.pow(t/d, s);
}
// 減速
public static function easeOut(t:Number, b:Number, c:Number, d:Number, s:Number):Number {
return b+c*(1-Math.pow(1-t/d, s));
}
// 加速-減速
public static function easeInOut(t:Number, b:Number, c:Number, d:Number, s:Number) {
return (t<=(d /= 2)) ? b+c/2*Math.pow(t/d, s) : b+c-c/2*Math.pow(2-t/d, s);
}
// 減速-加速
public static function easeOutIn(t:Number, b:Number, c:Number, d:Number, s:Number) {
return (t<=(d /= 2)) ? b+c/2*(1-Math.pow(1-t/d, s)) : b+c/2*(1+Math.pow(t/d-1, s));
}
}
フレーム1
new CustomTween(test_mc, "_x", Custom.easeOut, 50, 350, 30, false, 80);
Customクラスの計算式は Tatsuo Katoさんの dynTweenMX の function をクラス化したものです。
ちなみに easingクラス は標準で Back、Bounce、Elastic、Regular、Strong、None の6種類しかありませんが。
http://www.robertpenner.com/easing/ こちらからもう少し多くのクラスを入手できます。
Flashのヘルプ - Tween クラス
Team Macromedia : Tatsuo Kato
Macromedia - Using the Tween and Transition Classes in Flash MX 2004*
Fumiononaka.com - TransitionManager と Tweenクラス
Fumiononaka.com - Tweenクラス
投稿日 : 2005年10月14日 - yoshiweb - カテゴリ: ActionScript
コメント
投稿者 : ojos
2005年10月24日 22時15分26秒
投稿者 : yoshiweb
はじめまして ojosさん。一応、Tweenクラスでもアクション終了時にonMotionFinishedメソッドが呼ばれているようですが、機会があったら使ってみようと思います。どうもありがとうございます。(^-^)
こんな風にカスタマイズしたクラスや自作した便利なクラスをいろんな人同士で共有しあえるといいですね。
こんな風にカスタマイズしたクラスや自作した便利なクラスをいろんな人同士で共有しあえるといいですね。
2005年10月25日 02時18分25秒
/**
* mx.transitions.Tweenクラスを拡張
*/
class CustomTween extends mx.transitions.Tween {
// 変化の度合いを制限する数値
var MAX_EASING:Number = 10;
// strength イージングの強さ
var _s:Number = 0;
// setIntervalのID
var intervalID : Number;
// ターゲットのオブジェクト
var ref : Object;
// 呼び出す関数名
var method : String;
// 関数の引数
var args : Array;
/**
* CustomTween(obj:Object, prop:String, func:Function, begin:Number, finish:Number, duration:Number, useSeconds:Boolean, strength:Number, callBack : Object);
* @param obj Tween インスタンスのターゲットになるムービークリップオブジェクトです。
* @param prop 値がトゥイーンされる obj のプロパティのストリング名です。
* @param func トゥイーンされるオブジェクトのプロパティ値のイージング効果を計算するイージングメソッドです。 詳細については、イージングクラスとメソッドについてを参照してください。
* @param begin prop (トゥイーンされるターゲットオブジェクトのプロパティ) の開始値を示す数値です。
* @param finish prop (トゥイーンされるターゲットオブジェクトのプロパティ) の終了値を示す数値です。
* @param duration トゥイーンモーションの継続時間を示す数値です。 省略した場合、デフォルトで継続時間が無限に設定されます。
* @param useSeconds duration パラメータで指定した値の単位に関して、秒 (true の場合) またはフレーム (false の場合) のどちらを使用するかを示すブール値です。
* @param strength イージングの強さ。0-100で設定。0だと等速。
*/
function CustomTween(obj, prop, func, begin, finish, duration, useSeconds, strength) {
super(obj, prop, func, begin, finish, duration, useSeconds);
if (strength != undefined) {
// イージングの度合い(1~MAX_EASING+1の範囲へ変換)
_s = Math.max(Math.min(strength/100*MAX_EASING, MAX_EASING), 0)+1;
}
if(callBack != undefined){
ref = callBack.ref;
method = callBack.method;
args = callBack.args;
if(useSeconds){
intervalID = setInterval(this, "callBack", duration * 1000);
}
}
}
// イージングメソッドに引数を渡すように変更
function getPosition(t:Number):Number {
if (t == undefined) {
t = this._time;
}
return this.func(t, this.begin, this.change, this._duration, this._s);
}
// コールバック関数
function callBack(){
clearInterval(intervalID);
ref[method].apply(ref,args);
}
}
こんな感じで使います
new CustomTween(test_mc, "_alpha", jp.ojos.easing.Circ.easeOut, 0, 100, 5, true, 30, {ref : this.test_mc, method : "testMethod", args : ["a" , 100]});
test_mc.testMethod = function(aaa:String,bbb:Number) : Void{
trace("aaa : " + aaa);
trace("bbb : " + bbb);
}
今使っているのと若干コードが違いますがたぶんいけるはずです