플래시 네비게이션 맨땅에 헤딩하기 -7- 무비클립과 프레임액션(2)

7강입니다.

여기까지만 따라 하신 분이라도 이제는 응용하여
어느정도의 네비게이션 구현이 크게 어렵지 않으실 것입니다.
이제부터는 중급정도의 강좌입니다.
플래시의 재미를 만끽하실 수 있을 것입니다.


1.
서브버튼 전체를 다 선택한 다음 심볼대화상자를 엽니다.
무비클립에 체크한 후 심볼명을 'sm1'로 저장합니다.
sm1은 서브무비클립 1번의 약자입니다.

2.
스테이지의 서브버튼 전체가 하나의 무비클립이 되었습니다.
이제 고급 기능을 만나 보겠습니다.
스테이지의 왼쪽 상단에 있는 Insert Layer Folder 아이콘을 누릅니다.
레이어폴더는 같은 성격의 레이어들을 묶어서 하나의 레이어 처럼 제어 할수 있는 기능입니다.


3.
새로만든 레이어 폴더의 이름을 '서브무비'로 바꾼 뒤
서브버튼레이어를 옮겨서 서브무비 폴더에 넣습니다.
넣는 방법은 간단합니다. 마우스로 그냥 옮기시면 됩니다.


4.
서브버튼레이어의 이름을 '버튼무비1'로 바꾸고 저장합니다.

5.
버튼무비1의 왼쪽 하얀 끝부분과 메인버튼1의 왼쪽 끝부분이 나란히 되도록
버튼무비1의 위치를 정렬합니다.


6.
서브무비 폴더 안에서 레이어 3개를 추가하고 레이어이름을
버튼무비2, 버튼무비3, 버튼무비4로 변경합니다.


7.
Info창을 엽니다. 단축키는 Ctrl+I입니다.

8.
버튼무비1을 클릭합니다.
Info 화면에서 Y의 위치 값을 메모합니다.


9.
버튼무비1레이어의 눈동자를 끕니다.
버튼무비1레이어를 잠급니다.
스테이지의 버튼무비1이 시야에서 사라졌습니다.



**** 여기서 잠깐..****
이제부터는 버튼무비1 무비클립을 라이브러리의 Duplicate 명령으로
버튼무비2, 버튼무비3, 버튼무비4를 복제하여 스테이지로 가져와서
서브무비 폴더안의 해당 레이어 안에 넣을 것입니다.
8번에서 Y의 위치 값을 메모한 것은 정렬시
수평정렬의 번거로움을 줄이기 위함이었습니다.

10.
라이브러리 창으로 갑니다.
폴더 밖에 있는 sm1을 선택한 후 오른쪽 마우스를 열어서 Duplicate를 누릅니다.


11.
무비클립에 체크한 후 심볼명을 'sm2'로 적고 OK합니다.
계속하여 sm3, sm4 무비클립을 만듭니다.


12.
다시 저장을 합니다.

13.
버튼무비2레이어를 선택합니다.
라이브러리에서 sm2 심볼을 스테이지로 꺼냅니다.

14.
Info 창을 불러온 뒤 8번에서 메모해 둔 Y의 위치 값을 Y에 넣어줍니다.

15.
메뉴에서 View-Rulers를 클릭합니다.
그림과 같은 눈금자가 나타납니다.


16.
왼쪽 눈금자에 마우스를 대고 오른쪽으로 당기면 세로 가이드 선이 나타나고
윗쪽 눈금자에 마우스를 대고 아랫쪽으로 당기면 가로 가이드 선이 나타납니다.
정렬할 때 적극 활용하시기 바랍니다.


17.
세로 가이드선을 활용하여 메인버튼2와 무비클립의 왼쪽 끝을 정렬합니다.


18.
정렬이 끝났으면 저장을 합니다.

19.
버튼무비2레이어를 잠급니다.
버튼무비2레이어의 눈동자를 끕니다.

20.
버튼무비3레이어를 선택합니다.
라이브러리에서 Sm3 무비클립심볼을 스테이지로 꺼냅니다.

23.
Info창의 Y 좌표에 메모해둔 위치값을 적습니다.
수평정렬이 되었습니다.

24.
가이드라인을 이용하여 수직정렬을 합니다.
너무 한 쪽으로 치우쳐 지면 보기에 좋지 않으므로
메인버튼3의 왼쪽 끝과 서브버튼2의 왼쪽 끝이 같게 정렬합니다.


25.
정렬이 끝나면 저장합니다.

26.
무비버튼3레이어를 잠그고 눈동자를 끕니다.

27.
버튼무비4레이어를 선택하고
라이브러리에서 sm4 무비클립 심볼을 스테이지로 꺼냅니다.

28
Info 창을 열고 메모한 Y위치값을 입력합니다.
버튼무비 네개의 Y값은 모두 동일합니다.

29.
가이드라인을 활용하여 수직정렬을 합니다.
메인버튼4와 서브버튼3의 오른쪽 끝을 정렬합니다.


30.
저장합니다.

31.
이제 각 서브무비에 속의 서브버튼에
Get URL액션을 주겠습니다.
버튼무비2레이어만 남기고
서브무비 속의 모든 레이어를 잠그고 눈동자를 닫습니다.


32.
스테이지의 sm2무비클립을 클릭하여 편집모드로 갑니다.
서브버튼1을 선택하고 오른쪽 마우스로 액션창을 엽니다.
액션창을 열면 현재 복제되기 전의 버튼심볼에 명령한 GetURL 액션이 자동으로 나타납니다.


33.
주소창에 http://grinbi62.com을 입력합니다.
윈도우는 여러분이 보고 싶은 형태로 선택합니다.

34.
액션창을 닫지 않은 상태에서 서브버튼2를 선택합니다.
하단박스의 주소라인을 클릭하면 입력상자가 나옵니다.
주소란에는 알고 계시는 사이트 주소를 입력합니다.
윈도우 형태도 임의로 선택합니다.
되도록 다양한 형태를 선택하여 옵션에 따른 변화를 확인합니다.

35.
34번 문항과 같은 방법으로 서브버튼3과 서브버튼4의 주소와 윈도우를 변경합니다.

36.
sm2 무비클립 속에 있는 버튼들의 주소를 다 변경하였으면 다시 스테이지로 갑니다.

37.
버튼무비2레이어의 눈동자를 끈 뒤 레이어를 잠급니다.

38.
버튼무비3레이어의 눈동자를 켜고 잠금을 해제합니다.
무비클립 편집모드로 가서 각 버튼의 주소와 윈도우를 임의로 변경합니다.

39.
스테이지로 돌아와서 저장을 합니다.
버튼무비3레이어의 눈동자를 끈 후 레이어를 잠급니다.

40.
버튼무비4레이어의 눈동자를 켜고 잠금을 해제합니다.
무비클립 편집모드로 가서 각 버튼의 주소와 윈도우를 임의로 변경합니다.
스테이지로 돌아와서 저장을 합니다.


**** 여기서 잠깐 ****
좀 번거로우시더라도 각 무비클립 속에 있는 모든 버튼은 각각 다른 것으로
입력하시기 바랍니다.
액션과 친해지기 위한 과정이니 꼭 지켜 주시기 바랍니다.

7강은 여기까지입니다.

수고하셨습니다.