공부놀이/ActionScripT 2007. 10. 24. 17:13

[3.0] 커스텀 버튼 클래스

package CustomButton {
 import flash.display.Sprite;
 import flash.events.MouseEvent;
 import flash.geom.ColorTransform;
 import flash.text.TextField;
 import flash.text.TextFormat;
 import flash.text.TextFormatAlign;

 public class CustomButton extends Sprite
 {
  private var btnTarget:Sprite;

  private var lbButton:TextField;
  private var lbFormat:TextFormat;
  private var btnName:String;
 
  private var btnColor:uint;
  private var isToggle:Boolean;
  private var isTargeted:Boolean;
 
  private var _toggled:Boolean;
 
  public function CustomButton(mcTarget:Sprite = null, color:uint = 0xffcc33)
  {
   if(mcTarget == null) {
    btnTarget = new Sprite();
    isTargeted = false;
    btnColor = color;
   } else {
    btnTarget = mcTarget;
    isTargeted = true;
    color = 0x000000;
   }
   btnName = "Button";
  }
 
  public function get toggled():Boolean { return _toggled; }
 
 
  public function activate():void
  {
   this.buttonMode = true;
   this.useHandCursor = true;
   draw_button();
  }
 
  public function destroy():void
  {
   isAlive(false);
   this.buttonMode = false;
   
   var dsFormat:TextFormat = new TextFormat();
   dsFormat.bold = false;
   dsFormat.color = 0x777777;
   
   lbButton.setTextFormat(dsFormat);
   
   btnTarget.removeEventListener(MouseEvent.MOUSE_OVER, over_listener);
   btnTarget.removeEventListener(MouseEvent.MOUSE_OUT, out_listener);
   btnTarget.removeEventListener(MouseEvent.MOUSE_UP, up_listener);
   btnTarget.removeEventListener(MouseEvent.MOUSE_DOWN, down_listener);
  }
 
  public function setToggle(val:Boolean):void
  {
   if(val) {
    isToggle = true;
    make_toggle();
   } else {
    isToggle = false;
   }
  }
 
  public function set label(button_name:String):void
  {
   btnName = button_name;
   addLabel();
  }
 
  public function get label():String
  {
   return btnName;
  }
 
  private function addLabel():void
  {
   if(lbButton == null){
    lbButton = new TextField();
    lbButton.width = btnTarget.width;
    lbButton.height = 20;
    lbButton.x = (this.width - lbButton.width)/2;
    lbButton.y = (this.height - lbButton.height)/2;
    lbButton.mouseEnabled = false;
   }
   
   lbFormat = new TextFormat();
   if(!isToggle)
    lbFormat.color = 0xFFFFFF;
   lbFormat.bold = false;
   lbFormat.size = 10;
   lbFormat.align = TextFormatAlign.CENTER;
   
   lbButton.text = btnName;
   
   lbButton.setTextFormat(lbFormat);
   
   this.addChild(lbButton);
  }
 
  private function addListeners():void
  {
   btnTarget.addEventListener(MouseEvent.MOUSE_OVER, over_listener);
   btnTarget.addEventListener(MouseEvent.MOUSE_OUT, out_listener);
   btnTarget.addEventListener(MouseEvent.MOUSE_DOWN, down_listener);
   btnTarget.addEventListener(MouseEvent.MOUSE_UP, up_listener);
  }
 
  private function over_listener(evt:MouseEvent):void
  {
   //trace("over");
   var ovFormat:TextFormat = new TextFormat();
   ovFormat.bold = false;
   ovFormat.color = 0xFFFF00;
   
   lbButton.setTextFormat(ovFormat);
  }
 
  private function down_listener(evt:MouseEvent):void
  {
   //trace("down");
   var dnFormat:TextFormat = new TextFormat();
   dnFormat.bold = false;
   dnFormat.color = 0xCCCCCC;
   
   lbButton.setTextFormat(dnFormat);
  }
 
  private function up_listener(evt:MouseEvent):void
  {
   //trace("up");
   lbButton.setTextFormat(lbFormat);
   //dispatchEvent(new MouseEvent("customCLICK", evt.bubbles, evt.cancelable, evt.localX, evt.localY, evt.relatedObject, evt.ctrlKey, evt.altKey, evt.shiftKey, evt.buttonDown, evt.delta));
   //dispatchEvent(evt);
  }
 
  private function out_listener(evt:MouseEvent):void
  {
   //trace("out");
   lbButton.setTextFormat(lbFormat);
  }
 
  private function draw_button():void
  {
   if(!isTargeted){
    //trace("drawing button elements");
    btnTarget.graphics.beginFill(btnColor);
    btnTarget.graphics.drawRoundRect(0, 0, 80, 20, 5);
    btnTarget.graphics.endFill();
   }
   this.addChild(btnTarget);
   addListeners();
   isAlive(true);
   addLabel();
  }
 
  private function isAlive(val:Boolean):void
  {
   //trace("Button status change");
   var rOffset:Number;
   var gOffset:Number;
            var bOffset:Number;
   if(val) {
             rOffset = 0;
             gOffset = 0;
             bOffset = 0;
   } else {
    rOffset = -125;
             gOffset = -125;
             bOffset = -125;
   }  
   btnTarget.transform.colorTransform = new ColorTransform(1, 1, 1, 1, rOffset, gOffset, bOffset);
  }
 
  private function make_toggle():void
  {
   btnTarget.removeEventListener(MouseEvent.MOUSE_OVER, over_listener);
   btnTarget.removeEventListener(MouseEvent.MOUSE_OUT, out_listener);
   btnTarget.removeEventListener(MouseEvent.MOUSE_UP, up_listener);
   btnTarget.removeEventListener(MouseEvent.MOUSE_DOWN, down_listener);
   
   btnTarget.addEventListener(MouseEvent.CLICK, toggle_listener);
   _toggled = false;
   
   var tgFormat = new TextFormat();
   tgFormat.bold = false;
   tgFormat.color = 0x777777;
   
   lbButton.setTextFormat(tgFormat);
  }
 
  private function toggle_listener(evt:MouseEvent):void
  {
   var tgFormat = new TextFormat();
   if(_toggled) {
    _toggled = false;
    tgFormat.bold = false;
    tgFormat.color = 0x777777;
    dispatchEvent(new MouseEvent("customOFF", evt.bubbles, evt.cancelable, evt.localX, evt.localY, evt.relatedObject, evt.ctrlKey, evt.altKey, evt.shiftKey, evt.buttonDown, evt.delta));
   } else {
    _toggled = true;
    tgFormat.bold = true;
    tgFormat.color = 0xFFFF00;
    dispatchEvent(new MouseEvent("customON", evt.bubbles, evt.cancelable, evt.localX, evt.localY, evt.relatedObject, evt.ctrlKey, evt.altKey, evt.shiftKey, evt.buttonDown, evt.delta));
   }
   lbButton.setTextFormat(tgFormat);
   //trace(_toggled);
  }
 }
}

