2010년 3월 31일 수요일

Duplicate - 겹치지 않게 복제하기(충돌감지)

 

- 충돌을 감지하면서 복제하기.

 

 

[code as3]
package
{
import flash.display.Sprite;
import flash.events.Event;

public class Duplicate_collision extends Sprite
{
    public function Duplicate_collision()
    {
        super();

        config();
    }

    private var holder:Array = new Array();

    private function config() : void
    {
        stage.frameRate = 40;

        stage.addEventListener( Event.ENTER_FRAME, enterFrameHandler );
    }

    private function enterFrameHandler( e:Event ) : void
    {
        var box:Sprite = new Seed();

        box.x = Math.random() * stage.stageWidth;
        box.y = Math.random() * stage.stageHeight;

        box.scaleX = Math.random() * 2;

        holder.push( box );

        if( isOK( box ) )
        {
            addChild( box );

            var glow:GlowFilter = new GlowFilter();

           glow.color = Math.random() * 0xFFFFFF;

           box.filters = [ glow ];
        }
        else
        {
            holder.pop();
        }
    }

    private function isOK( mc:Sprite ) : Boolean
    {
        var i:int = 0;

        var count:Number = holder.length - 1;

        for( i = 0; i < count; i++ )
        {
            var flag:Boolean = holder[i].hitTestObject( mc );

            if( flag )
            {
                return false;
                break;
            }
        }
        return true;
    }
}
}
[/code]



-> 이 예제는 객체를 만들때 이전에 만들었던 표시 객체와 같은 위치에 나타내지 않도록 하는 것이다.

     앞에서 했던 충돌감지 메소드 hitTestObject()를 사용하여 먼저 만들어진 객체와 새로 만들어진 객체가

     충돌되지 않는 위치에 배치하는 것이다.

 

     15번째 줄에서 holder는 밑에서 만들 별모양의 표시객체를 참조할 Array이다. 앞전에 만들어진 객체와

     현재 만들어진 객체의 충돌을 감지하기 위해서 Array의 인덱스를 사용해 비교하면 편하고 참조를 통해

     빠르게 비교할 수 있기 때문이다. 객체를 단지 한 두개를 비교할 때가 아닌 지금처럼 많은 객체들이 있어

     비교할 때는 Array를 사용하면 보다 편하다.

     33번째 줄에서 Array로 만든 holder에 push()메서드를 이용하여 배열에 끝에 넣는다.

     19번째 줄에서 frameRate는 흔히 fla파일에서 보는 fps(Frame Per Second)를 액션스크립트에서 설

     정해주는 것이다. 초당 프레임으로 1초당 40프레임으로 속도를 변경해주었다.

     그 다음 stage에 이벤트를 추가해주었다. EnterFrame 이벤트를 추가해주어 enterFrameHandler를 보면,

     box를 앞에서와 마찬가지로 Sprite를 확장한 클래스인 Seed클래스로 생성하여 주었고, 랜덤하게 위치를

     stage안에서만 생성되도록 해주었다. 가끔 밖으로 별이 튀어 나가는 것은 별 객체의 중심점이 가운데로

     설정되어 있어서 이다.

 

     35번째줄에서 if문 조건에서 isOK() 함수값이 true이면 즉, isOK()함수의 반환값이 Boolean값인데 그

     box가 (매개변수로는 mc가 되겠다) 이전에 만들어진 array에 들어있는 객체들과 모두 hitTestObject로 겹

     침여부를 비교 하였을 때 겹쳐졌으면 즉 flag = true면 isOK()함수 반환값이 false이므로 pop()해주고,

     만약 반대로 겹치지 않았다면 리턴값이 true이므로 box를 addChild()를 해준다.

    

     addChild를 해준 후 화면에서 보이는 바와 같이 앞전 예제에서 했던 GlowFilter클래스와 random함수를

     이용하여 테두리색이 랜덤으로 나오게 해준다. 랜덤으로 나오게 하기 위해서 GlowFilter에서 glow라는

     객체를 생성하고 그 객체에 color 속성으로 랜덤한 색상을 넣어준다음 box에 filters 속성으로 이용해

     glow객체에서 나온 랜덤한 색상을 적용시켜 주는것이 43번째까지의 내용이다.

 

     만약 if문에서의 조건이 false라면은 pop()을 해주는데, pop() 메소드는 push()메소드와 반대로 꺼내는

     메소드이다. 여기서 꺼내주는 이유는 위 예제에서 box를 Sprite로 생성시키자마자 holder array에 곧바로

     push를 시켜주는데 if문 조건이 false라는 의미가 겹쳐졌다라는 말이므로 addChild를 시켜줄 필요도 없고

     glow를 적용시킬 필요도 없으므로 곧바로 넣어주었던 box를 다시 꺼내는 것이다(pop).

     pop() 메소드는 이렇게 이해하면 되겟다.

   

