3단원 플래시 mx2004의 기본 다지기 2 · 2005-10-25 · scrollpane의 양식을 플래시...

1/14

17단원 제안서 매출액 비교 슬라이드 작성3단원 플래시 MX 2004의 기본 다지기 2

3단원

플래시 MX2004의 기본 다지기 2

1. 패널 기능 살펴보기

2. 메뉴 기능 살펴보기

3. 액션 기능 살펴보기

2/14


플래시의 나머지 기능 중 패널의 각 기능과 메뉴 기능, 액션 기능 대해 살펴보도록 하겠습니다.


패널은 그 성격에 따라 사용자가 직접 그룹화하고 패널 환경을 저장할 수도 있으므로 작업 공간을

효율적으로 사용할 수 있습니다. 오브젝트의 속성을 수정할 수 있는 패널, 액션 사용의 효율을 높여주는

패널, 현재 무비에서 사용되는 오브젝트를 한 눈에 알 수 있는 라이브러리 패널로 구성됩니다. 각각의

패널들은 독특한 기능을 가지며 작업에 편리함을 더할 수 있습니다.

메뉴의 Window 의 풀다운 메뉴에서 패널들의 목록을 볼 수 있으며, 패널 각각을 열고 닫을 수 있습니다.

Tab 키를 누르면 패널을 임시적으로 가려주고 다시 보여줍니다. Window > Close All Panels 을 선택하면 모든

패널을 한꺼번에 닫을 수 있습니다.

1. 패널 축소와 확대

패널은 그 크기를 축소하고, 확대시킬 수 있습니다. 삼각형

아이콘을 클릭하면 하위 옵션이 가려지게 되며, 패널을 닫지

않아도 작업영역을 효율적으로 쓸 수 있습니다. 삼각형

아이콘을 클릭하거나 상단 바를 클릭하게 되면 하위 옵션이

보여집니다.

2. 패널의 옵션 메뉴 보기

패널은 각각의 옵션 메뉴를 가지고 있습니다. 오른쪽 상부의

Options Menu control 을 클릭하면 옵션 메뉴가 나타나 선택할

수 있습니다. 메뉴의 가장 하단의 Colse Panel 을 선택하면

패널이 닫힙니다.

3/14


3. 패널의 분리와 병합

패널은 스테이지 위로 독립적으로 분리되고 또 병합시킬 수

있습니다. 패널의 왼쪽 가장 상단을 드래그 하여 분리와 병합을

할 수 있습니다.


1) Color Mixer

색상을 선택하거나 색상을 만들 때 사용합니다

ⓐ Stroke color : 선이나 외곽선 색상을 설정합니다.

ⓑ Fill Color : 오브젝트의 내부(Fill) 색상을 설정합니다.

ⓒ Default Color : 기본 값으로 설정합니다.

ⓓ No Color : 색상을 채우지 않고 투명하게 만듭니다.

ⓔ Swap Colors : 외곽선과 내부(Fill)색상을 바꿔줍니다.

ⓕ Fill Style : 면 색상을 채울 때의 스타일을 지정합니다.

ⓖ 색상성분 : RGB 와 HSB 로 구분되며 수치를 입력하여 색상을 만들 수 있습니다.

ⓗ Alpha : 색상의 투명도를 설정합니다.

ⓘ Color selector : 원하는 색상을 빠르게 설정 할 수 있습니다.

ⓙ 팝업메뉴

4/14


2) Scene

장면들의 순서를 바꾸거나 추가/삭제할 때 사용합니다.

ⓐ Duplicate Scene : 선택한 장면을 복사합니다.

ⓑ Add scene : 새로운 장면을 추가합니다.

ⓒ Delete scene : 선택한 장면을 삭제합니다.

3) Components

UI Components 를 가지고 있는 패널입니다. UI Components 란 플래시 5 의 스마트 가이드의 기능과 비슷한

기능으로 웹에서 많이 쓰이는 CheckBox, ComboBox, ListBox, PushButton, RadioButton, ScrollBar,

ScrollPane 의 양식을 플래시 사용자라면 누구나 쉽게 꺼내어 쓸 수 있도록 라이브러리에 저장되어 있는

