[FLEX] FLEX 개발 환경 구축(Flex3 SDK + FlashDevelop3)

1. Flex3 SDK 설치
   - Download : http://www.adobe.com/products/flex/flexdownloads/

    

[그림] ADOBE Flex3 SDK 다운로드 페이지

   - 압축을 임의 폴더 지정해서 푼다 ( 예>C:\Flex3_SDK )
   - [제어판] > [시스템] > [고급] 탭 > [환경변수] 버튼 선택 해서 ANT_HOME 환경변수 설정해준다
     

변수이름 : ANT_HOME   변수값 : C:\Flex3_SDK\ant (SDK를 C:\Flex3_SDK에 설치했기때문)

    

[그림] 시스템 환경변수 설정

2. .NET Framework 설치
   FlexDevelop는 .NET Framework 2.0 이상에서 돌아가기때문에 설치가 안되어 있을경우 설치하라는 오류 메세지가 뜬다
   - 2.0 Download : http://www.microsoft.com/downloads/details.aspx?FamilyID=0856eacb-4362-4b0d-8edd-aab15c5e04f5&displaylang=en
   - 3.5 Download : http://www.microsoft.com/downloads/details.aspx?FamilyID=333325fd-ae52-4e35-b531-508d977d32a6&DisplayLang=en
    (이글을 쓰는 시점에는 3.5가 최신버전으로 3.5링크도 같이 걸어둔다)
  

[그림] .NET Framework 미설치 오류

3. Java Runtime 설치
   Java Runtime 설치가 되어 있지 않을경우 아래와 같이 오류가 뜬다
   - Download  : https://cds.sun.com/is-bin/INTERSHOP.enfinity/WFS/CDS-CDS_Developer-Site/en_US/-/USD/ViewProductDetail-Start?ProductRef=jre-6u7-oth-JPR@CDS-CDS_Developer

[그림] Java Runtime 미설치 오류

[그림] Java Runtime Evironment 6u7 다운로드

4. Flash Develop 3 설치
   이제 Flash Develop 3 를 설치한다
   - Download : http://www.flashdevelop.org/community/viewtopic.php?f=11&t=3589
   - http://www.flashdevelop.org/downloads/releases/FlashDevelop-3.0.0-Beta9.exe

  

[그림] FlashDevelop 실행

5. 이제 정상적으로 잘~ 되는지 HelloWorld 테스트

  - 메뉴 > [Project] > [New Project] > Flex 3 Project (또는 MXML Project) 선택

[그림] Flex 3 Project [또는 MXML Project (Flex3이전??)] 선택

Name : HellowWorld   Location : C:\work_flex (작업폴더 맘대로 입력하세요)   Create directory for project 체크

[그림] 생성된 프로젝트

   - 프로젝트 생성이 완료 되면 아래 Main.mxml을 열어 아래 소스를 입력한다

Main.mxml
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" creationComplete="init()">
    <mx:Script>
        <![CDATA[
            import flash.events.MouseEvent;
            import mx.controls.Alert;
            import mx.controls.Button;
            private function init():void
            {
                this.setStyle("horizontalAlign", "center");
               
                var btn:Button = new Button();
                btn.label = "HelloWorld";
                btn.addEventListener(MouseEvent.CLICK, helloworldClickEvtHandler);
                this.addChild( btn );
            }
            private function helloworldClickEvtHandler(evt:MouseEvent):void
            {
                Alert.show("HelloWorld");
            }
        ]]>
    </mx:Script>
</mx:Application>


   - 컴파일 설정
      메뉴 [Tools] > [Program Settings]  선택하면 Setting 창이 뜬다
      Plugins 에 AS3Context 선택 한후
      오른쪽에 Language에 Flex SDK Location 을 Flex SDK 디렉토리경로로 설정한다 (예> C:\Flex3_SDK)

[그림] Flash Develop Program Setting

   - 설정이 완료되었으면 [Project] > [Build Project](F8) 선택해서 컴파일 한다

[그림] 컴파일 결과

   - 컴파일 완료 되면 오른쪽 Project 란 bin 폴더에 파일이 추가된걸 확인할 수 있다

[그림] 컴파일 완료된후 생성된 HelloWorld.swf

   - index.html 파일을 마우스 오른쪽 버튼으로 Excute 메뉴를 선택해서 결과물을 실행해 본다

[그림] 결과 실행

* 참고 : http://cafe.naver.com/flexcomponent/1223