Monthly Archive for February, 2007

Debugging Tool – X-ray

Published on 2007/02/25 in Flash-Tip. 0 Comments Tags: , .

2006 FlashFoward 에서 finalist 에 오른 플래시 실시간 디버깅 툴이다.
플래시의 가장 큰 단점중에 하나가 기타 프로그램언어에 비해 디버깅 기능이 빈약하다는 것이다.
물론 플래시내에서 디버깅 기능을 지원하지만 직관적이지 못한 구조로 대부분 오류코드를 직접 작성해 trace 로 찍어보는 방법이 가장 빠를것이다.
기존에 써오던 Alcon 이라는 디버깅 툴보다도 훨씬 강력한 기능을 가지고 있는 것 같다.

이 툴은 틀별한 과정없이 컴포넌트를 설치하고 타임라인 상에 드래그하여 export 하면 Interface window 를 통해 모든 오브젝트를 runtime 으로 확인하고 수정해볼 수도 있다.

이런 디버깅 툴이 가장 필요할때는 아마 웹상에 올려져있는 플래시 파일을 디버깅할때 일것이다.
이런툴을 사용하지 않고 원하는 데이타가 제대로 들어오는지, 웹상에 올려져 있는 플래시 파일을 디버깅 하려면 자바스크립트로 alert 창을 띄우는 방법밖에 없을것이다.

특히 필터효과 같은 경우 사용자들이 원하는 효과를 얻으려면 많은 테스트를 해보고 그 값 적용하는데 이 툴에서는 필터효과를 실시간으로 적용할수 있고 그 코드값을 복사해서 그대로 사용할수도 있다.

