| 무비클립 속성에 비해 다루기가 까다로워 필터 트원은 좀처럼 사용하지는 않았다.
특히 프레임으로 모션트윈은 어느정도 사용했지만 스크립트를 이용한 조절은 거의......
전반적으로 필터에 대해 다시 살펴보면서 이번기회에 필터트윈 클래스를 만들어 보았다.
새로 만들긴 했지만 기존에 만들었던 무비클립 Tween 클래스와 기본 구조는 같다.
어짜피 필터 트원이라는것이 필터속성을 시간단위로 변화를 주는 것이기 때문에 무비클립의 그것과 다르지 않았다.
무비클립 트윈클래스와 다른점은 인자값으로 적용할 필터오브젝트를 생성해서 넘겨주는 것이다.
그리고 그 필터속성의 변화값을 무비클립 filters 속성에 적용해 주는 것이다.
그리고 다중필터 지원은 동시에 여러가지 필터를 적용하는 경우가 많지 않을뿐더러 쓸데없이 파라미터가 길어질 염려가 있어 적용하지 않았다.
필터 적용범위는 필터속성의 데이타 타입이 Number 일경우에만 적용해야 한다. 따라서 ColorMatrixFilter와 같이 속성값이 matrix 일 경우 이 클래스로는 트윈이 적용되지 않는다. 그 이외의 모든 필터의 속성에 대해서는 트윈이 가능하다.
또한 필터 속성마다 해당하는 속성 범위가 존재한다. 이점을 유의해서 적용해야한다.
//==================================================================
//@class name : FilterTween.as
//@author : vkimone. KimKiJeung (http://kimkijeung.com)
//@last update : 2007. 03. 07
//@version : V1.0
//==================================================================
/**
@description
* 무비클립의 필터 속성 트윈 클래스 : 이징함수 설정으로 조절
* 트원할 필터속성의 갯수에 관계없이 오브젝트로 적용 가능
*
* @caution
* -반드시 트원할 필터 속성의 데이타 타입이 Number 일경우에만 적용할수 있다.
String,Boolean,Array 는 적용할 수 없다.
-다중필터 적용은 지원하지 않는다.
*
* @example
* <code>
* Filtertween.tween(targetMc,{blurX:36,blurY:36},Regular.easeOut,30,
{{func: callBackFunction,obj: functionScope, param: [파라미터 배열로 들어감]}}
* </code>
*/
import flash.filters.BitmapFilter;
class com.dstrict.UB.util.transitions.tween.FilterTween{
/**------------------------------------------------------------------------
* @param mc : MovieClip, 적용무비클립
* @param filter : BitmapFilter , 적용할 필터 객체
* @param obj : Object, 단일 필터속성 (필터 속성 data type 이 Number 일 경우)
ex. {blurX:32,blurY:32}
* @param func : Function, easing function
* @param durationFrame : Number, 지속프레임
* @param referObj :[option] reference object(caution--> 파라미터값 반드시 배열요소로 입력)
*----------------------------------------------------------------------*/
public static function tween(mc:MovieClip,filter:BitmapFilter,obj:Object,func:Function,durationFrame:Number):Void{
var time:Number=1;
var beginning:Array=new Array();
var change:Array=new Array();
for(var i in obj){
beginning.push(filter[i]);
change.push(obj[i]-filter[i]);
}
var type=(typeof(arguments[5])=="object")? true : false;
if(type){
var referObj=arguments[5];
}else{
var p:Number=arguments[5];
var referObj=arguments[6];
}
mc.onEnterFrame=function(){
var objIdx:Number=0;
for(var i in obj){
filter[i]=func(time,beginning[objIdx],change[objIdx],durationFrame,p);
mc.filters=[filter]; //필터 적용부분
objIdx++;
}
time++;
if(time>durationFrame){
delete this.onEnterFrame;
if(referObj!=undefined){
referObj.func.apply(referObj.obj,referObj.param);
}
}
};
}
}
<example code>
import com.dstrict.UB.util.transitions.tween.FilterTween;
import mx.transitions.easing.*;
import flash.filters.*;
var blurFilter:BlurFilter=new BlurFilter(0,0,1);
var dropShadowFilter:DropShadowFilter=new DropShadowFilter(0,120,0x000000,1);
var glowFilter:GlowFilter=new GlowFilter(0x6E7D74,1,16,16,2,2);
//BlurFilter
image.onRollOver=function(){
FilterTween.tween(image,blurFilter,{blurX:8,blurY:8},Regular.easeOut,15,
{func:onFilterTweenFinished,obj:_root,param:["blur"]});
}
image.onRollOut=function(){
FilterTween.tween(image,blurFilter,{blurX:0,blurY:0},Regular.easeOut,15);
}
//DropShadowFilter
image2.onRollOver=function(){
FilterTween.tween(image2,dropShadowFilter,{distance:4,blurX:4,blurY:4},Regular.easeOut,15,
{func:onFilterTweenFinished,obj:_root,param:["dropShadow"]});
}
image2.onRollOut=function(){
FilterTween.tween(image2,dropShadowFilter,{distance:0,blurX:4,blurY:0},Regular.easeOut,15);
}
//GlowFilter
image3.onRollOver=function(){
FilterTween.tween(image3,glowFilter,{alpha:1,blurX:36,blurY:36},Regular.easeOut,15,
{func:onFilterTweenFinished,obj:_root,param:["glow"]});
}
image3.onRollOut=function(){
FilterTween.tween(image3,glowFilter,{alpha:0,blurX:0,blurY:0},Regular.easeOut,15);
}
function onFilterTweenFinished(evt):Void{
trace("filterTween finished....."+evt);
}
download sample
|
태그 : 
