버튼 겔러리
1. 작업창 크기; 700*500, 이미지 크기; 700*440, 난이도;
이번 영상도 웹에서 구한 마스크를 소스파일로 제공한다. 그 파일에 가는 선들이 많아 고치는데 시간이 더 걸린 것 같다. 마스크 불러와 345/220에 위치시킨다. 이런 소스파일을 만들 때에도 작업창 중앙에 맞게 작업으로 해야 깔끔하다. 이 파일은 핀트가 중앙으로 주면 맞지 않는다. 마스크 50프레임에 스톱 처리를 했다.
이어 이미지 10장을 한꺼번에 불러와 포지션 포인트 중상에 주고 350/0에 위치시킨다. 1번 이미지를 맨 위로 올려 무비클립으로 묶고 aa라 하고 aa를 열고 타임라인에 1프레임을 비워놓고 위 그림처럼 배열한다.
2. 다시 1번 이미지 불러와 포지션 포인트 중상에 주고 350/0에 위치시키고 이를 카피 y값 1을 더 주고 물결판 불러와 무비클립으로 묶고 마스크 처리한다. 이어 아래 남은 이미지와 다시 무비클립으로 묶고 img1이라 한다. 이어 img1을 카피해 하나를 더 만든다. 이번 영상은 img1이 두 개다. 전번에 사라지고 나타나는 강좌에서 처음 보여 지는 부분이 맞지 않았다. 그래 오늘은 그 부분마저 말끔하게 처리해 보자. 전번에 그렇게 간단하게 처리했는데도 이해하지 못한 분들이 몇 분 있었는데 오늘은 강좌를 꼼꼼히 읽어 보기를 권한다.
3. 카피한 img1을 다시 무비클립으로 묶고 img1이라 표시하고 맨 처음 만든 img1은 구별을 위해 img1w라 표시한다. img1을 카피해 총 10개를 만들어 img1-10으로 이름하고 아래 img1w와 함께 11개를 무비클립으로 묶고 bb라 하고 해당 이미지로 교체한다.
4. bb를 열고 타임라인에 위 그림처럼 배열한다. 이렇게 해서 그냥 보여주면 되는 영상인데도 강좌거리를 만들기 위해 수직 이동 버튼을 만들어 스크립트를 적어 보자. 전번 강좌에서 수평이동 버튼을 만들어 본 사람들은 이해하기 쉬울 것이다. 방법은 같다.
5. 버튼이미지 b4-1과 b8-1을 350/250에 위치시키고 하나를 카피해 붙이고 필타입=none으로 만들어 놓고 b4이미지 선택하고 20프레임에 더블클릭 무비를 주고 포지션 포인트 중하에 주고 h=1을 주고 b8 이미지 선택하고 포지션 포인트 중상에 주고 h=1, 20무비를 주고 h=60으로 한다.
작업창을 키우고 T를 선택하여 글 사이즈 16으로 색상=흰색을 선택하고 image 01을 작업창에 적고 포지션 포인트 중에 주고 350/250에 위치시키고 이를 카피 붙이기 하여 색상을 검정으로 주고 350/220에 위치시킨다. 이어 가운데 글자 선택하고 20무비를 주고 포지션 포인트 중하에 주고 y=280, h=1을 주고 위 검정글자 선택하고 포지션 포인트 중상에 주고 h=1, 20무비를 주고 y=235, h=17.75(글자 원래 크기)를 준다.
흰색 글자 선택하고 필터=그로우-브러2를 선택하고 옵션에 색상을 검정으로 주고 검정 글자 선택하고 색상을 흰색으로 준다. 이어 플레이를 해보고 자연스럽지 않으면 수정한다.
6. 버튼 이미지 2개와 글자 2개를 모두 선택하여 카피해 붙이기를 하고 효과막대를 20프레임 뒤로 민다. 이어 이미지 b4는 b8로 b8은 b4로 이미지를 바꾸고 글자도 흰색은 검정으로 검정은 흰색으로 필터 옵션도 색상을 반대로 바꾼다. 이제 위 투명 세이프와 함께 모두를 무비클립으로 묶고 btn1이라 하고 주고 싶은 필터를 준다.
7. btn1을 선택하고 포지션 포인트 좌하에 주고 0/500으로 보내고 이를 카피 총 10개를 만들어 맨 위 무비클립을 포지션 포인트 우하에 주고 700/500으로 보낸 후, 모두를 선택하고 수평정렬을 한다. 이어 btn1-10으로 이름하고 각 버튼을 열고 해당 이미지와 숫자를 바꾼다. 이미지 교체할 때 주의할 점은 위 두 개의 이미지는 서로 바꾸어 넣어야 한다.
8. 이제 정리를 하자. aa와 bb를 무비클립으로 묶고 cc라 한다. cc와 mack를 무비클립으로 묶고 마스크에 체크하고 dd라 하고 주고 싶은 필터를 준다. 이어 해당 부분에 스크립트를 적는다. 스크립트는 메모장으로 올린다.
* btn1/투명세이프 선택하고
on (rollOver) {
this.stop();
}
on (rollOut) {
this.play();
}
on (release) {
_parent.dd.cc.aa.gotoAndPlay(10);
_parent.dd.cc.bb.gotoAndPlay(2);
_parent.dd.mask.gotoAndPlay(51);
}
* btn2/투명세이프 선택하고
on (rollOver) {
this.stop();
}
on (rollOut) {
this.play();
}
on (release) {
_parent.dd.cc.aa.gotoAndPlay(11);
_parent.dd.cc.bb.gotoAndPlay(3);
_parent.dd.mask.gotoAndPlay(51);
}
* btn3/투명세이프 선택하고
on (rollOver) {
this.stop();
}
on (rollOut) {
this.play();
}
on (release) {
_parent.dd.cc.aa.gotoAndPlay(2);
_parent.dd.cc.bb.gotoAndPlay(4);
_parent.dd.mask.gotoAndPlay(51);
}
* btn4/투명세이프 선택하고
on (rollOver) {
this.stop();
}
on (rollOut) {
this.play();
}
on (release) {
_parent.dd.cc.aa.gotoAndPlay(3);
_parent.dd.cc.bb.gotoAndPlay(5);
_parent.dd.mask.gotoAndPlay(51);
}
* btn5/투명세이프 선택하고
on (rollOver) {
this.stop();
}
on (rollOut) {
this.play();
}
on (release) {
_parent.dd.cc.aa.gotoAndPlay(4);
_parent.dd.cc.bb.gotoAndPlay(6);
_parent.dd.mask.gotoAndPlay(51);
}
* btn6/투명세이프 선택하고
on (rollOver) {
this.stop();
}
on (rollOut) {
this.play();
}
on (release) {
_parent.dd.cc.aa.gotoAndPlay(5);
_parent.dd.cc.bb.gotoAndPlay(7);
_parent.dd.mask.gotoAndPlay(51);
}
* btn7/투명세이프 선택하고
on (rollOver) {
this.stop();
}
on (rollOut) {
this.play();
}
on (release) {
_parent.dd.cc.aa.gotoAndPlay(6);
_parent.dd.cc.bb.gotoAndPlay(8);
_parent.dd.mask.gotoAndPlay(51);
}
* btn8/투명세이프 선택하고
on (rollOver) {
this.stop();
}
on (rollOut) {
this.play();
}
on (release) {
_parent.dd.cc.aa.gotoAndPlay(7);
_parent.dd.cc.bb.gotoAndPlay(9);
_parent.dd.mask.gotoAndPlay(51);
}
* btn9/투명세이프 선택하고
on (rollOver) {
this.stop();
}
on (rollOut) {
this.play();
}
on (release) {
_parent.dd.cc.aa.gotoAndPlay(8);
_parent.dd.cc.bb.gotoAndPlay(10);
_parent.dd.mask.gotoAndPlay(51);
}
* btn10/투명세이프 선택하고
on (rollOver) {
this.stop();
}
on (rollOut) {
this.play();
}
on (release) {
_parent.dd.cc.aa.gotoAndPlay(9);
_parent.dd.cc.bb.gotoAndPlay(11);
_parent.dd.mask.gotoAndPlay(51);
}
버튼겔러리.swf
Button gallery mask.swi
