본문 바로가기

ActionScript/AS3.0

Focus selected shape

출처 카페 > 플래시(Flash)로 생계를.. | kjangsa3
원문 http://cafe.naver.com/flashdev/10036
Stage.scaleMode = "noScale"//스테이지의 크기를 고정.
 

//클래스를 불러온다.
import flash.geom.*;
import flash.filters.BlurFilter;

var shapecount:Number = 10;     // 화면에 표시될 shape(MovieClip)의 개수.
var maxdistance:Number = 1000;  // 화면의 최대 깊이 값(z 최대값).
var focallength:Number = 250;     // 시점 거리. (눈 과 모니터의 거리).
var blurpower:Number = 15;     // Blur가 적용될 양.
var origin:Point= new Point(150, 150); // 소실점(눈높이)
var shapebounds:Rectangle = new Rectangle(-150, -150, 300, 300); // 소실점을 기준으로 만들어질 shape의 경계 영역.

var focus:Number = 0;           // 현재 focus 속성.
var targetshape:MovieClip = null;  // 선택된 shape.
var focuseasefactor:Number = 0.3; // focus의 변화를 easing하는데 사용되는 속성.

var shapelist:Array = new Array(); // 만들어질 shape을 저장하는 배열.

var blur:BlurFilter = new BlurFilter(0, 0, 1); // 각 도형에 적용될 blur 필터 선언.


//-------------------------------------------------------------------------------------------------------
var regen_btn:Button;
regen_btn.onRelease = createShapes; // Regenerate 버튼을 클릭하면 createShape 함수를 실행하라.

onEnterFrame = focusClips; // 매프레임마다 focusClips 함수를 실행하라.


createShapes(); // createShapes 함수를 불러온다. (화면에 shape를 뿌려주는 역할)



// focus를 제어하는 함수.------------------------------------------------------------------------------------
function focusClips(){

 if (!targetshape.getDepth()) return false; // targetshape이 존재하지 않으면, false를 반환.
 
 focus += (targetshape.getDepth() - focus) * focuseasefactor; // focus에 부드러운 움직임 공식 적용.
 
 var i:Number = shapelist.length; // shapelist.length == shapecount
 var diff; // 선택된 shape와 나머지 shape 간의 z거리(depth) 차.
 // 만약, Depth값 1000 에 위치한 shape을 선택하면, focus는 1000에 맞춰지고, Depth값 0에 위치한 shape와의
 // diff는 절대값(1000 - 0), 결국 diff = 1000이 된다.

 while (i--){
  diff = Math.abs(focus - shapelist[i].getDepth());
  blur.blurX = blur.blurY = blurpower * diff/maxdistance; // 위의 예의 경우, (15 * 1000 / 1000)이 되어, Depth 0의 shape은 BlurX값이 15가 된다.
  shapelist[i].filters = [blur]; //shape(무비클립)의 filters속성에 blur의 변화값을 저장.
 }
}


// 화면에 shape(무비클립)을 뿌려주는 함수.------------------------------------------------------------------------
function createShapes(){
 
 removeShapes(); // regen_btn 을 클릭할때 마다 shape이 중첩되는 것을 방지. 이전 무비클립을 지워준다.
 var i:Number = shapecount;
 
 while (i--){ // shapecount 만큼 반복.
  shapelist.push(createRandomShape(i)); // createRandomShape()함수로 만들어진 각각의 shape을 배열에 저장.
 }

 shapelist[0].onPress(); // 제일 처음에 만들어진 shape을 선택. 이로서 targetshape 속성에 대상이 적용 됨.
 focusClips();
}


// 화면의 shape을 삭제하는 함수---------------------------------------------------------------------------------
function removeShapes(){

 var i = shapelist.length;
 while (i--){
  shapelist[i].removeMovieClip(); // shapelist 배열에 저장된 shape(무비클립)을 삭제. 화면을 정리한다.
 }
 shapelist.length = 0; // 이 것은 없어도 실행됨, 꼭 필요한 것은 아닌듯.
}


// 각각의 shape을 (0 ~1000)Depth 사이에 생성하는 함수.---------------------------------------------------------------
function createRandomShape(depth){
 
 var shape = this.attachMovie("shape", "shape"+depth, depth); // 라이브러리의 Linkage 값이 shape인 무비클립을 불러온다.
 
 var xpos = shapebounds.x + Math.floor(Math.random()*shapebounds.width); // -150 ~ 150 사이의 정수.
 var ypos = shapebounds.y + Math.floor(Math.random()*shapebounds.height); // -150 ~ 150 사이의 정수.
 var zpos = Math.floor(Math.random()*maxdistance); // 0 ~ 1000 사이의 정수.
 
 var scaleratio = focallength/(focallength + zpos); // zpos에 따른 스케일비율.
 
 // scaleratio 가      1일때: shape._x 는 0 ~ 300,
 // scaleratio 가   0.5일때: shape._x 는 75 ~ 225,
 // scaleratio 가 0.25일때: shape._x 는 112.5 ~ 187.5
 shape._x = origin.x + xpos * scaleratio;
 shape._y = origin.y + ypos * scaleratio;
 
 shape._xscale = shape._yscale = 100 * scaleratio; // 스케일비율에 따른 shape의 스케일.
 
 var depth = maxdistance - zpos; // zpos를 invert 시킴. 즉, zpos가 0인 지점의 depth는 1000  이 된다.

 while (this.getInstanceAtDepth(depth)){ // 특정 depth에 무비클립이 존재하면, depth에 1을 더하라.
  depth++;
 }
 
 shape.swapDepths(depth); // 처음엔 shape이 (0 ~ 10)사이 Depth로 생성되었는데, 위에서 선언한 depth로 깊이를 바꾼다.
 
 shape.onRollOver = shapeRollOver;
 shape.onPress = shapePress;
 shape.onRollOut = shapeRollOut;

 return shape; // 위에서 만들어진 shape을 반환.
}


// shape에 롤오버 시 실행---------------------------------------------------------------------------------------------
function shapeRollOver(){
 this.gotoAndStop(2); // shape에 마우스 오버 시 2번째 프레임으로 이동.
}

// shape를 클릭 했을 때 실행-------------------------------------------------------------------------------------------
function shapePress(){
 if (targetshape){
  targetshape.gotoAndStop(1); // 이전에 선택되었던 targetshape은 1번째 프레임으로 이동 시키고,
 }
 this.gotoAndStop(2);
 targetshape = this; // 지금 선택한 shape을 targetshape으로 지정.
}

// shape에 롤아웃 시 실행--------------------------------------------------------------------------------------------
function shapeRollOut(){
 if (targetshape != this) {
  this.gotoAndStop(1); // 지금 롤아웃한 shape이 targetshape이 아니면, 1번째 프레임으로 이동.
 }
}






참고: http://www.senocular.com/flash/source.php


이 것을 적용하려면, 라이브러리 안에 Linkage 속성이 "shape"인 무비클립이 있어야 합니다.