버튼바 겔러리

 

 

 

버튼바 겔러리

 

1. 작업창 크기; 700*600, 이미지 크기; 700*300, 난이도; ★★★★

 

이미지 크기로 사각형 그려 작업창 중앙에 위치시키고 0/10으로 잘라 벗겨낸 다음, 전체를 선택하고 프로퍼티즈창에서 높이값을 25로 한다. 이어 버튼바 이미지로 교체하고 선타입=실선, 굵기=0, 색상=흰색, 윈도우즈-틴에서 투명도를 50으로 한다.

 

 

2. 세이프 10개를 모두 선택하고 콘버트 투 무비클립으로 하여 이름을 전부 bar라 적고 다시 이 10개를 전부 선택해서 콘버트 투 무비클립으로 하고 아래부터 b1-10으로 적고 이를 다시 그룹핑 무비클립으로 하고 이름을 btn이라 한다.

 

 

3. 이미지 크기로 사각형 글려 포지션 포인트 좌하로 하여 _y=0을 주어 작업창 위에 배치시키고 이를 무비클립으로 하고 mask라 이름 하고 포지션 포인트를 좌하로 한다. 오늘 영상은 마스크처리는 하지 않지만 스크립트 명령으로 모든 영상이 이 마스크를 통해서만 보여 진다.

 

 

4. 1번 이미지 불러와 포지션 포인트 좌하로 하고 _y값 300을 주면 작업창 절반의 위쪽에 위치한다. 이를 복사 _y 값을 1을 더 주고 물결판 불러와 이미지 밑선에 맞추어(물결판이 이미지 밑으로 내려오면 여기 적은 좌표는 맞지 않을 것이다.) 무비클립으로 묶고 마스크에 체크한 다음, 다시 아래 이미지와 무비클립으로 하고 img1이라 하고 포지션 포인트 좌하로 준다. 이를 복사해 총 10개 만들어 img1-10으로 이름 한다.

 

 

5. img2를 선택하고 _y 값을 600, 3은 900, 이렇게 300씩을 더 줘 아래쪽으로 배치한다. 배치가 끝나면 이 10개를 묶어 main이라 한다. 이어 라이버리를 통해 각각 해당 이미지로 교체한다.

 

 

6. 아웃라인-인세트-사운드를 선택해서 버튼음을 불러와 무비클립으로 하고 이름을 song이라 하고 타임라인 1프레임에 스톱을 준다. 이제 Scene_1을 선택하고 아래 스크립트를 적는다.

아래 스크립트문은 길지만 어려운게 없다. 오로지 마스크와 버튼바와 main 이미지가 이동할 좌표값이다. 좌표도 _y값만 주면 된다. 혹시 이 값이 맞지 않을 경우, 나와 작업환경이 틀려 그럴 경우도 있을 것이다. 이때는 하나의 좌표값만 플레이 해보면서 확실히 입력되면 나머지는 거기에 맞추어 조정하면 된다. 마스크와 버튼바는 25씩 이동하면 되고 이미지는 모션을 크게 주기 위해 지그재그로 좌표를 설정했다. 즉 1에서 6번으로 2에서 7번으로 이렇게 5이미지의 차이를 주었다.

 