2010년 3월 30일 화요일

Duplicate - 다양한 객체 만들기(복제-패턴)

 

- 복제를 이용해 Grid(격자)모양을 만들어 보는 예제.

 

 

[code as3]
package
{
import flash.display.Sprite;
import flash.display.Graphics;
import flash.events.MouseEvent;
import flash.events.IEventDispathcer;
import flash.geom.ColorTransform;

public class Duplicate_pattern extends Sprite
{
    public function Duplicate_pattern()
    {
        super();

        seedBox = new Sprite();

        seedBox.x = 80;
        seedBox.y = 20;

        addChild( seedBox );

        createButton();
    }

    private var seedBox:Sprite;

    private var normalBtn:Sprite;

    private var alphaBtn:Sprite;

    private var scaleBtn:Sprite;

    private var colorBtn:Sprite;

    private var row:int = 8;

    private var col:int = 10;

    private var tot:int = row * col;

    private var gap:Numer = 30;

    private function createButton() : void
    {
        var g:Graphics;

        if( !normalBtn )
        {
            normalBtn = new Sprite();

            g = normalBtn.graphics;

            g.clear();
            g.beginFill( 0xFFFFFF, 1 );
            g.drawRect( 0, 0, 50, 20 );
            g.endFill();

            normalBtn.x = 20;
            normalBtn.y = 20;

            normal.buttonMode = true;

           addChild( normalBtn );

           configListener( normalBtn );
        }

        if( !alphaBtn )
        {
            alphaBtn = new Sprite();

            g = alphaBtn.graphics;

            g.clear();
            g.beginFill( 0xFFFFFF, 1 );
            g.drawRect( 0, 0, 50, 20 );
            g.endFill();

            alphaBtn.x = 20;
            alphaBtn.y = normalBtn.y + gap;

            alphaBtn.buttonMode = true;

           addChild( alphaBtn );

           configListener( alphaBtn );
        }

        if( !scaleBtn )
        {
            scaleBtn = new Sprite();

            g = scaleBtn.graphics;

            g.clear();
            g.beginFill( 0xFFFFFF, 1 );
            g.drawRect( 0, 0, 50, 20 );
            g.endFill();

            scaleBtn.x = 20;
            scaleBtn.y = alphaBtn.y + gap;

            scaleBtn.buttonMode = true;

           addChild( scaleBtn );

           configListener( scaleBtn );
        }

        if( !colorBtn )
        {
            colorBtn = new Sprite();

            g = colorBtn.graphics;

            g.clear();
            g.beginFill( 0xFFFFFF, 1 );
            g.drawRect( 0, 0, 50, 20 );
            g.endFill();

            colorBtn.x = 20;
            colorBtn.y = scaleBtn.y + gap;

            colorBtn.buttonMode = true;

           addChild( colorBtn );

           configListener( colorBtn );
        }
    }

    private function configListener( dispatcher:IEventDispatcher ) : void
    {
        dispatcher.addEventListener( MouseEvent.CLICK, btnClickHandler );
    }

    private function btnClickHandler( e:MouseEvent ) : void
    {
        switch( e.target )
        {
            case normalBtn :
                createNormal();
                break;

            case alphaBtn :
                createAlpha();
                break;

            case scaleBtn :
                createScale();
                break;

            case colorBtn :
                createColor();
                break;
        }
    }

    private function removeAllChild() : void
    {
        while( seedBox.numChildren )
        {
            seedBox.removeChildAt( 0 );
        }
    }

    private function createNormal() : void
    {
        removeAllChild();

        var i:int = 0;

        for( i = 0; i < tot; i++ )
        {
            var temp:Sprite = new Seed();

            temp.x = ( i % col ) * 40 + gap;
            temp.y = Math.floor( i / col ) * 40 + gap;

            seedBox.addChild( temp );
        }
    }

    private function createAlpha() : void
    {
        removeAllChild();

        var i:int = 0;

        for( i = 0; i < tot; i++ )
        {
            var temp:Sprite = new Seed();

            temp.x = ( i % col ) * 40 + gap;
            temp.y = Math.floor( i / col ) * 40 + gap;

            temp.alpha = i / tot;

            seedBox.addChild( temp );
        }
    }

    private function createScale() : void
    {
        removeAllChild();

        var i:int = 0;

        for( i = 0; i < tot; i++ )
        {
            var temp:Sprite = new Seed();

            temp.x = ( i % col ) * 40 + gap;
            temp.y = Math.floor( i / col ) * 40 + gap;

            temp.scaleX = temp.scaleY = i / tot;
         
            seedBox.addChild( temp );
        }
    }

    private function createColor() : void
    {
        removeAllChild();

        var i:int = 0;

        for( i = 0; i < tot; i++ )
        {
            var temp:Sprite = new Seed();

            temp.x = ( i % col ) * 40 + gap;
            temp.y = Math.floor( i / col ) * 40 + gap;

            var ct:ColorTransform = new ColorTransform();
           
            ct.color = Math.random() * 0xFFFFFFFF;

            temp.transform.colorTransform = ct;

            seedBox.addChild( temp );
        }
    }
}
}
[/code]

 

 