오브젝트를 말합니다. 스크립트 언어를 잘 다루지 못하는 디자이너나 일반인들에게 간단한 속성 변화만으로

활용될 수 있도록 컴포넌트가 제공 되었습니다.

4) Movie Explorer

무비 익스플로러는 제작 중인 무비의 계층구조를 한 눈에 알 수 있도록 탐색기의 역할을 합니다. 무비

익스플로러 패널은 주로 Action Script 를 작성하기 위해 무비의 구조를 파악하는데 활용됩니다.

5/14


5) Library

라이브러리는 플래시 무비 안의 자료, 즉 심벌, 사운드, 비트맵 이미지, 비디오 등의 정보를 보관하는 곳으로

각각은 아이콘으로 식별되며 폴더로 정리할 수도 있습니다.

ⓐ 항목 수 : 모든 항목의 개수가 나타납니다

ⓑ 미리 보기 창 : 항목을 미리 보기 합니다.

ⓒ 열 제목 : 라이브러리에 등록이 되어 있는 오브젝트들의 이름과 종류등의 정보가 나타납니다.

ⓓ New Symbol 아이콘 : 메뉴의 Insert>New Symbol 명령과 같은 명령으로 라이브러리 창에 새로운 심벌을

만듭니다.

ⓔ New Folder 아이콘 : 새로운 폴더를 만듭니다.

ⓕ Properties 아이콘 : 선택된 항목의 속성을 수정할 수 있는 대화상자가 옵니다.

ⓖ Delete 아이콘 : 항목이 삭제되고, 한 번 삭제되면 다시 되돌릴 수 없습니다.

ⓗ Sort Order 아이콘 : 이름의 오름차순 또는 내림차순으로 정리 됩니다.

ⓘ Wide State 아이콘 : 모든 열 제목이 보이도록 라이브러리 창을 넓게 합니다.

ⓙ Narrow State 아이콘 : 가장 적절한 정보만을 표시할 정도의 폭으로 라이브러리 창을 보여줍니다.

2. 메뉴 기능 살펴보기

플래시에서 도구상자, 팔레트 기능과 더불어 메뉴의 활용도 많은 부분을 차지합니다. File, Edit, View, Insert,

Modify, Text, Commands, Control, Window, Help 의 10 가지 메뉴로 이루어져 있습니다.

본 학습에서는 각 메뉴별로 세부 명령 중에서 중요한 명령만 살펴보겠습니다.

6/14


File

파일을 관리하는 명령을 사용할 수 있습니다.

<File 의 주요 명령>

Import

-Import to Stage

다양한 미디어 파일을 작업영역으로 곧바로 불러올 수 있습니다.

Export

-Export Image

작업 중인 문서의 한 장면을 이미지 컷으로 만듭니다. 벡터

방식과 비트맵 방식으로 저장이 가능하고 선택한 파일 방식에

따라 옵션을 선택할 수 있습니다.

-Export Movie

플래시 파일을 무비의 형태로 만들어 줍니다. swf 파일이나 avi,

mov 또는 Animated gif 로 만들 수 있습니다.

Publish

Preview 명령과 달리 바로 브라우저가 실행되지는 않지만

Publish Settings 의 옵션대로 결과물을 만들어 주는 명령입니다.

Edit

오브젝트를 편집하는 기본 명령을 제공합니다.

7/14


View

플래시 MX 2004 Pro 의 화면구성을 설정합니다.

Snapping

스냅핑은 설정에 따라서 작업을 매우 간편하면서도 쉽게 하는

팁입니다.

Insert

애니메이션에 필요한 심벌, 레이어, 프레임에 대한 조정 기능을

합니다.

Timeline

-Layer : 타임라인에 새로운 레이어를 추가합니다.

-Layer Folder : 새로운 레이어 폴더를 만듭니다.

-Motion Guide : 선택한 레이어 상위로 모션 가이드 역할을 할

새로운 레이어가 만들어 집니다.

-Frame : 타임라인에 새로운 프레임을 삽입합니다.

-Keyframe : 타임라인에 새로운 키프레임을 삽입합니다.

-Blank Keyframe : 타임라인에 비어있는 키프레임을 삽입합니다.

