http://ssen.name/recipe 에 연재되는 글 입니다.
참고를 위해서 링크만 걸라고 했는데 회원가입을 해도 내용이 보이지 않아 염치불구하고 불펌 했습니다.
*.swc
swc 파일은 플래시가 컴파일 타임에 활용할 수 있는 라이브러리 패키지 파일 입니다. 보통 액션스크립트 라이브러리는 이 swc 를 기본으로 해서 많이 배포되게 되죠.
파일 형식은 PKZip 형태를 따르기 때문에 확장자를 zip 으로 바꾼뒤에 압축프로그램으로 풀면 압축이 풀리게 됩니다.
압축을 풀어보면 이렇게 catalog.xml 과 library.swf 파일이 보이게 되는데요. xml 파일을 보면
이와 같이 swc 에 등록되어 있는 라이브러리들의 목록이 나오게 됩니다. 그 외, 실제적인 내용물은 swf 에 들어있구요.
FDT 의 swc outline view 사용해서 본 화면입니다. 목록과 같은 구성을 가지고 있죠.
swc 의 특징을 이야기하자면
- 컴파일이 되어있기 때문에 실제 작업물의 컴파일 시에 컴파일 시간을 잡아먹지 않는다. (이미지나 폰트, 사운드 등도 포함)
- 소스코드의 공개없이 소스를 배포할 수 있다. (디컴파일러는 제외)
뭐 이정도가 되지 않을까 싶네요.
그리고, ActionScript 라이브러리 답게 당연히 Flash, Flex builder, FDT 등 모든 swf 를 만들 수 있는 툴들에서 사용할 수 있습니다.
Flash 에서 swc 파일 만들기
뭐 익숙하실 겁니다. Flash 의 라이브러리 창이죠. 이렇게 라이브러리에 여러가지 요소들을 배치해놓은 다음
Publish Settings > SWF Settings > Export SWC 에 체크한 다음에 우리가 늘 상 하듯 Ctrl + Enter 로 컴파일을 하면
보는바와 같이 기존 swf 파일 이외에 swc 파일이 추가로 만들어지게 됩니다.
fla 파일 중심의 작업 환경 바꾸기
위와 같은 Flash 에서의 swc 만들기는 굉장히 중요한 의미를 지닙니다. 바로, 이 강좌가 지향하는 가장 큰 목적 중 하나인 “fla 파일 중심의 작업 환경” 을 개선 하는 것이지요.
이런 Flash 상의 라이브러리와 코딩툴의 공유 불가를 비롯해서 Flash 중심의 개발은 상당히 많은 문제들이 있습니다.
- Flash 라는 버전별로 컴파일에 대한 판정이 틀린 불안정한 프로그램을 통해 컴파일 하기 때문에 유지보수에 문제가 생깁니다. 이 문제는 Flash 를 오랫동안 사용해온 분들이라면 누구나 알고 있는 문제일 겁니다.
- Flash 라이브러리에 존재하는 Asset 들에 대한 코드 어시스트를 지원받지 못하게 되기 때문에 flash.utils.getDefinitionByName() 과 같은 것으로 호출할 수 밖에 없게 되고, 당연히 라이브러리에 존재하는 Image1 BitmapData 를 new Image1() 로 코딩할때 FDT 나 Flash Builder 와 같은 실시간 에러감시 기능이 있는 툴에서는 에러표시가 뜨게 됩니다.
- 최초 컴파일 이후 변경된 요소에 대해서만 컴파일 하는 Flex SDK 기반의 전문 개발툴들과는 틀리게 Flash 는 아직까지는 모든 자원들을 모두 쌩컴파일 합니다. 자원중에 Embed Font 와 같은 것이 들어있다면 디버깅시의 개발속도에 끔찍한 장애를 겪게 되죠.
- 빌드 자동화 툴들을 사용할 수 없는 등 여타의 개발툴을 도입하는 것이 fla 라는 폐쇄적인 파일에 의해서 어려워지게 됩니다.
- Flash 와 개발툴을 왔다갔다 해야합니다.
- 무엇보다… Flash 의 디버깅 및 코딩 같은 개발 환경은 여러모로 즈옷 구립니다.
이런 문제들은 swc 를 통해서 구조적인 문제로 해결이 가능합니다.
swc 를 아웃풋 함으로서 개발툴에서 라이브러리에 대한 직접적인 활용이 가능해지고, Flex SDK 를 사용해서 컴파일 함으로서 ant 와 같은 여러가지 빌드자동화 툴들을 사용한다던가 하는 개발환경의 개선이 가능해지죠. 무엇보다 디자인과 개발의 좀 더 뚜렷한 분리가 가능하기 때문에 디자인과 개발자의 작업자간 결합도를 줄일 수 있습니다. (주고 받고, 주고 받고 하는 삽질을 덜 할 수 있다는거죠.)
물론 Flash 를 중심으로 작업하는 것보다 좀 더 엄격한 작업규칙을 요구하기도 하고, 알아야 하는 것이 많지만 (특히 그래픽스 처리와 같은 것들) 투자 대비 효과가 상당히 큰 편입니다. 특히, 엄청난 개발량을 필요로 하고, 그에 따라 장기적인 유지보수가 필요해지는 대형 어플리케이션 개발이 점점 많아지는 상황에서 Flash 라는 낙후된 개발환경을 중심으로 작업하는 것은 더이상 좋은 방법이 되지 못합니다.
이 강좌는 기본적으로 Flash 를 통해 최종 컴파일을 한다던가 하지 않습니다. Flash 는 어디까지나 간단한 인터렉티브 무비클립이나 디자인 레이아웃을 작업하는 용도로 제한합니다.
compc 를 활용한 swc 만들기
compc 는 이전에 배웠던 mxmlc 와 마찬가지로 Flex SDK 에 속해있는 컴파일러 중 하나입니다. 이 compc 는 swf 를 만들어내는 mxmlc 와는 틀리게 swc 를 만들어내는 컴파일러 입니다. 사용방법도 다르지 않구요.
위와 같은 라이브러리 폴더 구성을 해줍니다.
mxmlc 와 비슷합니다.
-o /Users/seoyeonlee/Desktop/swcTest/swcTest.swc
:: 아웃풋 하기로 한 swc 의 경로를 지정해 주고
-include-sources /Users/seoyeonlee/Desktop/swcTest/src
:: swc 에 포함시킬 소스폴더를 지정해줍니다. (반복 사용 가능)
이 외에 추가적인 옵션을 몇가지 살펴보자면
-library-path /Users/seoyeonlee/Desktop/swcTest/lib/Lib.swc
:: swc 가 직접 참고할 (포함시킴) 다른 swc 라이브러리를 지정합니다.
-external-library-path /Users/seoyeonlee/Desktop/swcTest/lib/Lib2.swc
:: swc 가 간접 참고할 (포함안시킴) 다른 swc 라이브러리를 지정합니다.
이정도가 있습니다. 뭐, 그 외의 옵션들은 크게 쓰일일이 없는 편이고, 필요하다면 검색해서 사용하시면 됩니다.
만들어진 라이브러리를 확인해보면 위와 같이 구성되어지는걸 확인할 수 있습니다. SWCLibrary 내부에 Embed 시킨 이미지, 사운드, 폰트 파일들은 위와 같이 SWCLibrary_ImageCls1 과 같은 형식으로 따로 구성되게 되죠. FlexSDK 의 Embed 에 관련된 각종 mx 라이브러리 들이 같이 들어와있는게 보이네요. 깔끔하게 쓰고 싶다면 mx 라이브러리를 -external-library-path 로 지정해주면 되지 않을까 싶네요.
Flash 에서 swc 사용하기
flash 에서 swc 를 활용하는 방법은 두가지 정도가 있습니다.
Preferences > ActionScript > ActionScript 3.0 Settings… 를 통해서 Flash 가 편집하는 모든 fla 파일에 적용되도록 전역적으로 사용할 수 있구요.
PROPERTIES (패널) > Profile Edit… (버튼) > Script : Settings… (버튼) 를 통해서 편집중인 fla 에서만 적용되도록 사용할 수도 있습니다.
Source path 는 as 파일들이 들어있는 소스폴더 경로를 이야기하고, Library path 는 컴파일 시 포함시킬 swc 파일의 경로, External library path 는 컴파일 시 포함시키지 않을 파일의 경로를 이야기 합니다. (Library path 와 External library path 의 차이는 나중에 런타임 라이브러리 공유에 대해서 알아보면서 설명하도록 하겠습니다.)
참고로 Flash 상에서 라이브러리 경로를 지정하면 보통 절대경로 (ex : c:… 과 같은 모든 경로가 다 나오는 형식) 으로 지정되게 되는데, properties 를 통해서 현재의 fla 에만 적용시키거나 할때는 fla 의 위치를 기준으로 상대경로로 입력을 해줘야 합니다. 그래야 협업 또는 다른 작업환경에서 작업을 할때 fla 를 수정하거나 할 필요없이 작업진행을 할 수 있습니다. 그렇기 때문에 어지간하면 자동으로 경로를 지정해주는 기능을 사용하지 말고, 직접 타이핑 해서 경로를 적는 습관을 들이시는게 좋습니다.
FDT 에서 swc 사용하기
조금 사용법이 틀리긴 하지만, 기본적인 사항들은 같습니다.
위와 같이 프로젝트 폴더상에 swc 파일을 놓습니다.
swc 에서 오른클릭을 하면 위와 같이 Source Folder > Add to Classpath 라는게 보여지는데요. Add to Classpath 를 선택하면
이렇게 해당하는 swc 가 라이브러리로 포함되게 됩니다.
그리고, 위와 같이 프로젝트 위에서 오른클릭을 해서 Properties 를 선택하면
이렇게 FDT Build Path 를 선택할 수 있습니다.
위에 보이는 Source 는 소스 폴더들을 관리하고, Library 는 swc 라이브러리들을 관리하게 됩니다.
그리고, Order and Export 에서는 각 라이브러리들의 우선순위 (같은 Class 가 존재할때, 상위에 있는 것이 우선적으로 swf 에 포함되게 됩니다) 조절을 하게 됩니다.
Flash 에 존재하는 External library path 와 같이 미포함 라이브러리 기능을 원할 경우엔 Up, Down 버튼 아래 보이는 Use as Runtime Shared Code 를 체크하면 해당 라이브러리는 컴파일시에 미포함되게 됩니다.
뭐… Flash 의 Source path, Library path, External library path 와 사용법만 약간 다를뿐이지 기본적인 구성은 같습니다. 이것은 Flash Develop 이나 Flash Builder 역시도 마찬기지 입니다.
다시 mxmlc 로…
swc 에 대한 활용은 mxmlc 를 설명하면서 적어놓았습니다. -library-path 나 -external-library-path 가 그것이죠. 결국 암만 뭐가 복잡해봤자 mxmlc 라는 컴파일러의 기초적인 부분을 알고 있다면 FDT, Flash Develop, Flash 같은 툴의 종류 같은건 별 상관없게 됩니다.
여러분이 정말로 여러가지 개발 환경에 대해서 잘 알고 싶다면 커맨드라인 기반의 툴에 익숙해져야 합니다. Flash Builder 니 FDT 니, Flash 니 따위에 얽매여서 껍데기나 핧는건 그냥 깊은 지식을 쌓는데 별 도움이 안된다는 거죠.
mxmlc 를 통해서 컴파일 하는 연습을 꼭 해보시길 바랍니다. 이번 compc 를 통해 라이브러리를 컴파일 하고, 그 swc 를 가지고 다시 mxmlc 에서 컴파일 하는 것을 커맨드라인을 통해서 계속 해보고, 기존의 프로젝트들도 커맨드라인을 통해서 컴파일 해보고 하다보면 많은 것을 배울 수 있을겁니다.