- 복제하는 형태는 앞서 한 예제에서 같은 형태이고 복제한것을 Grid 형태로 찍는 것이다. 그리고 또 다른점

  은 버튼을 fla파일에서 직접 만들어 넣었다면 이번 예제에서는 Graphics클래스를 이용하여 만든다.

 

  처음 맨 밑바닥의 도화지 역할을 하는 seedBox를 Sprite로 객체를 생성하여 addChild해주고, 버튼들도

  그 위에 좌표를 설정해주어 각각 만들어 준다.

 

 

  161번째 줄은 버튼을 클릭할 때마다 생성되는 seedBox를 지우고 다시 그려주는 부분이다.

  버튼을 누를때마다 각각의 seed 무비들이 마구 나오면 알아볼 수 없기 때문에 numChild라는 속성을 이용

  하여 numChild가 있다면( numchild = 1 ) removeChildAt이라는 속성으로 지워준다. numChild가 한개라서

  1이지만 지울때의 메소드에서는 인덱스로 인식하기때문에 0이라고 해준다.

 

  격자로 찍기 위해서 공식을 이용하여 x와 y좌표에 적용시키면 되는데 위에서는 가로 10줄, 세로 8줄로 미리

  정의를 하고 나머지공식을 이용하여 공식을 만들었다.

  for문에서 tot까지 계속해서 1씩 증가하는 i 변수와 고정값인 col변수를 나누어 나오는 나머지와 seed클래스

  에서 생성되는 무비클립이 적정한 크기로 떨어져서 생성되도록 40을 곱하고 30을 더해준다. y좌표도 마찬가

  지로 공식을 구하여 적용시킨다. i 인덱스가 0부터 시작하므로 Math클래스에서 내림메소드 floor를 이용하

  여 적용시킨다.

  이렇게 x좌표와 y좌표의 결과를 찍어보면,

  30 / 30
  70 / 30
  110 / 30
  150 / 30
  190 / 30
  230 / 30
  270 / 30
  310 / 30
  350 / 30
  390 / 30

  30 / 70
  70 / 70
  110 / 70
  150 / 70
  190 / 70
  230 / 70
  270 / 70
  310 / 70
  350 / 70
  390 / 70
  30 / 110
  70 / 110
  110 / 110
  150 / 110
  190 / 110
  230 / 110
  270 / 110
  310 / 110
  350 / 110
  390 / 110

  ....

  이런 값이 적용되어 80개의 seed가 위와 같은 모양으로 찍히게 된다. 열의 간격은 나머지가 똑같은 수로

  나누기 때문에 패턴이 같은 식으로 나오게 되고, 행의 간격은 40씩 증가하게 되는 결과가 나온다.

2010년 3월 27일 토요일

Duplicate - 다양한 객체 만들기(복제-random,alpha,glow)

2.0에서 무비클립을 만들어 복제하고자 했을 때 이런식으로