-Create Motion Tween : 선택한 프레임에 모션 트위닝을

적용합니다.

8/14


Timeline Effects -Assistants

Copy to Grid : 오브젝트를 설정한 칸과 줄 수만큼 복사합니다.

Distributed Duplicate : 오브젝트를 설정한 각도와 위치로

복사합니다.

-Effects

Blur : 오브젝트가 천천히 퍼져 번지는 효과를 만듭니다.

Drop Shadow : 오브젝트에 그림자 효과를 만듭니다.

Expand : 오브젝트를 상하 좌우로 확장시키거나 축소시킵니다.

Explode : 오브젝트가 폭발을 일으키듯이 분해되어 퍼져

나갑니다.

-Transform / Transition

Transform : 오브젝트의 크기, 위치, 색상을 변화시키고, 이동 및

회전 시킵니다.

Transition : 오브젝트가 서서히 나타나거나 서서히 사라지게 함

Modify

프레임, 레이어, 무비 등의 정보와 세부 옵션을 설정합니다.

Symbol

프레임, 레이어, 무비 등의 정보와 세부 옵션을 설정합니다.

-Duplicate Symbol : 선택된 심벌이 라이브러리에 복사되어 등록

됩니다.

-Swap Symbol : 선택된 심벌을 라이브러리에 등록되어 있는 다

른 심벌로 변경할 수 있습니다.

9/14


Timeline

프레임을 조정하는 메뉴들이 있습니다. 타임라인 상의 선택한

프레임을 변경합니다.

-Distribute to Layers : 선택한 오브젝트들을 개수만큼 레이어를

생성하여 각 레이어로 배포하는 기능을 합니다.

-Layer Properties : 레이어의 환경을 설정합니다.

-Reverse Frames : 선택한 프레임의 순서를 역순으로 바꿔줍니

다.

-Synchronize Symbols : 프레임의 심벌을 동기화합니다.

-Convert to Keyframes : 선택한 프레임을 키프레임으로 전환합

니다.

-Clear Keyframe : 선택한 키프레임을 삭제합니다.

-Convert to Blank Keyframes : 선택한 프레임을 빈 키프레임으

로 전환합니다.

Text

플래시 내에서 문자의 속성과 특성을 설정합니다. 메뉴에서보다

는 주로 속성 창을 이용하여 작업을 합니다.

Commands

복잡한 작업을 미리 저장하여 한번 클릭만으로도 간단하게 작업

을 처리하도록 미리 명령를 저장해 놓는 기능입니다. 다른 개발

자들이 만들어 놓은 커맨드 익스텐션을 설치하면 메뉴의

Commands에 추가되고 직접 커맨트를 만들어 추가할 수도 있습

니다.

Control

메인 무비 창에서의 무비재생과 관련된 설정을 할 수 있습니다.

10/14


Window

작업 중에 사용되는 각종 패널과 도구상자를 표시하는데 사용됩

니다.

3. 액션 기능 살펴보기

액션은 타임라인만으로는 불가능했던 다양한 효과와 애니메이션을 만들 수 있게 해주고, 복잡한 반복적인

작업으로 인한 많은 시간과 노력을 줄일 수 있도록 해줍니다. 몇 가지 용어와 방법만 이해한다면 쉽게

액션을 다룰 수 있게 될 것입니다.

1) 액션의 개념

액션 스크립트는 플래시의 버전 5 부터 사용된 스크립트, 즉 간단한 프로그램

언어입니다. 액션 스크립트는 타임라인만으로는 불가능했던 다양한 효과와 애니메이션을 만들 수 있게

해주고, 복잡하고 반복적인 작업으로 인한 많은 시간과 노력을 줄일 수 있습니다.

2) 액션 스크립트로 할 수 있는 것들

① 타임라인을 컨트롤합니다. 버튼 액션스크립트를 이용하여 무비를 실행하거나 멈출 수 있습니다.

② 메뉴와 관련된 페이지로 이동합니다. 버튼을 클릭하면 메뉴와 관련된 페이지로 이동하는 무비를 만들 수

있습니다.

③ 키보드로 무비를 제어합니다. 키보드의 특정키를 누르면 원하는 페이지로 이동하도록 설정할 수 있습니다.

