SlideShare a Scribd company logo
1 of 14
Download to read offline
Flash ActionScript 의 특징
                                            플래시 액션스크립트를 활용한
                                                 다이내믹 컨텐츠 제작




• 절차적인 언어(함수에 중점을 둠) +
 OOP적인 언어 대상에 중점을 둠)
     적인 언어(대상에 점을
• Event driven Language
  Event-driven
• Dot Syntax
       y


* 객체지향 프로그램 (OOP: Object Oriented Programming)
순차적으로 프로그램을 실행하는 것이 아니라 오브젝트 단위로 분할하여 관리
                                      관리.
OOP에서 오브젝트는 클래스를 사용하여 제작하며, 프로그램을 좀 더 구조적이
고 짜임새 있게 작성할 수 있다.
Flash에서는 instance가 Object이다. 오브젝트에 있어서 함수는 method, 변수는
property.
[절차적 언어] vs [OOP적 언어]
                                          플래시 액션스크립트를 활용한
                                               다이내믹 컨텐츠 제작




[미션] 냉장고에 코끼리를 넣자!
** 절차적 언어(예:C언어)
 1. 냉장고 문을 연다.            Open 냉장고();
 2.
 2 코끼리를 집어 넣는다
            넣는다.          Insert 코끼리()
                          I    t 코끼리();
 3. 냉장고 문을 닫는다.           Close 냉장고();


** OOP적인 언어
 냉장
 냉장고 a = new 냉장고(); //냉장고라는 타입의 새로운 냉장고 객체 생성
              냉장 ()
 코끼리 b = new 코끼리(); //코끼리라는 타입의 새로운 코끼리 객체 생성
 a.Open();
 a.Insert(b);
 a.Close();
인터페이스와 인터렉션
                                     플래시 액션스크립트를 활용한
                                          다이내믹 컨텐츠 제작




• 사람(사용자)와 사물(커퓨터)간의 커뮤니케이션은 인터
  페이 를
  페이스를 통해 다양한 인터랙션이 발생한다.
                     발생한다
• 플래시에서의 인터랙션

  마우스 이벤트 관련       키보드 이벤트 관련    버튼 이벤트 관련
    인터렉션             인터렉션          인터렉션

 1. 마우스의 움직임      1. 키보드의 입력    1. 버튼에 롤오버
 2. 마우스의 왼쪽 클릭
    마우 의          ( 키
                  (esc키 제외 )    2. 버튼에 롤아웃
 3. 마우스의 오른쪽 클릭                 3. 버튼 릴리즈
 4. 마우스 휠의 움직임                  4. 버튼 릴리즈 아웃
                                5. 버튼 프레스
                                6. 버튼 드래그 오버
                                7. 버튼 드래그 아웃
인터렉션 디자인 VS 인터페이스 디자인
                           플래시 액션스크립트를 활용한
                                다이내믹 컨텐츠 제작




                 사물(컴퓨터)




         인터페이스
         인터페이




                    인터렉션


    사람(사용자)
AS 3.0의 기본구조 및 구성요소
                                                    플래시 액션스크립트를 활용한
                                                         다이내믹 컨텐츠 제작




• 구성 : 객체 이벤트 이벤트핸들러
       객체, 이벤트,
 (객체에 이벤트가 발생하면 이벤트핸들러를 실행하라)

 Object.addEventListener(이벤트, 핸들러);
 function 핸들러(이벤 ){ 스 립
 f    i   핸들러(이벤트){ 스크립트; }

 ex) 버튼을 클릭하면 무비를 재생하라
   )
 bnPlay.addEventListener(MouseEvent.CLICK, playMovie);
 function playMovie(e:MouseEvent):void{
     play( );
 }
꼭 알아두어야 할 개념들
                                     플래시 액션스크립트를 활용한
                                          다이내믹 컨텐츠 제작




1. 변수(variables) : 데이터를 저장하는 그릇
2. 함수(function) : 여러 메서드의 조합으로 이루어진 코딩 덩어리
3. 이벤트(events) : 어떤 일이 벌어지는 것
 (ex) 마우 클릭 롤 버 롤아웃
      마우스클릭, 롤오버, 롤아웃.....
4. 조건식 : 만약(if) 어떤 조건을 만족하면, 이렇게 저렇게 하라.
5.
5 반복문 : 일정조건을 만족할 때까지 반복해서 실행하라
6. 클래스(class) : 오브젝트(무비)를 어떻게 움직이게 할 것인가를 설계
   해 둔 일종의 청사진


* 액션스크립트로 무비클립을 제어하기 위해서는
  오브젝트가 반드시 인스턴스화(인스턴스이름 짓기)되어야 한다.
디스플레이 오브젝트 속성
                플래시 액션스크립트를 활용한
                     다이내믹 컨텐츠 제작
주요 오브젝트 속성 & 이벤트
                   플래시 액션스크립트를 활용한
                        다이내믹 컨텐츠 제작
마우스 이벤트 속성
             플래시 액션스크립트를 활용한
                  다이내믹 컨텐츠 제작
타임라인 관련 메서드와 속성
                                      플래시 액션스크립트를 활용한
                                           다이내믹 컨텐츠 제작




stop( )               멈춤
play( )               재생
gotoAndStop(★) ★ 에서 멈춤
gotoAndPlay(★) ★ 에서 재생
nextFrame( )          다음 프레임에서 멈춤
prevFrame( )          이전 프레임에서 멈춤
----------------------------------------------
totalFrames           전체 프레임 수
currentFrame          현재 프레임 번호
꼭 알아두어야 할 오브젝트 속성
                               플래시 액션스크립트를 활용한
                                    다이내믹 컨텐츠 제작




x, y             좌표값
alpha, visible   투명도, 가시성
scaleX,
scaleX scaleY    상대크기(%)
width, height    절대크기(pixel)
rotation         회전각도
mouseX,
mouseX mouseY    마우스좌표
name             인스턴스 네임
stage            스테이지
꼭 알아두어야 할 마우스이벤트 속성
                      플래시 액션스크립트를 활용한
                           다이내믹 컨텐츠 제작




CLICK         클릭
MOUSE_DOWN    마우스다운
MOUSE_UP
MOUSE UP      마우스업
MOUSE_OUT     마우스아웃
MOUSE_OVER    마우스오버
MOUSE_MOVE
MOUSE MOVE    마우스무브
ROLL_OUT      롤아웃
ROLL_OVER     롤오버
기타 중요한 사항들
                                       플래시 액션스크립트를 활용한
                                            다이내믹 컨텐츠 제작




※ dot(.) syntax :
  인스턴스들의 위계는 점(.)으로 그 관계를 표현한다.
※ 기본적인 데이터의 유형(Data Type) :
  Number(수식) / String(문자열) / Boolean(참, 거짓)
※ trace 와 친해지기
  t
※ 코멘트 활용하기
※ 인스턴스 네이밍:
  접두어, 접미어를 사용하여 오브젝트의 종류를 쉽게 알
                   젝 의
  수 있는 네이밍
인스턴스 네임 작명요령
                                                         플래시 액션스크립트를 활용한
                                                              다이내믹 컨텐츠 제작




오브젝트   접두어   접미어                            예

                      mcBlue, mcBall, mcCircle, mcBar
무비클립   mc    _mc      Blue_mc, Ball_mc, Circle_mc, Bar_mc

                      bnPlay, bnStop, bnPause, bnRetry
  버튼   bn    _btn     Play_btn, Stop_btn, Pause_btn, Retry_btn

                      arDay, arMonth, arYear, arName
  배열   ar    _array   Day_array, Month_array, Year_array, Name_array

                      txtDescript, txtName, txtMenu
 텍스트   txt   _txt     Descript_txt, Name_txt, Menu_txt


• 숫자(1,2,..)로 시작하지 말 것!!
• 특수문자(#,$,%,^,&,*) 및 예약어 사용 불가!!
  특수문자( ,$,%, ,&, )
• 공백(space) 없이 작성!!

More Related Content

Similar to 01 액션스크립트기초

I phone 2 release
I phone 2 releaseI phone 2 release
I phone 2 releaseJaehyeuk Oh
 
03 오브젝트 속성제어
03 오브젝트 속성제어03 오브젝트 속성제어
03 오브젝트 속성제어Ansan University
 
엄준일 04일차 HTML/Javascript 교육
엄준일 04일차 HTML/Javascript 교육엄준일 04일차 HTML/Javascript 교육
엄준일 04일차 HTML/Javascript 교육준일 엄
 
홍성우, 내가 만든 언어로 게임 만들기, NDC2017
홍성우, 내가 만든 언어로 게임 만들기, NDC2017홍성우, 내가 만든 언어로 게임 만들기, NDC2017
홍성우, 내가 만든 언어로 게임 만들기, NDC2017devCAT Studio, NEXON
 
Javascript 교육자료 pdf
Javascript 교육자료 pdfJavascript 교육자료 pdf
Javascript 교육자료 pdfHyosang Hong
 
[액션스크립트] 1부 액션 스크립트 2.0
[액션스크립트] 1부 액션 스크립트 2.0[액션스크립트] 1부 액션 스크립트 2.0
[액션스크립트] 1부 액션 스크립트 2.0MinGeun Park
 
브릿지 Unity3D 기초 스터디 1회
브릿지 Unity3D 기초 스터디 1회브릿지 Unity3D 기초 스터디 1회
브릿지 Unity3D 기초 스터디 1회BridgeGames
 
Software Architect day - 웹 프레임워크 종결 - metaworks3
Software Architect day - 웹 프레임워크 종결 -  metaworks3Software Architect day - 웹 프레임워크 종결 -  metaworks3
Software Architect day - 웹 프레임워크 종결 - metaworks3uEngine Solutions
 
Introduction To Xaml
Introduction To XamlIntroduction To Xaml
Introduction To Xamlphoooo
 
20131217 html5
20131217 html520131217 html5
20131217 html5DK Lee
 
Project Anarchy(Vision Engine)으로 게임 툴 만들기! part2
Project Anarchy(Vision Engine)으로 게임 툴 만들기! part2Project Anarchy(Vision Engine)으로 게임 툴 만들기! part2
Project Anarchy(Vision Engine)으로 게임 툴 만들기! part2진상 문
 
Port polio게임소개
Port polio게임소개Port polio게임소개
Port polio게임소개Seo YoungHoon
 
온라인 게임 처음부터 끝까지 동적언어로 만들기
온라인 게임 처음부터 끝까지 동적언어로 만들기온라인 게임 처음부터 끝까지 동적언어로 만들기
온라인 게임 처음부터 끝까지 동적언어로 만들기Seungjae Lee
 
Why javaScript?
Why javaScript?Why javaScript?
Why javaScript?Kim Hunmin
 
Port polio게임 소개
Port polio게임 소개Port polio게임 소개
Port polio게임 소개Seo YoungHoon
 
유엔진 BPM 커스터마이징 개발 방법
유엔진 BPM 커스터마이징 개발 방법유엔진 BPM 커스터마이징 개발 방법
유엔진 BPM 커스터마이징 개발 방법uEngine Solutions
 
Java script 강의자료_ed13
Java script 강의자료_ed13Java script 강의자료_ed13
Java script 강의자료_ed13hungrok
 

Similar to 01 액션스크립트기초 (20)

I phone 2 release
I phone 2 releaseI phone 2 release
I phone 2 release
 
03 오브젝트 속성제어
03 오브젝트 속성제어03 오브젝트 속성제어
03 오브젝트 속성제어
 
엄준일 04일차 HTML/Javascript 교육
엄준일 04일차 HTML/Javascript 교육엄준일 04일차 HTML/Javascript 교육
엄준일 04일차 HTML/Javascript 교육
 
홍성우, 내가 만든 언어로 게임 만들기, NDC2017
홍성우, 내가 만든 언어로 게임 만들기, NDC2017홍성우, 내가 만든 언어로 게임 만들기, NDC2017
홍성우, 내가 만든 언어로 게임 만들기, NDC2017
 
Javascript 교육자료 pdf
Javascript 교육자료 pdfJavascript 교육자료 pdf
Javascript 교육자료 pdf
 
[액션스크립트] 1부 액션 스크립트 2.0
[액션스크립트] 1부 액션 스크립트 2.0[액션스크립트] 1부 액션 스크립트 2.0
[액션스크립트] 1부 액션 스크립트 2.0
 
브릿지 Unity3D 기초 스터디 1회
브릿지 Unity3D 기초 스터디 1회브릿지 Unity3D 기초 스터디 1회
브릿지 Unity3D 기초 스터디 1회
 
Unity 시작하기
Unity 시작하기Unity 시작하기
Unity 시작하기
 
Software Architect day - 웹 프레임워크 종결 - metaworks3
Software Architect day - 웹 프레임워크 종결 -  metaworks3Software Architect day - 웹 프레임워크 종결 -  metaworks3
Software Architect day - 웹 프레임워크 종결 - metaworks3
 
Introduction To Xaml
Introduction To XamlIntroduction To Xaml
Introduction To Xaml
 
20131217 html5
20131217 html520131217 html5
20131217 html5
 
Project Anarchy(Vision Engine)으로 게임 툴 만들기! part2
Project Anarchy(Vision Engine)으로 게임 툴 만들기! part2Project Anarchy(Vision Engine)으로 게임 툴 만들기! part2
Project Anarchy(Vision Engine)으로 게임 툴 만들기! part2
 
Unity시작하기
Unity시작하기Unity시작하기
Unity시작하기
 
Port polio게임소개
Port polio게임소개Port polio게임소개
Port polio게임소개
 
온라인 게임 처음부터 끝까지 동적언어로 만들기
온라인 게임 처음부터 끝까지 동적언어로 만들기온라인 게임 처음부터 끝까지 동적언어로 만들기
온라인 게임 처음부터 끝까지 동적언어로 만들기
 
Why javaScript?
Why javaScript?Why javaScript?
Why javaScript?
 
Port polio게임 소개
Port polio게임 소개Port polio게임 소개
Port polio게임 소개
 
Hacosa j query 8th
Hacosa j query 8thHacosa j query 8th
Hacosa j query 8th
 
유엔진 BPM 커스터마이징 개발 방법
유엔진 BPM 커스터마이징 개발 방법유엔진 BPM 커스터마이징 개발 방법
유엔진 BPM 커스터마이징 개발 방법
 
Java script 강의자료_ed13
Java script 강의자료_ed13Java script 강의자료_ed13
Java script 강의자료_ed13
 

01 액션스크립트기초

  • 1. Flash ActionScript 의 특징 플래시 액션스크립트를 활용한 다이내믹 컨텐츠 제작 • 절차적인 언어(함수에 중점을 둠) + OOP적인 언어 대상에 중점을 둠) 적인 언어(대상에 점을 • Event driven Language Event-driven • Dot Syntax y * 객체지향 프로그램 (OOP: Object Oriented Programming) 순차적으로 프로그램을 실행하는 것이 아니라 오브젝트 단위로 분할하여 관리 관리. OOP에서 오브젝트는 클래스를 사용하여 제작하며, 프로그램을 좀 더 구조적이 고 짜임새 있게 작성할 수 있다. Flash에서는 instance가 Object이다. 오브젝트에 있어서 함수는 method, 변수는 property.
  • 2. [절차적 언어] vs [OOP적 언어] 플래시 액션스크립트를 활용한 다이내믹 컨텐츠 제작 [미션] 냉장고에 코끼리를 넣자! ** 절차적 언어(예:C언어) 1. 냉장고 문을 연다. Open 냉장고(); 2. 2 코끼리를 집어 넣는다 넣는다. Insert 코끼리() I t 코끼리(); 3. 냉장고 문을 닫는다. Close 냉장고(); ** OOP적인 언어 냉장 냉장고 a = new 냉장고(); //냉장고라는 타입의 새로운 냉장고 객체 생성 냉장 () 코끼리 b = new 코끼리(); //코끼리라는 타입의 새로운 코끼리 객체 생성 a.Open(); a.Insert(b); a.Close();
  • 3. 인터페이스와 인터렉션 플래시 액션스크립트를 활용한 다이내믹 컨텐츠 제작 • 사람(사용자)와 사물(커퓨터)간의 커뮤니케이션은 인터 페이 를 페이스를 통해 다양한 인터랙션이 발생한다. 발생한다 • 플래시에서의 인터랙션 마우스 이벤트 관련 키보드 이벤트 관련 버튼 이벤트 관련 인터렉션 인터렉션 인터렉션 1. 마우스의 움직임 1. 키보드의 입력 1. 버튼에 롤오버 2. 마우스의 왼쪽 클릭 마우 의 ( 키 (esc키 제외 ) 2. 버튼에 롤아웃 3. 마우스의 오른쪽 클릭 3. 버튼 릴리즈 4. 마우스 휠의 움직임 4. 버튼 릴리즈 아웃 5. 버튼 프레스 6. 버튼 드래그 오버 7. 버튼 드래그 아웃
  • 4. 인터렉션 디자인 VS 인터페이스 디자인 플래시 액션스크립트를 활용한 다이내믹 컨텐츠 제작 사물(컴퓨터) 인터페이스 인터페이 인터렉션 사람(사용자)
  • 5. AS 3.0의 기본구조 및 구성요소 플래시 액션스크립트를 활용한 다이내믹 컨텐츠 제작 • 구성 : 객체 이벤트 이벤트핸들러 객체, 이벤트, (객체에 이벤트가 발생하면 이벤트핸들러를 실행하라) Object.addEventListener(이벤트, 핸들러); function 핸들러(이벤 ){ 스 립 f i 핸들러(이벤트){ 스크립트; } ex) 버튼을 클릭하면 무비를 재생하라 ) bnPlay.addEventListener(MouseEvent.CLICK, playMovie); function playMovie(e:MouseEvent):void{ play( ); }
  • 6. 꼭 알아두어야 할 개념들 플래시 액션스크립트를 활용한 다이내믹 컨텐츠 제작 1. 변수(variables) : 데이터를 저장하는 그릇 2. 함수(function) : 여러 메서드의 조합으로 이루어진 코딩 덩어리 3. 이벤트(events) : 어떤 일이 벌어지는 것 (ex) 마우 클릭 롤 버 롤아웃 마우스클릭, 롤오버, 롤아웃..... 4. 조건식 : 만약(if) 어떤 조건을 만족하면, 이렇게 저렇게 하라. 5. 5 반복문 : 일정조건을 만족할 때까지 반복해서 실행하라 6. 클래스(class) : 오브젝트(무비)를 어떻게 움직이게 할 것인가를 설계 해 둔 일종의 청사진 * 액션스크립트로 무비클립을 제어하기 위해서는 오브젝트가 반드시 인스턴스화(인스턴스이름 짓기)되어야 한다.
  • 7. 디스플레이 오브젝트 속성 플래시 액션스크립트를 활용한 다이내믹 컨텐츠 제작
  • 8. 주요 오브젝트 속성 & 이벤트 플래시 액션스크립트를 활용한 다이내믹 컨텐츠 제작
  • 9. 마우스 이벤트 속성 플래시 액션스크립트를 활용한 다이내믹 컨텐츠 제작
  • 10. 타임라인 관련 메서드와 속성 플래시 액션스크립트를 활용한 다이내믹 컨텐츠 제작 stop( ) 멈춤 play( ) 재생 gotoAndStop(★) ★ 에서 멈춤 gotoAndPlay(★) ★ 에서 재생 nextFrame( ) 다음 프레임에서 멈춤 prevFrame( ) 이전 프레임에서 멈춤 ---------------------------------------------- totalFrames 전체 프레임 수 currentFrame 현재 프레임 번호
  • 11. 꼭 알아두어야 할 오브젝트 속성 플래시 액션스크립트를 활용한 다이내믹 컨텐츠 제작 x, y 좌표값 alpha, visible 투명도, 가시성 scaleX, scaleX scaleY 상대크기(%) width, height 절대크기(pixel) rotation 회전각도 mouseX, mouseX mouseY 마우스좌표 name 인스턴스 네임 stage 스테이지
  • 12. 꼭 알아두어야 할 마우스이벤트 속성 플래시 액션스크립트를 활용한 다이내믹 컨텐츠 제작 CLICK 클릭 MOUSE_DOWN 마우스다운 MOUSE_UP MOUSE UP 마우스업 MOUSE_OUT 마우스아웃 MOUSE_OVER 마우스오버 MOUSE_MOVE MOUSE MOVE 마우스무브 ROLL_OUT 롤아웃 ROLL_OVER 롤오버
  • 13. 기타 중요한 사항들 플래시 액션스크립트를 활용한 다이내믹 컨텐츠 제작 ※ dot(.) syntax : 인스턴스들의 위계는 점(.)으로 그 관계를 표현한다. ※ 기본적인 데이터의 유형(Data Type) : Number(수식) / String(문자열) / Boolean(참, 거짓) ※ trace 와 친해지기 t ※ 코멘트 활용하기 ※ 인스턴스 네이밍: 접두어, 접미어를 사용하여 오브젝트의 종류를 쉽게 알 젝 의 수 있는 네이밍
  • 14. 인스턴스 네임 작명요령 플래시 액션스크립트를 활용한 다이내믹 컨텐츠 제작 오브젝트 접두어 접미어 예 mcBlue, mcBall, mcCircle, mcBar 무비클립 mc _mc Blue_mc, Ball_mc, Circle_mc, Bar_mc bnPlay, bnStop, bnPause, bnRetry 버튼 bn _btn Play_btn, Stop_btn, Pause_btn, Retry_btn arDay, arMonth, arYear, arName 배열 ar _array Day_array, Month_array, Year_array, Name_array txtDescript, txtName, txtMenu 텍스트 txt _txt Descript_txt, Name_txt, Menu_txt • 숫자(1,2,..)로 시작하지 말 것!! • 특수문자(#,$,%,^,&,*) 및 예약어 사용 불가!! 특수문자( ,$,%, ,&, ) • 공백(space) 없이 작성!!