[code as3]
_root.attachMovie( "Box", "mc", 0 );
_root.createEmptyMovieClip( "mc", 0 );
Box.duplicateMovieClip( "mc", 0 );
[/code]
빈 무비클립을 만들어 복제하는 형태였다면,

 

3.0에서의 복제는 new를 사용해 만들기만 하면 된다.

[code as3]
var mc:Box = new Box();
var mc:MovieClip = new MovieClip();
[/code]

예제를 보면 이렇다.

 

 

for문을 이용해 Seed클래스를 100번 실행하여 만든다.

 

[code as3]
package
{
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.filters.GlowFilter;

public class Duplicate extends Sprite
{
    public function Duplicate()
    {
        super();

        seedBox = new Sprite();

        addChild( seedBox );

        buttonMode = true;

        config();
    }

    private var seedBox:Sprite;

    private var seedNum:Number = 100;

    private function config() : void
    {
        normalBtn.addEventListener( MouseEvent.CLICK, btnClickHandler );
        alphaBtn.addEventListener( MouseEvent.CLICK, btnClickHandler );
        glowBtn.addEventListener( MouseEvent.CLICK, btnClickHandler );

        setChildIndex( seedBox, 0 );
    }

    private function btnClickHandler( e:MouseEvent ) : void
    {
        switch( e.target )
        {
            case normalBtn :
                createNormal();
                break;

            case alphaBtn :
                createAlpha();
                break;

            case glowBtn :
                createGlow();
                break;
        }
    }

    private function removeAllChild() : void
    {
        while( seedBox.numChildren )
        {
            seedBox.removeChildAt(0);
        }
    }

    private function createNormal() : void
    {
        removeAllChild();

        var i:int  = 0;

        for( i = 0; i < seedNum; i++ )
        {
            var temp:Sprite = new Seed();

            temp.x = Math.random() * stage.stageWidth;
            temp.y = Math.random() * stage.stageHeight;

            seedBox.addChild( temp );
        }
    }

    private function createAlpha() : void
    {
        removeAllChild();

        var i:int  = 0;

        for( i = 0; i < seedNum; i++ )
        {
            var temp:Sprite = new Seed();

            temp.x = Math.random() * stage.stageWidth;
            temp.y = Math.random() * stage.stageHeight;

            temp.scaleX = temp.scaleY = Math.random() * 2;

            temp.alpha = Math.random();

            seedBox.addChild( temp );
        }
    }

    private function createGlow() : void
    {
        removeAllChild();

        var i:int  = 0;

        for( i = 0; i < seedNum; i++ )
        {
            var temp:Sprite = new Seed();

            temp.x = Math.random() * stage.stageWidth;
            temp.y = Math.random() * stage.stageHeight;

            temp.scaleX = temp.scaleY = Math.random() * 2;

            temp.alpha = Math.random();

            temp.filters = [ new GlowFilter() ];

            seedBox.addChild( temp );
        }
    }
}
}
[/code]

-> 버튼 세개는 stage에 무비클립으로 미리 만들어 주었고, 동그라미 모양의 무비클립은 Seed라는 클래스를

    Sprite클래스를 확장한 형태로 Linkage를 주었다. 모션이 없으므로 가볍게 하기 위해 역시 Sprite로 하였

    다. 버튼을 누를 때마다 100개의 seed가 만들어 지면서 상황에 따라 알파값이 들어가거나 크기가 랜덤하

    게 찍히거나 혹은 glow 값을 넣어주었다.

    여기서 glow값을 쓰기 위해서 GlowFilter를 import 해주었다. glow는 우리가 흔히 포토샵에서 사용하게

    되는 테두리를 변형해주는 ↓

    Blendong툴인데 이것을 액션스크립트로도 적용할 수가 있다는 것이다.

   

    액션스크립트에서 GlowFilter() 생성자를 보면 이렇다.

   
    소스에서 처럼 아무것도 지정해주지 않았을 때 기본값으로 빨간색이 나오게 되는 것이다. 나머지 값들도

    지정해주는 것에 따른 효과를 볼 수 있게 된다.

   

     32번째줄에 보면 setChildIndex(child:DisplayObject, index:int)메소드를 써준 이유

    는 seedBox에서 생성되는 100개의 seed들이 stage에 올려놓은 버튼을 가려서 생성되기 때문에 간혹 버

    튼을 가려 버튼의 역할을 못하게 막는 경우가 있어서 쉽게말해 seedBox의 depth를 0으로 준 것이다. 그럼

    맨 밑으로 가게 되어 버튼 세개가 위로 올라오게 된다.

    표시 객체가 여러 개일 경우 지정해준 인덱스에 대해서만 바뀌게 되고 나머지는 그대로이다.

   

    예를 들어,

    [code as3]
    setChildIndex( getChildAt(1), 0 );
    [/code]
    이렇게 해주면 밑에 그림처럼 인덱스가 바뀌게 된다.

   

 