④ 외부에 있는 플래시 무비를 불러옵니다. 미리 만들어 놓은 플래시 파일을 불러와 새로운 무비를 간단히

만들 수도 있습니다.

⑤ 하이퍼링크를 설정합니다. 버튼에 하이퍼링크를 설정하여 원하는 사이트로 이동할 수도 있고, 이메일로

보낼 수 있습니다.

⑥ 플래시 무비를 브라우저와 연동시킵니다.

⑦ 무비클립을 드래그하여 원하는 곳으로 이동할 수 있습니다.

⑧ 마우스 커서의 모양을 바꿉니다.

11/14


⑨ 플래시 무비의 현재 로딩 상태를 알려주는 프리로딩을 만들어 보여줍니다.

⑩ 오브젝트의 속성(색상, 크기, 위치, 투명도)을 변경합니다.

⑪ 오브젝트의 충돌 감지를 이용하여 게임 등에 응용할 수 있습니다.

⑫ If 조건문을 이용하여 퀴즈 게임을 만들 수 있습니다.

3) 액션의 종류 알아보기

액션은 액션을 입력하는 대상과 역할에 따라 구분합니다. 액션을 입력할 수 있는 대상은 프레임, 버튼,

무비클립으로 나뉩니다. 그리고 액션은 무비 안에서 계산하고, 비교하고, 불러오고, 속성을 제어하는 등의

역할을 수행합니다. 즉, 대상을 정하고 그 대상에 해야 할 역할을 부여하여 무비에서 실행 되도록 명령하는

것이 ActionScript 의 기본 개념입니다.

4) 이벤트(Event)

플래시에서 이벤트는 프레임 이벤트(Frame Event), 버튼 이벤트(Button Event), 무비클립 이벤트(MovieClip

Event) 세 가지로 나뉩니다. 이벤트란 액션이 실행되는 근본적인 사건, 즉 프레임의 이동, 버튼의 선택 및

드래그, 마우스의 동작, 키보드 입력 등을 말합니다.

5) 이벤트 핸들러(Event Handler)

이벤트 핸들러란 이벤트가 발생할 때 이를 제어하는 ActionScript 언어를 말합니다. 예를 들어 버튼위로 마

우스를 가져가면 어떤 대상의 무비클립 인스턴스가 사라지도록 ActionScript를 작성하였다고 한다면 버튼 위

로 마우스를 가져가는 동작은 이벤트이고 이러한 이벤트를 제어하는 버튼위로 마우스를 가져가는 구체적인

방법을 제시하는 스크립트 언어를 이벤트 핸들러라고 합니다. 이벤트 핸들러에는 프레임 이벤트 핸들러, 버

튼 이벤트 핸들러, 무비클립 이벤트 핸들러의 세 가지로 구분이 됩니다.

12/14


6) 인스턴스와 인스턴스 네임

7) 데이터 타입(Data Type)

플래시에서 사용되는 데이터 타입은 숫자(Number), 문자열(String), 불린(Boolean), 인스턴스 네임을 가지고

있는 데이터, 데이터 값이 없는 데이터 등이 있으며 이는 변수 지정뿐만 아니라 모든 대입식에 쓰입니다.

- 숫자(Number) : 사칙연산(+,-,×,÷), 비교연산( < > = )을 수행합니다.

- 문자열(String) : 문자로 인식되는 “”안의 데이터 입니다.

- 불린(Boolean) : 참(true), 거짓(false)에 대한 데이터입니다.

- 인스턴스 네임을 가지고 있는 데이터 : 무비클립, 버튼, 비디오, 텍스트 필드 등이 인스 턴스 네임을

가질 수 있는 오브젝트 입니다.

- 데이터 값이 없는 데이터 : Null 또는 정의되지 않은 데이터 값을 가리킵니다.

8) 변수

변수는 임시로 데이터를 저장할 수 있는 저장소를 말합니다. 변수명을 우선 지정해주고 변수에 데이터 값을

대입합니다. 여기서 데이터는 숫자(Number), 문자열(String),

불린(Boolean : 참 또는 거짓)을 입력할 수 있습니다. 따라서 변수명을 알고 있다면 액션 스크립트의 어느

