제4강 액션스크립트의 기본인 if문 활용하기

1. 학습목표    ① if문을 활용하여 그림 바꾸기를 만들 수 있다.    ② if문을 활용하여 그림 바꾸기를 다양하게 응용할 수 있다.    지난 강좌에서 배운 내용 복습하기     1. Ctrl+F8 을 눌러 자동차라는 무비클립을 만든다.(가운데 십자가가 나오면 그 십자가를      중심으로 자동차를 그려 넣습니다.)   2. Ctrl+L 을 눌러 라이브러리 창을 띄우고 2번 영역을 드래그 하여 장면1의 바탕화면에 붙여      넣는다.   3. 바탕화면에 있는 무비클립을 클릭한 후 마우스 오른쪽 버튼을 클릭하여 "속성"을 클릭하고      인스턴스 이름을 car로 한다.   4. 1번 프레임을 클릭한 후 마우스 오른쪽 버튼을 클릭하여 "액션"을 클릭하고 4번과 같이      써 넣는다.(ok변수를 미리 지정하지 않았으므로 처음엔 움직이지 않습니다. 마우스로      무비클립을 클릭하면 ok가 1이 되고 밑줄친 조건을 모두 만족하므로 오른쪽으로 2만큼      움직입니다. setInterval에 의해 0.25초마다 go함수가 실행되어 오른쪽으로 계속 이동      하다가 300을 넘으면 자동차는 원래 자리로 돌아오고 ok변수가 0이 되어 더이상 무비클립      은 움직이지 않게 됩니다.)     2. 그림 바꾸기 (if문을 활용하여 그림 바꾸기를 만들 수 있다.)     1. 같은 크기의 그림 2개를 준비한다. (저는 지진대 그림과 판에 대한 그림 2개를 준비했습니다.) 2. 각각의 그림으로 무비클립을 만들고 장면 1으로 나온다.    - 그림을 볼 수 있는 아무 프로그램에서나 그림을 복사(Ctrl+C) 해둡니다. (인터넷을 하다가       익스플로러를 통해 볼 수 있는 그림을 사용할 경우 그 그림을 마우스 오른쪽 버튼을 클릭하여       "복사"를 선택해도 됩니다.)    - 무비클립을 만들 때 십자가 나타나면 붙여 넣기[Ctrl+v] 하면 됩니다. 그러면 위 그림의 2와      같이 만든 무비클립 이외에도 복사한 그림도 함께 나타납니다. 주의 할 점은 절대 그림을      지워선 안된다는 것입니다. 이 그림을 지우면 무비클립에 있는 그림도 함께 사라지거든요.) 3. 무비 클립 하나를 라이브러리 창에서 드래그하여 바탕화면에 붙여 넣는다. 그리고 그 위에 다른    무비 클립을 겹쳐서 붙여 넣는다. (위에 있는 무비클립만 보일 거예요. 전 그림2를 먼저 붙여    넣고 그림1을 그 위에 붙여 넣었습니다. 위 그림의 3번과 같이...) 4. 맨 위에 있는 무비클립을 클릭하고 속성에서 인스턴스 이름을 정한다. (전 제 이니셜을 따서..^^) 5. 레이어 삽입 버튼을 클릭한다.    - 위 그림의 5-1과 같이 "레이어 2"가 생기는 것을 확인할 수 있습니다. (전문가들은 그림과       액션을 구분하기 위해 종 종 이렇게 합니다. 모방은 제2의 창조!) 6. 레이어 2의 1번 프레임을 클릭한 후 마우스 오른쪽 버튼을 눌러 "액션"을 선택한다. 그리고나서    다음과 같이 코드를 써 넣는다.     function go() {    if (ok && _root.kjh._alpha>0) {    //ok가 1이고 알파가 0보다 클 때       _root.kjh._alpha -= 2;    }    if (!ok && _root.kjh._alpha<100) { //ok가 0이고 알파가 100보다 작을 때       _root.kjh._alpha += 2;    } } setInterval(go, 25); _root.onMouseDown = function() {  //바탕화면을 마우스로 눌렀을 때    if (ok) {            //ok가 1이면(if) 0으로 만들고        ok = 0;          //ok가 0이면(else) ok를 1로 만들라는 액션    } else {       ok = 1;    } }; 7. Ctrl+Enter로 확인해 본다. (마우스를 한번 클릭하면 위에 있는 그림이 서서히 사라지고 뒤에    있는 그림이 보이고 다시 한번 더 클릭하면 그 위에 그림이 서서히 나타나는 것을 확인할 수    있을 거예요. ^^)     사후 팁 :  코드 바꾸기    function go() {    if (ok && _root.kjh._alpha>0) {                 _root.kjh._alpha -= 2;    }    if (!ok && _root.kjh._alpha<100) {             _root.kjh._alpha += 2;    } }     위의 코드는 다음과 같이 바꾸어도 동일한 의미가 됩니다.    function go() {    if (ok && _root.kjh._alpha>0) {                 _root.kjh._alpha -= 2;    }else if (!ok && _root.kjh._alpha<100) {             _root.kjh._alpha += 2;    } }     else와 else if는 엄청 다릅니다. 만약 위에서 그냥 else하면 ok가 0이거나 알파가 0보다 작으면 언제라도 실행되지만 else if하고 또 다른 조건을 주게 되면 그 조건에 만족할 때만 그 내용을 실행합니다. 초보자들은 저 위에 있는 것처럼 if와 if를 계속 사용하는 것이 편하겠지만 고급 사용자로 갈 수록 바로 위에 있는 것처럼 else if를 자주 활용하게 됩니다. ^^     3. 과제(if문을 활용하여 그림 바꾸기를 다양하게 응용할 수 있다.)   1. 위에 있는 그림이 회전하면서 작아져서 그 뒤에 있는 그림이 나타나게 하려면 어떻게 해야할까? 2. 위에 있는 그림이 왼쪽으로 걷히면서 뒤에 있는 그림이 나타나게 하려면 어떻게 해야할까?     (힌트 : _width) 3. 위에 있는 그림이 오른쪽으로 걷히면서 뒤에 있는 그림이 나타나게 하려면 어떻게 해야할까?     매우 고급임 (힌트 : _x, _width)   과제는 "과제 제출방"에 제출해 주세요...