- 출처 : http://help.adobe.com/ko_KR/AS3LCR/Flash_10.0/index.html?flash/display/Graphics.html&flash/display/class-list.html

   

2010년 3월 26일 금요일

Sprite 클래쓰 - Drag & Drop( 영역 대 포인트 : hitTestPoint )

 

- hitTestPoint( x:Number, y:Number, shapeFlag:Boolean = false ) 메소드는 영영 대 영역과

   다르게 매개변수인 x와 y의 위치로 겹침 여부를 따진다. 여기서 shapeFlag는 표시 객체의 실제 픽셀과의

   겹침을 판단할 것인지 아니면 경계 상자로 판단할 것인지의 여부이다. 기본값은 false를 갖는다. 밑에서의

   예제처럼 true를 하면 별모양 무비클립의 x와 y좌표가 stage에 있는 글자와 직접적으로 겹쳐야 메소드의

   반환값을 true로 준다.

 

 

[code as3]
package classes.view
{
import flash.display.Sprite;
import flash.display.MovieClip;
import flash.events.Event;
import flash.events.TimerEvent;
import flahs.utils.Timer;

public class HitTestPoint extends Sprite
{
    public function HitTestPoint()
    {
        super();

        config();
    }

    private function config() : void
    {
        var timer:Timer = new Timer( 300, 50 );

        timer.addEventListener( TimerEvent.TIMER, timerHandler );

        timer.start();
    }

    private function timerHandler() : void
    {
        var star:Star = new Star();

        star.tx = Math.random() * 3 + 1;
        star.ty = Math.random() * 3 + 1;

        addChild( star );

        start.addEventListener( Event.ENTER_FRAME, enterFrameHandler );
    }

    private function enterFrameHandler( e:Event ) : void
    {
        var mc:MovieClip = MovieClip( e.target );

        if( mc.x < 0 || mc.x > stage.stageWidth )
        {
            mc.tx = -mc.tx;
        }

        if( mc.y < 0 || mc.y > stage.stageHeight )
        {
            mc.ty = -mc.ty;
        }

        if( kjh.hitTestPoint( mc.x, mc.y, true ) )
        {
            mc.gotoAndStop(2);
            mc.rot = -5;
        }
        else
        {
            mc.gotoAndStop(1);
            mc.rot = 5;
        }

        mc.x = mc.tx;
        mc.y = mc.ty;
        mc.rotation = mc.rot;
    }
}
}
[/code]

Timer클래스를 이용해서 300/10000초에 tiemrHandler함수를 50번 호출한다.

random()함수를 이용해서 tx라는 변수에 1~3사이의 난수를 넣어놓고, 그 난수를 star.tx에 넣어 둔다.

star에 이벤트 등록을 하고 enterFrameHandler 함수에서 이벤트를 통해 e.target(star)를 MovieClip으로

형변환 시킨다.

여기서 형변환을 하는 이유는 http://help.adobe.com/ko_KR/AS3LCR/Flash_10.0/index.html?flash/display/Graphics.html&flash/display/class-list.html 여기에서 보는 바와 같이 target 이라는 속성

자체가 Object로 인식되기 때문에 MovieClip클래스를 확장한 Star 클래스로 star라는 객체를 생성해도

MovieClip이 아닌 단지 Object라 반드시 "형 변환" 을 시켜준다.

그리고 mc의 x, y좌표가 양 쪽 끝이나 stage에 위, 아래에 닿으면 반대방향으로 튕겨 움직이도록 좌표값을

-로 바꿔 넣어준다.

hitTestPoint의 메소드로 겹침여부를 확인한 후, true이면 mc를 2번째 프레임으로 가게해서 노랑색으로

