HTML/FLEX 2008/01/21 19:46
플래시 애니메이션에서 가속도는 여러 곳에서 많이 응용됩니다.
//맨먼저 무비클립이 로드되면 초기값을 설정해줍니다.
onClipEvent (load) {
//그다음 속도를 1로 설정하고 가속도계수는 1.1로 설정해보죠.
sokdo = 1;
gasokdo = 1.1;
}
//이제 매프레임들이 연속될때마다 적용될 코드를 적어줍니다.
onClipEvent (enterFrame) {
//속도에 가속도계수를 곱해주고
sokdo *= gasokdo;
//그 속도를 현재 이 무비클립의 위치에 계속 더해줍니다.
this._x += sokdo;
//그런다음 무비클립의 x 축 위치가 400이 넘으면 다시 위치 0으로 돌아가고 가속도계수는 0으로 설정하여 멈추게합니다.
if (this._x > 400) {
this._x = 0;
gasokdo = 0;
}
}
위의 결과는 다음과 같습니다.
위 의 결과물은 원래 한번만 실행되고 말지요. 그래서 저는 버튼을 달아보았습니다. 여러분께서도 버튼을 직접 달아본다면 아시겠지만 버튼에 재실행하라는 명령을 주기위해선 함수를 사용해야 한다는걸 눈치채셨을겁니다. 재실행하는 경우 함수가 딱입니다.
그렇다면 버튼을 달고 함수를 응용한 최종 결과물의 소스는 어떻게 될까요? 다음과 같습니다.
onClipEvent (load) {
sokdo = 1;
gasokdo = 1.1;
//다음 부분을 추가하시면 됩니다.
function moveto(a, b) {
sokdo = a;
gasokdo = b;
}
}
onClipEvent (enterFrame) {
sokdo *= gasokdo;
this._x += sokdo;
if (this._x>400) {
this._x = 0;
gasokdo = 0;
}
}
그 다음은 버튼을 달고 F8을 눌러 버튼으로 만든뒤 다시 버튼을 클릭하여 다음과 같은 코드를 적어놓으시면 됩니다.
on(press){
_root.circle.moveto(1,1.1);
}
여 기서 _root.cicle라는 코드보이시죠? 이 말은 루트(메인화면)에 있는 원(무비클립)의 공식적인 이름을 cicle로 정했다는 겁니다. 어떻게 정하냐고요? 우리가 만든 원을 한번 클릭한뒤 밑의 속성창의 맨 왼쪽면을 보시면 [인스턴스 이름]이라고 씌여있는 부분에 cicle를 적어주면 되지요.
잘 알아 두십시요. 플래시에서 모든 무비클립의 이름은 이 창에 적어논 이름으로만 인식한다는 것을요. 우리가 심볼(무비클립심볼이나 그래픽심볼, 버튼심볼)로 만들때 누르는 F8에서 적는 아무 이름은 전혀 플래시가 인식 못합니다. 그건 그냥 우리가 심볼을 만들때 개인적으로 구별하기 위한 이름일뿐입니다.
이 가속도효과는 탄성을 주는 효과, 원운동하는 효과, 나선운동이라든지 점차 퍼져나가는
효과등에 응용되어 시각적으로 재미난 효과를 얼마든지 만들어 낼 수가 있지요.
그래서 이번장에는 가속도의 기본개념을 설명하고 다음장에서는 몇가지 간단한 응용예를
들어 보기로 하겠습니다.
먼저 애니메이션에서 가속도효과란 임의의 위치에서 특정위치(타겟점이라 하지요.)로
가는동안 일정 속도를 계속 더해주는 경우와 일정순간까지 속도가 붙다가 점차 타겟점에
다다르면 속도가 속도가 점점 줄어 들어 타겟점에서는 속도가 0이 되는 경우로 나눌수가
있겠네요.
먼저 첫번째경우부터 설명하지요.
즉 속도를 계속적으로 더해가는 경우입니다. 공식으로 적어볼까요?
속도 = 속도 * 가속하려는 수치
위의 공식은 다음과 같이 적을수가 있습니다.
속도 *= 가속하려는 수치(여기서 *=의 의미는 오른쪽의 수치를 왼쪽에 계속 곱하라는 뜻입니다.)
위와같이 왼쪽의 속도는 오른쪽의 가속하려는 수치를 계속 곱해줌에 따라 증가를 계속하게 될것입니다.
그렇다면 이때 이 물체의 위치는 어떻게 될까요? 이 물체의 위치는 기존 물체가 있던 위치에다 위의
속도(가속도가 계산된 값)을 더한 값이 될겁니다. 이것도 공식으로 나타내면
물체의 위치 += 속도
여기까지 이해가 되시지요?
그럼 위의 공식을 애니메이션에 적용해 보겠습니다.
자 플래시를 띄우고 원을 하나 그린다음 원을 마우스로 블럭설정한뒤 F8을 눌러 심볼로 등록합니다.
그런다음 다시 원을 선택해서 심볼로 변한 이 원에 다음의 코드를 적습니다.
//맨먼저 무비클립이 로드되면 초기값을 설정해줍니다.
onClipEvent (load) {
//그다음 속도를 1로 설정하고 가속도계수는 1.1로 설정해보죠.
sokdo = 1;
gasokdo = 1.1;
}
//이제 매프레임들이 연속될때마다 적용될 코드를 적어줍니다.
onClipEvent (enterFrame) {
//속도에 가속도계수를 곱해주고
sokdo *= gasokdo;
//그 속도를 현재 이 무비클립의 위치에 계속 더해줍니다.
this._x += sokdo;
//그런다음 무비클립의 x 축 위치가 400이 넘으면 다시 위치 0으로 돌아가고 가속도계수는 0으로 설정하여 멈추게합니다.
if (this._x > 400) {
this._x = 0;
gasokdo = 0;
}
}
위의 결과는 다음과 같습니다.
위 의 결과물은 원래 한번만 실행되고 말지요. 그래서 저는 버튼을 달아보았습니다. 여러분께서도 버튼을 직접 달아본다면 아시겠지만 버튼에 재실행하라는 명령을 주기위해선 함수를 사용해야 한다는걸 눈치채셨을겁니다. 재실행하는 경우 함수가 딱입니다.
그렇다면 버튼을 달고 함수를 응용한 최종 결과물의 소스는 어떻게 될까요? 다음과 같습니다.
onClipEvent (load) {
sokdo = 1;
gasokdo = 1.1;
//다음 부분을 추가하시면 됩니다.
function moveto(a, b) {
sokdo = a;
gasokdo = b;
}
}
onClipEvent (enterFrame) {
sokdo *= gasokdo;
this._x += sokdo;
if (this._x>400) {
this._x = 0;
gasokdo = 0;
}
}
그 다음은 버튼을 달고 F8을 눌러 버튼으로 만든뒤 다시 버튼을 클릭하여 다음과 같은 코드를 적어놓으시면 됩니다.
on(press){
_root.circle.moveto(1,1.1);
}
여 기서 _root.cicle라는 코드보이시죠? 이 말은 루트(메인화면)에 있는 원(무비클립)의 공식적인 이름을 cicle로 정했다는 겁니다. 어떻게 정하냐고요? 우리가 만든 원을 한번 클릭한뒤 밑의 속성창의 맨 왼쪽면을 보시면 [인스턴스 이름]이라고 씌여있는 부분에 cicle를 적어주면 되지요.
잘 알아 두십시요. 플래시에서 모든 무비클립의 이름은 이 창에 적어논 이름으로만 인식한다는 것을요. 우리가 심볼(무비클립심볼이나 그래픽심볼, 버튼심볼)로 만들때 누르는 F8에서 적는 아무 이름은 전혀 플래시가 인식 못합니다. 그건 그냥 우리가 심볼을 만들때 개인적으로 구별하기 위한 이름일뿐입니다.
이 글에는 트랙백을 보낼 수 없습니다
0