2011. 1. 13. 20:53

이벤트란 무엇인가요? #1


내가 처음 3.0을 접했을때가 불과 2년전이었는데 그때 가장 어렵게 느껴졌던게
도무지 "이벤트"라는 녀석과 친해지기 어렵다는 사실이었다.

도데체 왜 "이벤트"라는 놈을 갖고 코드를 작성해야만 할까.
"이벤트"없이 코딩할 수 있지 않을까?

라는 고민으로 수없이 많은 생각들을 하곤했었는데

그것에 대한 결론으로는 여기를 확인하면 좀 도움이 되리라 생각된다.
결론적으로는 ActionScript의 태생적 이유때문이라는 것인데 ECMAScript를 모태로 삼고있는
ActionScript로써는 개발자가 원하는 흐름대로 코드를 진행하기 위해서는 이벤트를 사용해야만 한다고
결론 지었다.
또다른 결론이 하나 더 있는데 이는 어플리케이션을 구성하는데 있어서 구조적으로 "약한결합"을 사용해야 유지보수, 클래스의 컨포넌트 화(化), 등이 용이하다는 결론.

위와같은 결론 덕에 결국 이벤트를 사용하긴 해야겠는데 뭘 어떻게 써야하는 것인지 당최 배우기가 마땅찮다.
그래서 일단 이벤트를 추가하고(import), 등록하고(addEventListener), 행동(Handler) 하는 3가지 단계를 마스터 해보자.

package
{
import flash.display.Sprite;
import flash.display.Graphics;
import flash.events.MouseEvent;

import flash.text.TextField;

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

        createSprite();
        createTextArea();
    }

    private var sp:Sprite;
    private var ta:TextField;

    private function createSprite():void
    {
        if(!sp)
        {
            sp = new Sprite();

            addChild(sp);

            drawSprite();
        }
    }

    private function drawSprite():void
    {
        if(sp)
        {
            var g:Graphics = sp.graphics;

            g.clear();
            g.beginFill(0x00FF00, 1);
            g.drawRect(0, 0, 100, 100);
            g.endFill();

            configureSpriteListeners();
        }
    }

    private function createTextArea():void
    {
        if(!ta)
        {
            ta = new TextField();
            ta.width = 200;
            ta.height = 300;
            ta.x = 110;
            ta.y = 0;
            ta.multiline = true;
            ta.background = true;
            ta.backgroundColor = 0xFFFFFF;

            addChild(ta);
        }
    }

    private function configureSpriteListeners():void
    {
        sp.addEventListener(MouseEvent.CLICK, spriteClickHandler);
    }

    private function spriteClickHandler(event:MouseEvent):void
    {
        ta.appendText("click sprite! \n");
    }
}
}
위의 코드를 한글로 번역을 하자면 이렇다.
"sp라는 Sprite객체를 만들어서 너비 100, 높이 100 사이즈의 초록색 네모를 그린다음 클릭하면 "click sprite!"라는 메시지를 ta라는 TextField객체에 출력해라!"

라는 것이다. 컴퓨터 나라말은 참 다양하지만(JAVA, C, C++, ActionScript, JavaScript.. 등등) 번역하고 보면 별거 없는 것같은 기분이다.
어쨌든 저 코드를 컴파일 해보자.
 
그럼 저 Main.swf를 실행해볼까.. (아래의 녹색 상자를 클릭해보세용)



간단하게 CLICK 이벤트를 등록하고 작동하게하는 예제를 만들어 봤다.

나름 간단하게 작성된 예제인데 여기서 드는 의문점은 해당 클래스에 등록할 수 있는 이벤트들은 어디서 확인하느냐는 의문.
그런 이벤트에 관련된 사항은 Language Reference를 확인하면 된다.
예를들어 방금 사용한 Sprite 클래스를 확인해보면

어떤 이벤트를 등록(addEventListener) 할 수 있는지 확인할 수 있다.
게다가 친절하게도 어떤 시점에서 이벤트가 발생하는지 설명도 해줬다. 좀 괜찮은데?

예전에 같이 일하던 분이 요런 말씀을 해주셨더랬다.
"궁금하면 API 뒤져봐"
그말이 진리. ㅎㅎㅎ

Sprite 클래스는 내부적으로 스스로를 클릭하면 CLICK 이벤트를 발생하게끔 설계되어있다.
그럼 우리는 그런 이벤트를 수신할 수 있도록 addEventListener를 통해 이벤트를 등록한다.
이때 같이 들어가는 Handler는 이벤트가 수신했을 때 실행하게 된다.

대략 이런 모양.
이미지 출처는 제가 그렸으므로 함부로 퍼가면 안됩니다. 말씀은 해주시고 퍼가세요.

Sprite는 addEventListener를 하든 말든 어차피 클릭을 하면 CLICK이벤트를 발생시킨다.
그럼 어떤 누군가는 addEventListener를 해서 핸들러를 실행시키겠지.
이벤트의 등록과 핸들러의 실행의 구조적인 모양새는 이런 모양이다.
그럼 클래스도 누군가가 만들어 사용하는 걸텐데 (적어도 신이 만든건 아닐거 아냐) 나도 만들어 볼 수 있지 않을까??

두둥. "이벤트란 무엇인가요? #2" 예고편.

1. 내가 만든 이벤트?
2. dispatchEvent?
3. 오오오오.....(뭐지???)