바꾸어 주고, 5도만큼 반대방향으로 각도를 바꿔주면서 tx만큼 간다.

 

 

* hitTestPoint 메소드를 위 예제처럼 TextField를 이용하여 적용시키려면 비트맵 형태로 바꾸어 주어야

      한다. TextField에서 글자를 모두 선택 후, Ctrl + "B" 를 두번 해주어야 비트맵의 형태로 바뀐다.

     

 

2010년 3월 25일 목요일

Sprite 클래쓰 - Drag & Drop( 영역대영역 : hitTestObject )

 

- hitTestObject( obj : DisplayObject ) 메소드는 표시 객체의 경계 상자를 평가하여 obj 표시객체의

   경계 상자와 겹치거나 교차하는지 확인한다. obj는 테스트할 표시 객체이다. 반환값은 true, false로..

 

 

예제를 보면,

 

[code as3]
package classe.view
{
import flash.display.Sprite;
import flash.events.MouseEvent;

public class DragAlphabet extends Sprite
{
    public function DragAlphabet()
    {
        super();

        alpha_a.buttonMode = true;
        alpha_b.buttonMode = true;

        alpha_a.addEventListener( MouseEvent.MOUSE_DOWN, AstartDragHandler );
        alpha_a.addEventListener( MouseEvent.MOUSE_UP, AstopDragHandler );
        alpha_b.addEventListener( MouseEvent.MOUSE_DOWN, BstartDragHandler );
        alpha_b.addEventListener( MouseEvent.MOUSE_UP, BstopDragHandler );
    }

    private function AstartDragHandler( e:MouseEvent ) : void
    {
        alpha_a.startDrag();
        alpha_a.alpha = 0.5;
    }

    private function AstopDragHandler( e:MouseEvent ) : void
    {
        if( alpha_a.hitTestObject( alphaFrame_a ) )
        {
            alpha_a.x = alphaFrame_a.x;
            alpha_a.y = alphaFrame_a.y;
        }

        alpha_a.alpha = 1;
    }

    private function BstartDragHandler( e:MouseEvent ) : void
    {
        alpha_b.startDrag();
        alpha_b.alpha = 0.5;
    }

    private function BstopDragHandler( e:MouseEvent ) : void
    {
        if( alpha_b.hitTestObject( alphaFrame_b ) )
        {
            alpha_b.x = alphaFrame_b.x;
            alpha_b.y = alphaFrame_b.y;
        }

        alpha_b.alpha = 1;
    }
}
}
[/code]

-> buttonMode가 true이면, 마우스 포인터를 Sprite객체위에 놓으면 모양을 손가락 모양으로 바꾼다.

* 그런데 만약 Sprite 객체로 버튼을 만들어 꾸며서 사용할 경우에는 buttonMode = true 속성 뿐 아니라,

useHandCursor = true 속성과 mouseChildren = false 를 함께 적용해주면 예기치 않은 동작에서 벗어 날

수 있다.

useHandCursor는 기본값이 true인데 이 속성은 buttonMode = true인 상태에서 손 모양 커서를 표시하겠다는 뜻이고, mouseChildren 해당 객체의 자식에서 마우스의 기능을 사용할 것인지의 여부이다. 결론적으로 false인데 그 이유는 예를 들어

 

[code as3]
var spriteArea Sprite = new Sprite();
addChild( spriteArea );

var circle Sprite = new Sprite();
circle.graphics.beginFill( 0xFFFF00 );
circle.graphice.drawCircle( 0, 0, 100, 100 );
addChild( circle );

spriteArea.mouseChildren = false;
[/code]

이런식으로 자식 인스턴스에서만 마우스가 표시되어야지 부모까지 적용이 되게하면 마우스 포인터를 궂이

손 모양으로 지정해주는 의미가 없어지기 때문이다. 더 정확히 http://67740420.textcube.com/?page=9

여기 예제에서 Search 버튼인 자식 인스턴스에서는 손 모양이 적용되고 버튼 바깥부분인 부모 인스턴스에서

는 평범한 화살표 모양으로 바뀌게 되는 것이다.

 

if문 조건에서인 alpha_a인 지한 A무비클립(Sprite 객체)과 alphaFrame_a인 연한 색의 stage에 있는 A무비클립(DisplayObject 표시 객체) 영역의 겹침 부분을 감지하여 Boolean값으로 반환한다. 그런데 여기서 영역 대 영역으로 감지란 눈에 보이는 무비클립의 모양이 아닌, 네모 영역으로 겹침을 판단한다.

