무비클립 부드럽게 색 바꾸기

지난번 포스팅한 ColorMatrixFilter 색조, 채도 변경에서는 오브젝트의 색상을 바꾸는 방법을 다루었습니다.

 

그런데 색상이 바로바로 바뀌니까 다소 딱딱한 느낌이 있었습니다.

 

그후 어떻게 하면 보아의 홈페이지처럼 부드럽게 색을 바꿀수 있을까 열심히 고뇌했습니다 -_-;

 

답은 아래 스크립트에 있었습니다.

 for(ia=0; ia<=2; ia++){
 if(Math.round((c[ia]-color[ia])*100)>0) c[ia]= 0.01*Math.round(c[ia]*100)-0.01;
 if(Math.round((c[ia]-color[ia])*100)<0) c[ia]= 0.01*Math.round(c[ia]*100)+0.01;
 }//trace(c[0]+c[1]+c[2]);

색이 바뀌면 즉시 전달하지 않고 color[ia] 변수의 값을 조금씩 조정하는 것입니다.

(EnterFrame으로 반복 걸구요)

 

즉, 기존 색상이 새로 얻은 값보다 크다면 값을 빼고, 작다면 더해서 기존 색상이 새로운 값을 따라가는거죠.

(어려운 것을 설명할수록 제가 글을 참 못쓴다는 생각이 ㅠㅠ)

 

 

 

 

 

 

이 플래시는 아무때나, 아무색으로 바뀝니다.

 

소스 잘 뜯어보세요^^

 

소스보기..

c = new Array(0,0,0);
color = new Array(1,0,0);
onEnterFrame = function (){
 
 
 for(i=0; i<=1; i++){
 if(random(75)==0){
 color[0] = random(11)/10; color[1] = random(11)/10; color[2] = random(11)/10;
 if(color[0]+color[1]+color[2]>1) i--;
 color[1] += 0.1*Math.round((1-color[0]-color[1]-color[2])/30);
 color[2] += 0.1*Math.round((1-color[0]-color[1]-color[2])/30);
 color[0] = 0.1*Math.round((1-color[1]-color[2])*10);
 }
 
view_color = color[0]+", "+color[1]+", "+color[2]+",\n"
view_color += color[2]+", "+color[0]+", "+color[1]+",\n"
view_color += color[1]+", "+color[2]+", "+color[0]
trace(view_color+"\n--Color Info--");
}
 
 
 for(ia=0; ia<=2; ia++){
 if(Math.round((c[ia]-color[ia])*100)>0) c[ia]= 0.01*Math.round(c[ia]*100)-0.01;
 if(Math.round((c[ia]-color[ia])*100)<0) c[ia]= 0.01*Math.round(c[ia]*100)+0.01;
 }//trace(c[0]+c[1]+c[2]);
filterObj = new flash.filters.ColorMatrixFilter();
filterObj.matrix = new Array(
c[0],c[1],c[2],0,0,
c[2],c[0],c[1],0,0,
c[1],c[2],c[0],0,0,
0,0,0,1,0);
_root.img_down.filters = [filterObj];
}

 

Color.fla