한번 만들어봤습니다만.

3.0 에서는 굳이 이런식으로 만들 필요 없이 걍 SimpleButton 클래스를 사용하면 될 것 같습니다 -_-

그래도... 요녀석의 장점이라면... 그냥 쓰면 임의대로 Sprite 에서 버튼 모양을 그려준다는 겁니다.
그 버튼의 색도 지정할 수 있구요..
토글식으로 만들어 줄 수도 있습니다.
이경우에는 이벤트 리스너를 걸어줄 때 "customON", "customOFF" 라는 식으로 문자로 걸어주는거죠
뭐 저런건 걍 스태틱 클래스로 모아서 만들어줘도 됩니다만, 아직 제 라이브러리가 없어서 그냥 씁니다 ㅎ

사용법은 간단합니다.
import CustomButton.CustomButton;
// 우선은 Import 를 해줘야겠지요
// package 는 customUI.CustomButton 이지만.. 마음껏 수정하셔도 됩니당
var buttonInstance:CustomButton = new CustomButton(null, 0x000000);
// 앞에는 버튼이 될 무비클립, 요기서 아무것도 지정을 안해주면(null) 임의로 그려줍니다.
// 뒤에는 임의로 그려줄때 버튼의 색으로 쓸 uint 값 그냥 웹컬러 코드에 0x 붙는 시츄 -_-
buttonInstance.activate()
// 버튼 활성화를 해줘야 합니다.
buttonInstance.destroy()
// 버튼 비활성화 메서드
buttonInstance.setToggle(true)
// true, false 로 토글 버튼으로 쓸건지 말건지 정해줍니다


일단 동작은 잘 합니다.
충분한 테스트를 거치치 않은 미완성이긴 하지만... 공부겸 해서 올려둡니다.
,
공부놀이/ActionScripT 2007. 10. 16. 11:47

[3.0] Depth 처리

액션스크립트 3.0 에서는 기존의 액션스크립트 2.0 및 1.0 에서 사용하던
Stage 및 MovieClip 의 구조와 체계가 달라졌습니다.
그래서 Depth 관리 방식도 기존과는 많이 달라졌지요.
 
