세계의끝과 플래시 원더랜드

ExternalInterface 를 이용하여 플래시 내부에서 필요한 크기의 swf 를 계산하고 html 의 자바스크립트를 호출하여 swf 를 감싸고 있는 div 의 크기를 조절하는 내용입니다.

swf 이 html 에 앉혀지게 되는 object 태그와 embed 태그에는 width와 height를 모두 100%로 설정되어있고, swf 의 외부를 감싸고 있는 div 의 크기가 지정되어 있으므로, 로드된 직후 swf 는 div 와 동일한 크기로 보여집니다.

AS3.0 버전으로는 같은 제목의 포스트를 얼마전에 작성하였습니다. 생각해보면 이런 팁이 필요한 분들은 비교적 가벼운 swf 를(네비게이션 바 또는 플래시 비주얼 무비 같은 것) html 에 사용하는 경우일터라 AS2.0 으로 코딩하는 경우가 압도적으로 많을테고, 3.0 문법에는 익숙하지 않은 쪽일거라 생각하여 이 포스트를 작성하게 되었습니다.

(계속 읽기…)

ExternalInterface 를 이용하여 플래시 내부에서 필요한 크기의 swf 를 계산하고 html 의 자바스크립트를 호출하여 swf 를 감싸고 있는 div 의 크기를 조절하는 내용입니다.

swf 이 html 에 앉혀지게 되는 object 태그와 embed 태그에는 width와 height를 모두 100%로 설정되어있고, swf 의 외부를 감싸고 있는 div 의 크기가 지정되어 있으므로, 로드된 직후 swf 는 div 와 동일한 크기로 보여집니다.

(계속 읽기…)

AS2.0 의 Stage 에는 width 와 height 속성^[01] 이 있어 스테이지의 폭과 높이를 구할 수 있었습니다.

AS3.0 의 stage^[02]  에도 width 와 height 속성이 있습니다만, AS2.0와는 다른 width 와 height 속성을 표시합니다. F1 레퍼런스의 stage 클래스의 속성부분 설명에는 AS3.0의 width와 height 는 표시 객체(DisplayObject : DO)의 폭을 픽셀 단위로 나타낸다고 되어 있습니다. 즉 stage에 전체적인 면적을 커버하는 배경 이미지 같은 것이 없다면 stage 위에 있는 DisplayObject들만의 width와 height를 나타냅니다.

그 대신 AS2.0 의 Stage.width와 Stage.height 는 AS3.0에서는 각각 stage.stageWidth와 stage.stageHeight가 대신하게 되었습니다. 혹시 헷갈리는 분은 아래 swf 를 보시죠.

stageWidth_example.swf 
이 파일을 클릭해서 FlashPlayer 또는 브라우저로 창 사이즈 조절도 해보세요.

버튼을 클릭해서 깃털 객체를 하나 더 만들면 깃털 하나가 200 픽셀이므로 이미 stage 에 표시되어있는 200 픽셀과 더해서 400 픽셀이 됨을 알 수 있습니다. 새로 생성한 깃털은 드래그도 가능하므로 움직여 보세요.

혹시 사용된 코드가 궁금하신 분은 아래를…

(계속 읽기…)

1. 무비클립과는 달리 _width, _height 가 아닙니다. [↑]
2. AS2.0은 Stage(대문자 S) 였지만 AS3.0은 소문자 입니다. [↑]