이렇게 되면 if조건을 true로 인식하고 alpha_a의 x와 y좌표 위치를 alphaFrame_a의 x와 y좌표 위치로 이동

시키는 것이다.

 

 

2010년 3월 22일 월요일

Sprite 클래쓰 - Drag & Drop

 

- startDrag() 메소드

   매개변수로는 lockCenter : Booleanboudns : Rectangle 이 있다.

   lockCenter 가 true일 경우, 드래그하는 무비클립의 (+)점에 마우스 포인터가 일치하게 되고, false일 경우

   에는 드래그를 하는 최초 클릭 시작점에 마우스 포인터가 일치하게 된다.

   bounds는 Rectangle클래스의 속성을 쓰는 것과 마찬가지로 x좌표, y좌표, width, height 를 직접 지정해

   주면 된다.

 

 

 

[code as3]
package classes.view
{
import flash.display.Sprite;
import flash.events.MouseEvent;

public class Drag extends Sprite
{
    public function Drag()
    {
        super();

        buttonMode = true;

        this.addEventListener( MouseEvent.MOUSE_DOWN, startDragHandler );
        this.addEventListener( MouseEvent.MOUSE_UP, stopDragHandler );
    }

    private function startDragHandler( e:MouseEvent ) : void
    {
        this.alpha = 0.5;
        this.startDrag();
    }

    private function stopDragHandler( e:MouseEvent ) : void
    {
        this.alpha = 1;
        this.stopDrag();
    }
}
}
[/code]

 

This is part of Korea.

 

 

 

 

 

 

 

  참신해.

2010년 3월 13일 토요일

ColorTransform

ColorTransform 클래스를 사용하여 DisplayObject의 색상값을 조절할 수 있다. 다시 말해서

Advanced Effect 효과를 액션스크립트로 표현할 수 있다.

 

http://help.adobe.com/ko_KR/AS3LCR/Flash_10.0/index.html?flash/display/Graphics.html&flash/display/class-list.html

*모든 눈에 보이는 객체는 ColorTransform을 갖고 있다. " 1pixel = 0xAARRGGBB "

   여기서 AA(Alpha)값은 BitmapData에서만 쓰인다. 보통은 0xRRGGBB로 쓴다. -255~255까지.

   redMultiplier, greenMultiplier, blueMultiplier는 0~1 사이 값에서 유효하다.

 

 

-

 

 

 

 

-

-> 스테이지를 클릭했을때, changeHandler 함수를 호출하여 ColorTransform에서 ct라는 객체를 생성하고,

     ct의 색을 노랑색으로 지정한다. 스테이지에 있는 무비클립 nemo와 pic을 ct의 색상를 변경한다.

 

 

예제2>

 

 

-->

 

 

 

 

 

 

 

 

 

 

 

 

 

2010년 3월 12일 금요일

Point 클래쓰 - offset

3. offset( dx:Number, dy:Number ) : Void

 

   -> point가 매개변수로 입력된 값만큼 이동한다.

 

-

-

-

- Cir클래스에서 100개의 무비클립을 생성 후 이벤트로 호출한다. 1초당 해당 프레임 수 만큼.

   여기서 무비클립의 위치를 스테이지의 정중앙으로 위치해주고 화면에 표시될 수 있도록 addChild해줌.

   첫 무비클립에서부터, 정중앙에서 3만큼 떨어지고 Math.radom()*Math.PI*2 각도에 위치한 pt를

   Point 객체로 생성. 그리고 pt2라는 Point객체를 만들어 e.target(=Cir에서 생성한 무비클립)의 x, y좌표를

   초기화하여 생성후 처음 pt의 위치를 방금 생성한 pt2에 offset시킴(=재정렬).

   그리고 마지막으로 실제 무비클립의 위치를 offset한 pt2의 x, y의 좌표로 대입해줌.

 

 

 

원래는 저런 소스였지만, cpu 점유율이 높다는 스터디 선생님의 지적을 받고 수정해주셨다!!

실제 flash가 전체 중에서 25~30%을 차지하던 것이 20~25%로! 내가 봤을 때 차이는 아주 미미하였으나,

