오늘은 버튼을 이용해서 마우스이벤트에 대해서 알아보도록 하겠습니다.
과연 버튼위에서 마우스가 어떻게 하면 반응을 하는가 입니다.
여러가지 마우스 이벤트가 있으니, 간단히 넘어가도록 하겠습니다.
『ACTIONSCRIPT : Mouse Event Action』
여러분들도 아시다시피, 액션은 버튼인스턴스, 무비클립인스턴스, 그리고 프레임에 넣을 수 있습니다.
^^;
오늘은 버튼에 액션을 넣을 경우, 어떻게 해야 하는가? 에 대해서 한번 살펴볼까 합니다.
저번 액션강좌에서 보면, 아래의 액션을 버튼에 넣었지요...
on(release){
getURL("//www.empas.com", "_blank");
}
위의 액션은 버튼을 누르면, 입력된 주소로 새창을 띄워서 보여주는 것이었습니다.
정확히 말하자면, 버튼을 마우스로 눌렀다가 마우스를 떼는 순간에 아래의 액션이
실행됩니다.
이렇듯 버튼에 액션을 넣을 경우, 일정한 형식으로 넣어야 하는데요.
위의 예와 같이
on(Event){
실행할 내용;
}
의 형식을 취하게 됩니다.
*참고 : 이벤트라는 것은 플래쉬 무비가 재생되는 동안 일어나는 일련의 일들을 가리켜서
이벤트라고 합니다. 예를 들어서, 버튼을 클릭한다던가, 어떤 키보드를 누른다던가, 아님
무비클립이 Load되는 일들 등등. 이 모든것을 이벤트라고 합니다.
또한 버튼 인스턴스에 액션을 입력할 경우 on(Event) 형식을 취하고, 무비클립 인스턴스에
액션을 입력할 경우 onClipEvent(Event)의 형식을 취하게 되는데, 여기에서
on(), onClipEvent()등이 핸들러라고 불립니다. 핸들러는 어떠한 이벤트가 발생되었을 때
이를 처리하는 특별한 액션을 말합니다. (주의 : 입력시 대소문자를 구분해서 적어야 합니다.)
마지막으로, on(Event)나, onClipEvent(Event)등을 가리켜서 버튼 이벤트 핸들러,
무비클립 이벤트 핸들러라고 합니다.
그러면 우리는 버튼 이벤트 핸들러의 종류에 대해서 한번 배우도록 하겠습니다.
종류는 아래와 같습니다.
on(press), on(release), on(releaseOutside), on(rollOver), on(rollOut), on(dragOver),
on(dragOut), on(keyPress)가 있습니다.
각각을 예제와 함께 살펴봅니다.
위에 단순한 버튼이 있습니다. 이 예제를
[다운] 받아서 연습을 해 봅시다.
아래의 버튼 이벤트 핸들러의 예를 보기 위해 각각 스테이지에 있는 버튼을 클릭한 상태에서
액션창(Ctrl+Alt+A)을 열어서 주어진 액션을 넣어봅니다.
---------------------------------------------------------------------------------
on(press)
: 버튼 위에서 마우스 버튼을 클릭했을 때
아래의 액션 삽입
on(press){
getURL("//www.empas.com", "_blank");
}
---------------------------------------------------------------------------------
on(release)
: 버튼 위에서 마우스로 클릭하고나서 마우스 버튼을 뗐을 때
아래의 액션 삽입
on(release){
getURL("//www.empas.com", "_blank");
}
위의 press 이벤트와의 차이점은 press 이벤트의 경우, 버튼을 마우스로 클릭하는 순간
새창이 뜨면서 입력된 주소로 이동하지만, release 이벤트의 경우
버튼을 클릭하고만 있으면 창이 뜨지 않습니다. 클릭한 상태에서 마우스 버튼을
떼는 순간 창이 열리는 것을 알수 있습니다. 직접 해보세요.
---------------------------------------------------------------------------------
on(releaseOutside)
: 버튼 위에서 마우스로 클릭하고나서 마우스를 버튼밖에서 뗐을 때
아래의 액션 삽입
on(releaseOutside){
getURL("//www.empas.com", "_blank");
}
---------------------------------------------------------------------------------
on(rollOver)
: 버튼 위에 마우스 커서가 올라가 있을 때
아래의 액션 삽입
on(rollOver){
getURL("//www.empas.com", "_blank");
}
---------------------------------------------------------------------------------
on(rollOut)
: 버튼위에 올려졌던 마우스 커서가 버튼 밖으로 벗어날 때
아래의 액션 삽입
on(rollOut){
getURL("//www.empas.com", "_blank");
}
---------------------------------------------------------------------------------
on(dragOver)
: 버튼 안쪽에서 마우스를 누른뒤 밖으로 드래그 했다가 다시 버튼 안으로 드래그할 때
아래의 액션 삽입
on(dragOver){
getURL("//www.empas.com", "_blank");
}
---------------------------------------------------------------------------------
on(dragOut)
: 버튼 안에서 마우스 버튼을 누른 뒤 버튼 밖으로 드래그할 때
아래의 액션 삽입
on(dragOut){
getURL("//www.empas.com", "_blank");
}
---------------------------------------------------------------------------------
on(keyPress)
: 키보드의 특정 키가 눌렸을 때
아래의 액션 삽입
on(keyPress "<Enter>"){
getURL("//www.empas.com", "_blank");
}
이 액션은 Enter키를 누를때 새창으로 입력된 주소로 연결을 하는 것입니다.
현재 상태에서 Enter키를 누르면 아무런 반응이 안 일어날겁니다.
이것은 지금 현재 포커스가 위의 플래쉬 무비에 맞춰져 있는게 아니라, 이 페이지에 맞춰져 있기
때문입니다.
위의 플래쉬 무비의 배경을 한번 클릭한 상태에서 Enter키를 눌러보세요.
그러면 새창이 뜨면서 입력된 주소가 열릴겁니다.
---------------------------------------------------------------------------------
이렇듯, 여러가지 버튼 이벤트 핸들러가 있지만, 보통은 on(press), on(release),
on(rollOver), on(rollOut), on(keyPress) 정도가 많이 쓰입니다.
위의 예들을 따라서 해 봤는데 실행이 잘 안되신다구요?
그러면 각각의 액션을 입력시 대소문자를 구분해서 적었는지 꼭! 확인해 보세요.
* 참고 : 플래쉬 액션 입력시 기본적으로는 대소문자 구별을 하지 않습니다.
변수명이나 인스턴스 이름, 속성이름, 그리고 거의 모든 액션이 대소문자 구별을 하지
않지요. 하지만, 키워드나 위에서 본 이벤트 핸들러같은 경우 대소문자를 구분해서
적어주어야 합니다.
키워드 : break, continue, delete, else, for, function, if, in, new, return, this,
typeof, var, void, while, with.
이벤트 핸들러 : on, onClipEvent 등.
자, 오늘은 버튼에 들어가는 여러가지 액션을 배워봤습니다.
여러분들 다음시간에 만나요 ~ ( '')/
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
본 게시물은
//xen.new21.org,
//cafe.daum.net/macromedia,
//www.bcpark.net
외의 이동/불펌을 금지합니다.
더 많은 자료는 사이트나 카페를 찾아주세요...^^*
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━