-Features

  • View physical parent/child relationships of all your objects/movieclips in the treeview
  • View all properties/methods associated with an object/movieclip
  • Drill down through any objects/movieclips/arrays in the Datagrid
  • Execute actionscript at runtime. Call any of your methods from the interface at runtime!
  • Control at runtime:
    • MovieClips – Edit all properties, including: Rotate, scale, move, opacity, properties, play, gotoAndPlay/Stop/labelName
    • TextFields – same as movieclips, as well as edit text, HTML text
    • Buttons – same as movieclips
    • video objects (NetStream) – play, pause, stop, view properties in realtime as video plays
    • Sound objects – play, stop, set loops, view ID3 information, all sound properties.
  • Use the _global.tt() to send any object/property to the output panel. Xray.trace() will recurse any object/array and display in the output panel a tabbed relational view of the object/array.
  • Use the search tool to search the output returned.
  • History info – use property settings saved in the history in your FLA or to reset your application to a specific state
  • Filters Panel – use Flash8 filters at run time and copy/paste the code for use in your FLA

    관련사이트
    http://osflash.org/xray

    • Loading Zip files into Flash

    Published on 2007/02/13 in Flash-AS3.0. 0 Comments Tags: , .

    As3.0 에서는 ByteArray Class 의 지원으로 bynary code 를 직접 플래시에서 읽고 쓸수가 있다.
    플래시 외부로 data 를 export 할때나 불러들일때 압축된 bynary string 를 사용할 수 있어 기존에 할수 없었던 많은 작업들이 가능해졌다.

    그중에 하나가 flash 안으로 zip 파일 형태를 로드할 수 있다는 것이다.
    또한 그 스트리밍 데이타를 이용하여 zip 파일내에있는 이미지나 파일이 로드될 때 가져와서 쓸 수 있다.
    단, 여기서 소개된 소스는 standard zip 파일 형식만 지원한다.

    public function loadZip() {
   var request:URLRequest = new URLRequest("your.zip");
   var zip:FZip = new FZip();
   zip.addEventListener(FZipEvent.FILE_LOADED, fileCompleteHandler);
   zip.load(request);
}
private function fileCompleteHandler(evt:FZipEvent):void {
   var file:FZipFile = evt.file;
   trace("File loaded: " + file.filename)
   trace("  " + file.sizeCompressed);
   trace("  " + file.sizeUncompressed);
}

    관련사이트
    (http://codeazur.com.br/lab/fzip/)

    SWFObject add-on: MouseWheel on Mac

    Published on 2007/02/12 in Flash. 0 Comments Tags: , , .

    관련사이트
    http://blog.pixelbreaker.com/flash/swfmacmousewheel/
    mac os 상에서의 Flash Player 는 마우스 휠을 감지하지 못한다. 따라서 이 문제를 해결하려면 플래시 내부에서 마우스 휠반응을 체크하는 것이 아니라 자바스크립트로 마우스 휠을 감지하여 플래시로 알려줘야 된다.

    SWFMacMouseWheel 라는 자바스크립트 파일을 사용하여 플래시의 내부 함수를 호출한다.
    그리고 플래시에서는 ExternalInterface를 사용하여 자바스립트에서 호출하는 함수를 받아서 마우스 휠 반응을 처리한다.

    <actionscript code>

    import flash.external.ExternalInterface;
import com.pixelbreaker.event.EventBroadcaster;
/**
* @author Gabriel Bucknall
*
* Class that supports using the mouseWheel on Mac OS, requires javascript class
* swfmacmousewheel.js
*/
class com.pixelbreaker.ui.MouseWheel
{
private static var isMac:Boolean;
private static var macBroadcaster:EventBroadcaster;
 
private static function main():Void
{
isMac = System.capabilities.os.toLowerCase().indexOf( "mac" ) != -1;
if( isMac )
{
macBroadcaster = new EventBroadcaster();
ExternalInterface.addCallback( "externalMouseEvent", MouseWheel, MouseWheel.externalMouseEvent );
}
}
/**
* Add a listener for using the mouseWheel
* obj param must have an "onMouseWheel" method to be called.
*/
public static function addListener( obj:Object )
{
if( !isMac ) MouseWheel.main();
if( isMac )
{
macBroadcaster.addListener( obj );
}else{
Mouse.addListener( obj );
}
}
 
/**
* Remove a listener
*/
public static function removeListener( obj:Object ):Void
{
if( isMac )
{
macBroadcaster.removeListener( obj );
}else{
Mouse.removeListener( obj );
}
}
 
private static function externalMouseEvent( delta:Number ):Void
{
macBroadcaster.broadcastMessage( "onMouseWheel", delta );
}
}

    <frame code>

    MouseWheel.addListener(this);

    타임라인 상에 MouseWheel Class 를 사용하여 리스너를 생성한다.

    <html code>

    <script type="text/javascript"><!--mce:0--></script>

    SWFObject 를 사용하여 swf 파일을 임베드하였다. 마지막 줄 코드만 삽입하면 html
    상에서 플래시로 마우스 휠반응을 감지하여 값을 보낼수 있다.

    SWFObject: SWF embed script

    Published on 2007/02/12 in Flash. 0 Comments Tags: .

    SWFObject is a small Javascript file used for embedding Macromedia Flash content. The script can detect the Flash plug-in in all major web browsers (on Mac and PC) and is designed to make embedding Flash movies as easy as possible. It is also very search engine friendly, degrades gracefully, can be used in valid HTML and XHTML 1.0 documents*, and is forward compatible, so it should work for years to come.

    SWFObject는 swf 임베드 자바스크립트 소스이다.

    2006년도 초에 이올라스와의 소송이후 MS에서 IE설계를 바꿔 embed,object 태그의 직접사용을 막아 놓았기 때문에 swf 파일을 html 에 임베드할때 반드시 외부 자바스크립트 파일로 해야지만 플래시 활성화 클릭이 뜨지 않고 보여지게 되었다. 그 이후로 여러 다른 사람들이 만들어 놓은 swf 임베드 javascript 파일 소스를 사용하여 쓰곤했는데 플래시로 변수를 넘겨줄때는 여러모로 불편한 문제가 있었다. 종종 해외사이트에서 사용된 SWFObject 가 오픈 소스였다니….그때는 무심코 넘겼는데 자세히 보니 여러가지로 유용한 점이 많이 있는 것 같다.
    또한 브라우저 종류에 상관없이 모든 플랫폼에 적용되어 범용성 측면에서도 도움이 될 듯 싶다.

    <SCRIPT type=text/javascript>
    var so = new SWFObject(“movie.swf”, “mymovie”, “200″, “100%”, “7″, “#336699″);
    so.addParam(“quality”, “low”);
    so.addParam(“wmode”, “transparent”);
    so.write(“flashcontent”);
    </SCRIPT>

    사용법은 어렵지 않다. SWFObject 객체를 생성해서 파라미터만 넘겨주면 된다. 플래시파일 버전 체크도가능하다. 위에서 보이는 7 이라는 숫자 파라미터가 체크할 Flash Player 버전이다. 여기까지 기존의 임베드 스크립트와 별반 다르지 않다.

    <SCRIPT type=text/javascript>
    var so = new SWFObject(“movie.swf”, “mymovie”, “200″, “100″, “7″, “#336699″);
    so.addVariable(“variable1″, “value1″);
    so.addVariable(“variable2″, “value2″);
    so.addVariable(“variable3″, “value3″);
    so.write(“flashcontent”);
    </SCRIPT>

    위에서와 같이 플래시 파일안으로 쉽게 변수를 넘겨 줄 수 있다. 자바스크립트에 익숙하지 않는 사람에게는 변수 처리하는 과정이 여간 까다로운게 아니다. 브라우저 플랫폼에 따라서 결과 값이 다를수도 있고…. 또한 url 로 붙여서 들어온 변수도 처리해 줄수도 있다. 예를 들어

    http://www.example.com/page.html?variable1=value1&variable2=value2 다음과 같은 주소로 변수가 붙어서 들어왔을 경우

    <SCRIPT type=text/javascript>
    var so = new SWFObject(“movie.swf”, “mymovie”, “200″, “100″, “7″, “#336699″);
    so.addVariable(“variable1″, getQueryParamValue(“variable1″));
    so.addVariable(“variable2″, getQueryParamValue(“variable2″));
    so.write(“flashcontent”);
    </SCRIPT>

    위와 같이 getQueryParamValue 함수를 이용하면 쉽게 플래시 안으로 넘겨줄 수 있다.

    관련 사이트
    http://blog.deconcept.com/swfobject/

    IME-Input Method Editor

    Published on 2007/02/07 in Flash-AS2.0. 0 Comments Tags: , .

    IME(System.IME) Class를 이용하면 클라이언트 컴퓨터에서 실행되고 있는 flash player 에서 운영체제의 IME(Input Method Editor) 를 조절할 수 있다. IME 는 사용자의 문자입력을 받을수 있는 요소로서 흔히 사용하는 Input Textfield 나 TextArea, TextInput 와 같은 component 가 있다. 일정한 폼의 형태로 사용자의 텍스트 정보를 받아야 할 경우 흔히 Input Textfield 를 사용한다. 이때 우리나라와 같이 한글, 영문을 같이 병행하여 사용할 경우 사용자들은 한영키 전환을 잊고 입력하는 경우가 자주 발생한다. 이때 사용성을 높여주는 방법으로써 자동으로 입력 해당필드로 이동했을시 IME Mode 를 변경해 주는 것이다.

    class com.dstrict.UB.util.system.IME {
  /**-------------------------------------------------------------------
    * @description IME Mode 설정
  *-------------------------------------------------------------------*/
  public static function setIMEMode(mode:String):Void{
  
   if(System.capabilities.hasIME) {
   
   if(mode=="KOREAN"){
      mode=System.IME.KOREAN;
   }
   if(mode=="ALPHANUMERIC"){
       mode=System.IME.ALPHANUMERIC_HALF;
   }
  }
  System.IME.setConversionMode(mode);
  
 }
}
<example code>
 import com.dstrict.UB.util.system.IME;
 IME.setIMEMode("KOREAN"); // 한글전환시
 IME.setIMEMode("ALPHANUMERIC"); // 영문전환시

    각 필드에 포커스 되었을때 원하는 모드에 맞게 설정해 놓으면 사용자의 사용성이 개선될 수 있다.