곳에서도 변수에 대입되어 있는 데이터를 불러 올 수 있습니다.

변수를 지정할 때 쓰이는 =(등호)은 “같다”라는 뜻보다는 “대입하라”, “넘겨주어라”라는 뜻으로 이해하시면

됩니다. 등호의 오른쪽에 위치한 값을 왼쪽으로 넘겨주는 연산식의 기본 개념과 동일합니다.

13/14


9) 매개변수

10) 함수(Function)

함수란 데이터의 값이 저장되어 있는 변수를 받아서 값을 변환하여 반환하는 재 사용이 가능한 코드 입니다.

<형식>

function 함수명(매개변수){

실행될 액션 스크립트

}

11) 속성(Properties)

ⓐ 전역속성(Global Properties)

플래시 무비 전체에 적용되는 속성입니다.

ⓑ 무비클립의 속성(MovieClip Properties) : 무비클립 인스턴스의 속성입니다.

12) 액션패널 입력창 살펴보기

플래시 MX 2004 에서는 액션을 지정하고자 하는 대상을 선택한 후 액션 스크립트 입력창을 불러와 원하는

액션을 지정해 주면 됩니다. 액션 스크립트 입력창을 불러오려면 메뉴에서

[Window]-[Development Panels]-[Actions]를 클릭하거나, 단축키 F9 를 누르면 됩니다.

이전 버전인 플래시 MX 에서는 일반모드와 전문가 모드가 나뉘어져 있었지만, 플래시 MX 2004 로

업그레이드 되면서 일반 모드가 없어졌습니다.

14/14


①액션 툴박스 : 액션들을 모아둔 액션 목록으로, 화살표 아이콘을 클릭하면 사용할 수 있는 액션 목록이

나타납니다.

②스크립트 네이게이터 : 액션이 적용된 위치와 무비의 여러 오브젝트를 찾기 쉽도록 보여줍니다.

③액션 추가 버튼 : 클릭하면 액션 목록이 나타납니다.

④찾기 : 액션 스크립트 입력창에서 특정 단어나 문장을 검색합니다.

⑤찾아 바꾸기 : 액션 스크립트 입력창에 있는 특정 단어를 한꺼번에 다른 단어로 변경해 줍니다.

⑥타겟 경로 지정 : 액션을 지정할 대상인 타겟의 경로를 선택할 수 있습니다.

⑦문법 체크 : 액션 스크립트가 잘 작성되었는지 문법을 체크해 줍니다.

⑧자동 정렬 : 작성된 액션 스크립트를 보기 좋은 모습으로 정렬시켜줍니다.

⑨코드 힌트 보기 : 액션 스크립트를 작성하기 쉽도록 코드를 입력할 때 커서가 있는 곳에 적당한 값을

보여주는 풍선 도움말이 나타납니다.

⑩팝업메뉴 : 액션 스크립트 입력 창과 관련된 설정 팝업메뉴가 나타납니다.

⑪참조 : 액션에 대한 설명과 간단한 예제가 있는 액션 스크립트 사전이 나타납니다.

⑫디버그 옵션 : 액션 스크립트의 오류를 검사하는 ‘디버깅 작업’이 실행됩니다.

⑬보기 옵션 : 스크립트의 입력창의 줄 번호 줄 바뀜 등을 설정합니다.

⑭점프 메뉴 : 선택된 오브젝트의 정보가 나타납니다. 핀으로 고정된 오브젝트를 쉽게 찾을 수 있습니다.

⑮핀 : 클릭하면 아이콘이 바뀌게 되는데, 일일이 다시 찾을 필요 없이 고정 시켜놓고 추가로 스크립트를 추

가할 수 있고 수정할 수 있도록 고정시켜 놓는 기능입니다. 여러 개의 오브젝트를 고정시킬 수 있습니다.

플래시 MX 2004 의 기본 다지기 중 패널 기능, 메뉴기능, 액션기능에 대해 알아보았습니다. 플래시

애니메이션을 구현하는데 가장 기본이 되는 기능들이므로 확실이 다지시길 바랍니다.

3단원 플래시 mx2004의 기본 다지기 2 · 2005-10-25 · scrollpane의 양식을 플래시...

Documents