onFrame (1) {

_root.main.setMask(mask);

Object.prototype.kim = function (speed, targety) {

this.onEnterFrame = function () {

this._y += speed * (targety - this._y);

}

}

Object.prototype.bFade = function (speed,alpha) {

this.onEnterFrame = function () {

this._alpha += speed * (alpha - this._alpha);

}

}

//http://blog.naver.com/shik56

_root.btn.b1.onPress = function () {

_root.main.kim(0.2, -1325);

_root.mask.kim(0.2, 375);

_root.song.gotoAndPlay(2);

this.kim(0.2, -210);

_root.btn.b2.kim(0.2, 90);

_root.btn.b3.kim(0.2, 115);

_root.btn.b4.kim(0.2, 140);

_root.btn.b5.kim(0.2, 165);

_root.btn.b6.kim(0.2, 190);

_root.btn.b7.kim(0.2, 215);

_root.btn.b8.kim(0.2, 240);

_root.btn.b9.kim(0.2, 265);

_root.btn.b10.kim(0.2, 290);

}

_root.btn.b2.onPress = function () {

_root.main.kim(0.2, 200);

_root.mask.kim(0.2, 400);

_root.song.gotoAndPlay(2);

this.kim(0.2, -190);

_root.btn.b1.kim(0.2, -215);

_root.btn.b3.kim(0.2, 115);

_root.btn.b4.kim(0.2, 140);

_root.btn.b5.kim(0.2, 165);

_root.btn.b6.kim(0.2, 190);

_root.btn.b7.kim(0.2, 215);

_root.btn.b8.kim(0.2, 240);

_root.btn.b9.kim(0.2, 265);

_root.btn.b10.kim(0.2, 290);

}

_root.btn.b3.onPress = function () {

_root.main.kim(0.2, -975);

_root.mask.kim(0.2, 425);

_root.song.gotoAndPlay(2);

this.kim(0.2, -165);

_root.btn.b1.kim(0.2, -215);

_root.btn.b2.kim(0.2, -190);

_root.btn.b4.kim(0.2, 140);

_root.btn.b5.kim(0.2, 165);

_root.btn.b6.kim(0.2, 190);

_root.btn.b7.kim(0.2, 215);

_root.btn.b8.kim(0.2, 240);

_root.btn.b9.kim(0.2, 265);

_root.btn.b10.kim(0.2, 290);

}

_root.btn.b4.onPress = function () {

_root.main.kim(0.2, 550);

_root.mask.kim(0.2, 450);

_root.song.gotoAndPlay(2);

this.kim(0.2, -140);

_root.btn.b1.kim(0.2, -215);

_root.btn.b2.kim(0.2, -190);

_root.btn.b3.kim(0.2, -165);

_root.btn.b5.kim(0.2, 165);

_root.btn.b6.kim(0.2, 190);

_root.btn.b7.kim(0.2, 215);

_root.btn.b8.kim(0.2, 240);

_root.btn.b9.kim(0.2, 265);

_root.btn.b10.kim(0.2, 290);

}

_root.btn.b5.onPress = function () {

_root.main.kim(0.2, -625);

_root.mask.kim(0.2, 475);

_root.song.gotoAndPlay(2);

this.kim(0.2, -115);

_root.btn.b1.kim(0.2, -215);

_root.btn.b2.kim(0.2, -190);

_root.btn.b3.kim(0.2, -165);

_root.btn.b4.kim(0.2, -140);

_root.btn.b6.kim(0.2, 190);

_root.btn.b7.kim(0.2, 215);

_root.btn.b8.kim(0.2, 240);

_root.btn.b9.kim(0.2, 265);

_root.btn.b10.kim(0.2,290);

}

_root.btn.b6.onPress = function () {

_root.main.kim(0.2, 900);

_root.mask.kim(0.2, 500);

_root.song.gotoAndPlay(2);

this.kim(0.2, -90);

_root.btn.b1.kim(0.2, -215);

_root.btn.b2.kim(0.2, -190);

_root.btn.b3.kim(0.2, -165);

_root.btn.b4.kim(0.2, -140);

_root.btn.b5.kim(0.2, -115);

_root.btn.b7.kim(0.2, 215);

_root.btn.b8.kim(0.2, 240);

_root.btn.b9.kim(0.2, 265);

_root.btn.b10.kim(0.2, 290);

}

_root.btn.b7.onPress = function () {

_root.main.kim(0.2, -275);

_root.mask.kim(0.2, 525);

_root.song.gotoAndPlay(2);

this.kim(0.2, -65);

_root.btn.b1.kim(0.2, -215);

_root.btn.b2.kim(0.2, -190);

_root.btn.b3.kim(0.2, -165);

_root.btn.b4.kim(0.2, -140);

_root.btn.b5.kim(0.2, -115);

_root.btn.b6.kim(0.2, -90);

_root.btn.b8.kim(0.2, 240);

_root.btn.b9.kim(0.2, 265);

_root.btn.b10.kim(0.2, 290);

}

_root.btn.b8.onPress = function () {

_root.main.kim(0.2, 1250);

_root.mask.kim(0.2, 550);

_root.song.gotoAndPlay(2);

this.kim(0.2, -40);

_root.btn.b1.kim(0.2, -215);

_root.btn.b2.kim(0.2, -190);

_root.btn.b3.kim(0.2, -165);

_root.btn.b4.kim(0.2, -140);

_root.btn.b5.kim(0.2, -115);

_root.btn.b6.kim(0.2, -90);

_root.btn.b7.kim(0.2, -65);

_root.btn.b9.kim(0.2, 265);

_root.btn.b10.kim(0.2, 290);

}

_root.btn.b9.onPress = function () {

_root.main.kim(0.2, 75);

_root.mask.kim(0.2, 575);

_root.song.gotoAndPlay(2);

this.kim(0.2, -15);

_root.btn.b1.kim(0.2, -215);

_root.btn.b2.kim(0.2, -190);

_root.btn.b3.kim(0.2, -165);

_root.btn.b4.kim(0.2, -140);

_root.btn.b5.kim(0.2, -115);

_root.btn.b6.kim(0.2, -90);

_root.btn.b7.kim(0.2, -65);

_root.btn.b8.kim(0.2, -40);

_root.btn.b10.kim(0.2, 290);

}

_root.btn.b10.onPress = function () {

_root.main.kim(0.2, 1600);

_root.mask.kim(0.2, 600);

_root.song.gotoAndPlay(2);

this.kim(0.2, 10);

_root.btn.b1.kim(0.2,-215);

_root.btn.b2.kim(0.2, -190);

_root.btn.b3.kim(0.2, -165);

_root.btn.b4.kim(0.2, -140);

_root.btn.b5.kim(0.2, -115);

_root.btn.b6.kim(0.2, -90);

_root.btn.b7.kim(0.2, -65);

_root.btn.b8.kim(0.2, -40);

_root.btn.b9.kim(0.2, -15);

}

}

onFrame (2) {

stop();

}

 

 

7. 이제 각 이미지 무비클립에 글도 넣고 소스도 넣어 장식을 한다. 고급강좌에서 그런 부분까지 설명하지는 않겠다. 여기서는 하는 요령만 말한다. 그럼처럼 위의 눈에 거슬리는 부분은 다 눈을 감긴다. 그리고 해당 무비클립으로 열어 놓고 소스를 불러와서 적당한 곳에 배치하고 글도 넣고 모든 작업은 해당 무비클립을 선택하고 한다. 그러면 무비클립이 작업창 밖에 있어도 플레이하면 다 같은 화면으로 나온다. 그리고 아래 무비클립을 작업할 경우 툴바의 손바닥 아이콘 클릭하고 작업창을 밀면서 한다. 원하는 부분까지 다 이동할 수 있다.

 

 

 

 

 

 

버튼바 겔러리.swf

버튼바 겔러리.swf

2.07MB