3.0 에서는 모든 MovieClip 뿐 아니라 Shape, 혹은 새로 생긴 Sprite 등등이 모두 DisplayObject 를 상속하며, 트리구조로 Stage 에(정확히는 DisplayObjectContainer에) 들어가게 됩니다.

뭐 E4X 의 Event 방식을 따르기 위해서 그리 되었는지는 모르겠지만, 관리면에 있어서는 한결 편해진듯 싶군요.

그러한 연유로 3.0 에서는 swapDepths와 getNextHighestDepth() 가 사라져 버렸습니다.
그 MovieClip 혹은 Shape, Sprite 가 언제 생성되었던 간에
addChild 메서드를 사용해서 Stage 에 발라주는 순서에 따라서 위아래가 바뀌게 됩니다.
먼저 addChild 한 녀석이 아래쪽에 붙게 되지요.

하지만 우리가 DisplayObject(MovieClip, Shape, Sprite) 를 사용하다 보면 아래에 있던 녀석을 위로 올린다던가 하는 처리가 필요할 경우가 생기기 마련입니다.

그래서 3.0 에서는 Depth를 처리하기 위해서 몇가지의 메서드를 제공합니다.
그중에서 setChildIndex 만 사용해도 쉽사리 Depth 를 바꿀 수 있습니다.
그러나 2.0 에서 쓰듯이 아무렇게나 Depth 를 지정해서 사용할 수는 없지요

예를 들자면 Stage 에는 TargetName 이라는 녀석을 포함한 DisplayObject 들이 세개정도가 있다고 하면,
setChildIndex(TargetName, 1000000)
이런식으로는 안된다는 겁니다.

그래서 간절해지는 녀석은 2.0 시절의 getNextHighestDepth 인데... 사라지고 없는 녀석입니다.

하지만 역시 또 제공되는 녀석이 있지요.
3.0 에서 새로 생긴 녀석인 Sprite에서 numChildren을 읽어올 수 있습니다.

이녀석은 자신의 자식 객체수를 담고 있습니다. (트리구조를 이루고 있으니까요)
물론 읽기 전용 변수로서 임의대로 갱신할 수는 없습니다.

getNextHighestDepth 처럼 최상위 Depth를 구하기 위해서는 저 변수에 -1 을 해주면 해당 객체의 자식들 중 최상위의 Depth 를 구할 수 있는 것이지요.

그렇게 최상위 위치를 구해서 SetChildIndex 를 해주면, 이전의 위치가 비어버리는것도 아니고,
기존 위치에 있던 녀석이 사라지는것도 아닙니다. 자동으로 Depth 들이 재조정 됩니다.
일일이 신경써줄 필요가 없어지는 거지요.

MovieClip 이나 Sprite 등 DisplayObject 에 대해서는 나중에 따로 다루도록 하지요~~
,
공부놀이/ActionScripT 2007. 2. 28. 04:31

[2.0] 플래시 웹페이지 포커스

Giving keyboard focus to an embedded Flash movie

Issue

A Flash movie embedded in an HTML page does not receive key events when the page first loads in a Web browser.

Reason

In order for a Flash movie to capture key events, the movie itself must first be given focus from the browser. Web browsers do not automatically give keyboard focus to Flash movies, or any other embedded content.

Solution

There are two ways to give focus to the Flash movie.

  • Have the user click in the Flash movie Add a button to the first frame of the movie that the user must click in order to continue (an "Enter", "Start" or "Login" button, for example). Any subsequent key presses can be detected by Flash.
  • Use JavaScript to give focus to Flash The JavaScript focus() method can automatically give focus to the Flash movie when the HTML page containing it loads.

    Note: This method only works on Windows versions of Internet Explorer.
    1. Open the HTML page containing the Flash movie in an HTML editor (Dreamweaver, for example) or text editor.
    2. To the <BODY> tag, add an onLoad handler that gives focus to the Flash movie, as shown below:
      <body bgcolor="#FFFFFF" onLoad="window.document.movieID.focus();">
      Make sure that movieID in the onLoad handler matches the name given to the OBJECT tag used to embed the Flash movie, as shown below.
      <object classid="..." codebase="...."
          width=550 
          height=400     name="movieID">
      You can give any name to the OBJECT tag as long as it doesn't contain any spaces or other special characters.

Product versions affected

5

Last updated: October 17, 2001
Easy Link this TechNote

http://www.adobe.com/go/tn_15586

Easy Links give you a simpler URL to reference in emails, as bookmarks… anywhere.

,
TOTAL TODAY