Programming/Web

FLEX :: 플렉스 빌더 2로 Hello Flex 를 만들어 보자 [2/2]

appHunter 2009. 5. 6. 20:42
글을 다 날려서 다시 적는다. !!  (2009-05-06에 날림) 

2007/07/06 xx:xx   원본보기


기본적인 개념을 익혔으면 이제부터 한 번 만들어 보자.

프로젝트 생성

    1. 다음과 같이 프로젝트 생성을 시켜보자. Flex Project 를 선택하자

사용자 삽입 이미지


Flex Project : 일반적인 플렉스 어플리케이션을 만들 때 생성
ActionScript Project : 플래시의 API를 사용하는 액션 스크립트 클래스를 만들 때                                     생성
Flex Library Project : SWC라는 플렉스 컴포넌트 아카이브 파일을 만들 때 생성


    2. 다음과 같이 3가지 프로젝트 생성 옵션이 있다.  Basic 을 선택하자

Basic : 작성한 플렉스 소스 파일을 플렉스 빌더 2에서 컴파일하여 사용
ColdFusion Flash Remotiong Servie : ColdFusion 컴포넌트를 호출하여 사용할 수 있는                                                     프로젝트
              ( ColdFusion  MX 가 설치 되어 있어야 함. )
Flex Data Services : 플렉스 데이터 서비스2 에서 컴파일 하는 방법.

사용자 삽입 이미지


    3. 이름과 경로 지정

사용자 삽입 이미지


    4. 파일명과 폴더 지정             
 
사용자 삽입 이미지

다음과 같이 생성 된 것을 확인 할 수 있다.

사용자 삽입 이미지

bin : 컴파일 된 FLEX 어플리케이션 파일(swf 파일)이 저장되는 디렉토리
html-template : 생성된 swf를 임베드 할 수 있는 html wrapper 페이지가 저장되는 디렉토리
.settings : 해당 프로젝트에 관련된 FLEX Builder에 대한 여러 가지 설정 파일이 저장되는 디렉토리
.actionSciprtProperties, .FLEXProperties, .project 파일 : 프로젝트 설정 파일들
 
<tip : 그림과 같이 Build Automatically 을 선택해 놓으면 mxml을 저장할 때마다 자동으로
             업데이트 된 swf  파일을 생성해준다. >

사용자 삽입 이미지

      
컨테이너와 컨트롤 배치  

    1. Panel 컨테이너 배치
   
      
    안될때는
    ( Window -> Components 가 체크되어 있는지 확인한다 )
    ( 디자인 모드인지 확인한다. )

    2. 컴포넌트 추가

        ( Button  On click 의 입력란에는 mx.controls.Alert.show('Hello' + txtName.text) 라고 입력 )



    지금까지 Source 는 Source 모드에서 볼 수 있다.

사용자 삽입 이미지


실행

    1. 플렉스 애플리케이션을 실행