여기서 나온게 Mate Framework라는 것인데, 발음은 메이트가 아닌 마떼라고 발음하는 것이라고 열이아빠님께서 말씀하셨습니다. 조또마떼! 일본애니메이션보면 디게 많이 나오는데...잠만 기댕겨?라는 뜻인듯?-_-;
Mate Flex Framework 공식홈페이지 http://mate.asfusion.com/
Mate Flex Framework 공식홈페이지에 가보면,
Mate is a tag-based, event-driven Flex framework.라고 되어있습니다. tag기반에 event driven 플렉스 프레임워크라는 겁니다.
개발 방식도 우선 Service와 Event를 정의한 EventMap, 그리고, View로 나눠져 있습니다. MVC랑 비슷한 것 같은데, View에서 이벤트가 발생하면 이벤트를 정의해놓은 EventMap에서 찾아서 Event를 발생하죠. 이 EventMap에서는 해당 Service를 호출하는 등의 구조로 되어있어요. 제가 설명하는게 맞는지는 모르겠지만, 대충 저런 구조인 듯하네요. '서비스는 WAS없이도 돌아간다라고 생각하고 짜야된다가 현재의 결론입니다'라고 허광남씨가 말했던 것 처럼 여기서도 Service는 다른 것에 영향없이 돌아가야하는 겁니다.
이 Service는 BlazeDS를 이용한 RemoteObject가 될 수 있고, HTTPService를 이용한 서비스가 될 수 있고, WebService가 될 수 있습니다. 물론, Flex에서 만든 어떤 Method가 될 수도 있습니다.
그러면 해당 서비스를 EventMap에 정의를 해놓고, View에서는 Event를 발생시키기만 하면 되는 겁니다.
백날 말로 하는 것보다 코드로 보는게 빠릅니다-_-;
New -> Project -> Flex Project 를 선택!
Project Name은 HelloMate라고 하고, Web application을 선택하고, Application Server는 NONE으로 Finish고고싱!
Mate Flex Framework공식 홈페이지에 가면 downloads를 클릭하면, swc파일이 있는데요. 이것을 libs폴더에 복사합니다.
우선 패키지를 만들어봅시다.
src에 New -> Folder를 선택해서 events, maps, services, views를 만듭니다.
우선 events에 Event클래스를 하나 만들어봅시다.
New -> ActionScript Class선택 후 Name은 HelloEvent로 하고, Superclass는 flash.events.Event를 선택!
events/HelloEvent.as
[code]
package events
{
import flash.events.Event;
public class HelloEvent extends Event
{
/* Constants */
public static const SAY:String = "sayHelloEvent";
/* Properties */
public var name:String;
public function HelloEvent(type:String, bubbles:Boolean=false, cancelable:Boolean=false)
{
super(type, bubbles, cancelable);
}
}
}
[/code]
SAY라는 상수를 하나 만들어서 sayHelloEvent라고 합시다. 이 이름을 통해 이벤트를 구분합니다.
Properties는 event를 발생할 때 properties값을 지정해서 EventMap에 정의한 메소드에 파라메터로 넣기 위해서 사용합니다.
이제 service를 만들어봅시다.
New -> ActionScript Class선택 후 name은 HelloService라고 합시다.
services/HelloService.as
[code]
package services
{
public class HelloService
{
public function sayHello(name:String):String
{
return "Hello! " + name + ", I'm so sorry but I love dagujitmal";
}
}
}
[/code]
단순히 name을 파라메터로 받아서 Hello!를 붙여줘서 리턴해주는 메소드입니다.
이제 view를 만들어봅시다.
New -> File -> MXML Component선택! Filename은 HelloBox로 하고, Based on은 조낸 귀찮으니까 VBox로 하고, 사이즈도 그냥 그대로 갑시다-_-;
views/HelloBox.mxml
[code]
<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:mate="http://mate.asfusion.com/"
width="400" height="300"
horizontalAlign="center"
verticalAlign="middle">
<mx:Script>
<![CDATA[
import events.HelloEvent;
private function sayHello():void
{
helloDispatcher.generateEvent();
}
private function helloResult(result:String):void
{
myLabel.text = result;
}
]]>
</mx:Script>
<!-- Dispatcher -->
<mate:Dispatcher id="helloDispatcher" generator="{HelloEvent}" type="{HelloEvent.SAY}">
<mate:ResponseHandler type="helloResultResponse" response="helloResult(event.helloResult)" />
<mate:eventProperties>
<mate:EventProperties name="{input.text}" />
</mate:eventProperties>
</mate:Dispatcher>
<mx:TextInput id="input" enter="sayHello();"/>
<mx:Button id="button" label="hello" click="sayHello();"/>
<mx:Label id="myLabel" text="이름을 입력하세요" width="295"/>
</mx:VBox>
[/code]
mate에서 제공하는 Dispatcher기능을 쓰기 위해 네임스페이스를 지정해줍니다.
그리고, <mate:Dispatcher />태그가 있는데요. 여기서 자세히 보면, HelloEvent를 발생하고, 이벤트 종류는 HelloEvent.SAY인 것이죠. 이 이름은 단순 EventMap에 있는 것이랑 매핑하기위해서 쓰인 것 같구요.
이 이벤트를 발생할 때 Properties값은 input에 있는 text값을 넘깁니다. 방금 위에서 HelloEvent를 정의할 때 Properties값 name을 선언했는데, 저렇게 EventProperties에 지정을 해주면 저 값을 물고 들어갑니다.
그다음 그 응답값을 받을 ResponseHandler를 정의해주는데, helloResultResponse는 EventMap에 있는 것이랑 매핑하기 위한 이름이구요, response는 실제 메소드를 호출해줍니다. event.helloResult값은 EventMap에서 정의한 Properties값이구요. 여기서 설명하는 것보다 EventMap을 실제로 보면 이해가 훨씬 빠릅니다.
New -> MXML Component를 선택, Filename은 MainEventMap 그냥 Finish.
<mx:Canvas를 EventMap으로 고칩니다.
maps/MainEventMap.mxml
[code]
<?xml version="1.0" encoding="utf-8"?>
<EventMap xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns="http://mate.asfusion.com/">
<mx:Script>
<![CDATA[
import services.HelloService;
import events.HelloEvent;
]]>
</mx:Script>
<EventHandlers type="{HelloEvent.SAY}">
<MethodInvoker generator="{HelloService}" method="sayHello" arguments="{event.name}" />
<ResponseAnnouncer type="helloResultResponse">
<Properties helloResult="{lastReturn}" />
</ResponseAnnouncer>
</EventHandlers>
</EventMap>
[/code]
EventHandlers를 정의해줬는데 여기서 type은 아까 dispatcher에서 정의한 type과 같은 HelloEvent.SAY가 되겠죠. 그다음 MethodInvoker는 메소드를 호출하는 태그입니다. 위에서 언급했듯이 메소드 말고, RemoteObject나 HTTPService, WebService도 다 됩니다.
generator는 클래스를 적어주고, method에 메소드 이름을 적습니다. arguments에는 파라메터값인데 event.name은 해당 event에서 받은 name을 말하는겁니다. 우리가 Dispatcher에 정의한 name에 input.text값을 넣었으니 그게 들어가는 겁니다. 그다으메 ResponseAnnouncer는 응답을 정의하는 건데, 그 type이 아까 위에서 정의한 그 타입과 일치해야합니다. Properties의 helloResult도 위에 Dispatcher에서 정의한 것과 동일한 이름이여야겠죠. 그러면 저 Properties에 값이 들어가는데 여기서 보면 lastReturn이라고 써있는데, 위에 메소드에서 리턴한 값을 말하는 겁니다.
저렇게 해주면 끝납니다.
이제 마지막으로 main을 작성해봅시다.
HelloMate.mxml
[code]
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute"
xmlns:view="views.*"
xmlns:maps="maps.*">
<!-- Event Maps -->
<maps:MainEventMap />
<!-- views -->
<view:HelloBox />
</mx:Application>
[/code]
EventMap을 추가하고, View만 추가해주면 끝납니다.
실행해봅시다.
댓글을 달아 주세요
다그짓말~ ㅋ
헉..지금 보니까 but I love 'you'가 빠졌습니다.
미안하지만 난 다거짓말을 사랑해가 되버렸어요.
이거 프로그램안에 쓰이는 이벤트를 일괄적으로 정리하는데 큰 도움이 되겠군요.
이벤트를 많이 쓰다보면 출발점과 도착점을 헷갈리는 경우가 많은데...
이렇게 Map으로 관리하면 적어도 도착점을 바로 알 수 있으니 훨씬 쉬워지겠군요.
좋은 글입니다.
넵 이벤트를 EventMap에서 다 정리가 되어있어요.
저 맵대로 이벤트가 발생을 하도록 되어있는 프레임워크더라구요.
저두 더 봐야하는데 ^^
방문해주셔서 감사해요~ ^^
정말 대단한데!!!
응 대단한 프레임워크인 것 같은데, 아직초반이라 뭔가 버그도 많고, 디버깅도 힘들고, 아직 쓸만한게 못돼-_-;
머드님 저거 틀린거 같네요..
i'm so sorry but i love you g r ji ma yo...인데..
암쏘쏘리벗알러뷰그르지마요.
어헛 ^^ 그렇군요 ^^
그나저나 저랑 같은 시간에 댓글을 다셨네요.
저도 방금전에 요 위에위에 글에 댓글을 13시 06분에 달았습니다만-_-;
ㅋㅋ
종종 놀러올께요~
아넵 저도 놀러갈께요 ^^
덕분에 암소땡큐땡썰랏 다 진짜야~ 퍼갈께요.
아네 도움이 되셨다니 다행이네요^^
Mate Flex Framework가 아직은 검증되지 않아서-_-;
실무에서 사용하시는 것은 좀 추천하고 싶지 않습니다-_-;
머드초보님 좋은 정보 감사합니다..;^^
저도 mate 에 대해 공부 중인데.. 요.. sample을 따라 하다 보니..
MainEventMap.mxml에서 <properties helloResult="{lastReturn}"/> 요 라인에..
Could not resolve <properties> to a component implementation. 이라고 에러 메시지 뜨는데요..
어떻게 해야 하나요?
알려주세요^^:;
안녕하세요!
P가 아마도 대문자일겁니다-_-;
한번 해보시고 연락주세요~
asdfa
adfffffffff
아..머드님
MATE Error: Method not found, turn on the debugger for more information
EventType:sayhelloevent. Error was found in a EventHandlers list in file MainEventMap
에러가 뜨고 안됩니다 ㅠ
메소드가 없다고 하는 걸보니.....-_-
근데 제가 mate안한지 오래되어서-_- 소스를 볼 수 있을까요?-_-