Flex Builder로 AIR 어플리케이션 만들기

AIR 도움말에 있는 Flex Builder로 간단한 Hello World를 만드는 예제를 직접 따라해봤다.

Flex Builder를 실행해 AIR 프로젝트 만들기

1. Flex Builder 3를 실행한다.

2. 메뉴에서 File > New > Flex Project를 선택한다.

3. Project name을 AIRHelloWorld로 입력한다.

4. Application type을 Desktop Application으로 선택한다.

5. Finish를 눌러 완료한다.

코드 작성하기

1. WindowedApplication 컴포넌트의 title 속성을 "Hello World"로 입력한다.

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" title="Hello World">
    
</mx:WindowedApplication>

2. Label 컴포넌트를 추가하고 text 속성을 "Hello AIR"로 설정하고 가운데 정렬로 배치한다.

<?xml version="1.0" encoding="utf-8"?><?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" title="Hello World">
    <mx:Label text="Hello AIR" horizontalCenter="0" verticalCenter="0"/>
</mx:WindowedApplication>

3. 아래 스타일 블럭을 WindowedApplication 태그안에 Label 태그 앞에 추가한다.

<mx:Style>
    WindowedApplication
    {
        background-color:"0x999999";
        background-alpha:"0.5";
    }
</mx:Style>

이 스타일은 윈도우 배경을 반투명 회색으로 만들어 준다.
아래가 완성된 어플리케이션 코드이다.

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" title="Hello World">
    <mx:Style>
        WindowedApplication
        {
            background-color:"0x999999";
            background-alpha:"0.5";
        }
    </mx:Style>
    <mx:Label text="Hello AIR" horizontalCenter="0" verticalCenter="0"/>
</mx:WindowedApplication>

다음으로 어플리케이션이 투명해보이도록 몇가지 설정으로 수정한다.
1. 좌측의 Flex Navigator에서 src 폴더에 있는 AIRHelloWorld-app.xml(application descriptor file이라고 한다)을 더블클릭해서 에디터로 연다.

2. systemChrome과 transparent 속성을 찾아 "<!--", "-->" 커맨트를 제거한다.
3. systemChrome 값을 none으로 설정한다.

<systemChrome>none</systemChrome>

4. transparent값을 true로 설정한다.

<transparent>true</transparent>

5. 파일을 저장한다.

테스트하기

디버그 버튼을 눌러 어플리케이션을 테스트해본다.

패키징, 인증, 실행

1. 어플리케이션이 잘 작동하는지 확인한다.
2. 메뉴에서 Project > Export Release Version을 선택한다.

3. Next를 누른다.

4. 인증서가 있는 경우 Browse 버튼을 눌러 인증서 파일을 선택하고 Password를 입력한다.

5. 인증서가 없으면 Create 버튼을 눌러 self-signed 인증서를 생성할 수 있다.

6. Next를 누르면 빌드를 시작한다.
7. Finish를 눌러 완료한다.

AIR 파일이 생성되고 Flex Navigator나 탐색기에서 더블클릭으로 실행할 수 있다.