1%를 줄이기 위해 몇 일 밤을 샐 날이 곧 올꺼라는.... 그럴 스멜....ㅋㅋ

 

 

[code as3]
package classes.view
{
import flash.display.Sprite;
import flash.display.MovieClip;
import flash.events.Event;
import flash.geom.Point;

public class Main extends Sprite
{
    public function Main()
    {
        super();

        config();

        addEventListener( Event.ENTER_FRAME, loop );
    }

    private function config() : void
    {
        for( var i:int = 0; i < 100; i++ )
        {
            var temp:MovieClip = new Cir();

            temp.x = stage.stageWidth / 2;
            temp.y = stage.stageHeight / 2;
   
            addChild( temp );
        }
    }

    private function loop( e:Event ) : void
    {
        for(var i:int = 0; i < 100; i++)
        {
            var pt:Point = Point.polar( 3, Math.random() * Math.PI*2 );

            var pt2:Point = new Point( getChildAt(i).x, getChildAt(i).y );

            pt2.offset( pt.x, pt.y );

            getChildAt(i).x = pt2.x;
            getChildAt(i).y = pt2.y;
        }
    }
}
}
[/code]

Point 클래쓰 - polar

2. polar( len:Number, angle:Number ) : Point

 

   -> 한 점에서 특정 반경 안에 있는 점들을 구할 수 있다.

 

-

- 30/1000 초로 300번 loop 함수 이벤트 등록해주고, Mark라는 링키지 걸어둔 무비클립을 생성후,

   tempPoint라는 Point 객체를 초기화하는데, 0에서100사이인 원의 반경으로 Math.random()*Math.PI*2

   만큼의 각을 가진 점의 위치를 스테이지 정중에서부터 떨어뜨려 무비클립의 좌표에 넣는다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

-> 원래는 이런 소스였으나, 삭제하고 다시 그리는 모양으로 !

 

[code as3]
package classes.view
{
import flash.display.Sprite;
import flash.display.MovieClip;
import flash.events.TimerEvent;
import flash.geom.Point;
import flash.utils.Timer;

public class Main extends Sprite
{
     public function Main()
    {
        super();

        config();
    }

    private var cx:Number = stage.stageWidth / 2;

    private var cy:Number = stage.stageHeight / 2;

    private function config() : void
    {
        var timer:Timer = new Timer( 30 );

        timer.addEventListener( TimerEvent.TIMER, loop );
        timer.start();
    }

    private function loop( e:TimerEvent ) : void
    {
        if(numChildren > 150)
        {
            while(numChildren)
            {
                removeChildAt(0);
            }
        }

        var temp:MovieClip = new Mark();
       
        var tempPoint:Point = new Point();

        tempPoint = Point.polar( Math.random()*100, Math.random()*Math.PI*2 );

        temp.x = tempPoint.x + cx;
        temp.y = tempPoint.y + cy;

        addChild( temp );
    }
}
}
[/code]

 

 

Timer 속성에서 count가 300번인 것을 없애고, loop함수에 numChild 속성을 이용하여 0.03초 마다

이벤트에 의해 나타나는 무비클립을 150번까지 if문으로 제한을 두고 151번째에 removeChildAt 속성을

이용해 한번 싹~ 지워준뒤 다시 그려준다.

 

-

-

-

-

Point 클래쓰 - interpolate

Point 클래스는 직교 좌표계의 한 점을 가지는 클래스이다. 이 클래스를 사용하면 두 점 사이의 거리 및

극 좌표를 직교 좌표로 변환하는 등 다양한 작업이 가능하고, 다른 클래스에 있는 메서드의 매개변수로

Point 객체가 많이 사용되기 때문에 중요하다.

 

1. interpolate( pt1:Point, pt2:Point, f:Number ) : Point

   

    -> 지정한 두 점 사이에서 한 점을 정한다. 단, f값은 0~1사이 값을 갖는다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

-

-

-

 

 

 

 

 

 

 

 

 

 

 

 

 

 

* Mark에서 생성한 무비클립을 보통 더 가볍게 하기 위해 Properties -> Base Class를

   Sprite로 해도 무방하다. 하지만 위에서 처럼 무비클립에 모션을 첨가하고 싶다면 반드시

   Base Class를 MovieClip으로 해야한다!