이번 장에서는 빙글빙글 회전하는 표적에 마우스를 클릭하여 표적의 1, 2, 3, 4의 번호 중 하나를 선택하는 게임을 만들어 보겠습니다.
사용자 삽입 이미지
1. 스프라이트 추가

사용자 삽입 이미지
기존 스프라이트를 삭제하고 좌측의 스프라이트 추가 버튼을 클릭하여 표적과 화살 이미지를 선택하여 아래와 같이 두개의 스프라이트를 추가합니다. 표적과 화살 이미지는 페인트 툴에서 직접 그리거나 아래의 이미지 파일을 다운로드 받아 사용합니다.


2. 표적 스크립트

1) 변수 생성
변수(Variables)는 스크립트에서 특정 상태나 값을 저장하기 위해서 사용합니다. 변수는 말 그대로 변할 수 있는 수(값)이기 때문에 원하는 값을 설정하고 참조할 수 있습니다. 이 프로그램에서는 표적이 회전해야 하는지 화살이 발사되어 멈추어야 하는지를 판별하기 위해 isEnd란 변수를 생성하여 사용합니다.

isEnd가 1일 경우에는 사용자가 마우스를 클릭하여 화살이 발사된 경우며, 0일 경우에는 아직 발사하지 않은 상태입니다.

사용자 삽입 이미지
변수를 만들기 위해 Variables를 항목에서 [Make a variable] 항목을 클릭합니다.

아래와 같이 변수를 생성하는 창이 열리면, 생성될 변수의 이름을 입력한 후 [OK]를 클릭합니다.

For all sprites는 모든 스프라이트가 사용하도록 생성됩니다. For this sprite only는 해당 스프라이트에서만 사용하는 변수입니다. 여기서는 표적 스프라이트와 화살 스프라이트에서 모두 참조 하므로 아래와 같이 For all sprites를 선택합니다.

사용자 삽입 이미지

사용자 삽입 이미지
변수 생성이 완료되면 좌측과 같이 세개의 블럭이 추가됩니다. 각 블럭들의 의미는 다음과 같습니다.




[change 변수 by (값)]
변수에 (값)에 있는 수만큼 더 합니다.

[set 변수명 to (값)]
변수를 (값)에 입력된 값을 대입합니다.

[변수명]
변수를 if와 같은 조건 블럭이나 Numbers의 여러 대입, 비교등의 블럭내에 드래그 하여 가져다 놓을 수 있습니다.

사용자 삽입 이미지
앞의 체크박스를 클릭하면 좌측과 같이 실행화면에서 좌측과 같이 변수의 값을 확인할 수 있습니다.

2) 스프라이트
표적을 회전시키기 위해 해당 블럭들을 가져와서 아래와 같이 배치합니다.

사용자 삽입 이미지

[set isEnd to (0)]
시작시에 isEnd 값을 0으로 설정합니다.

[forever if <isEnd = (0)>]
포함된 명령어 블럭들이 isEnd가 0인 동안 무한으로 반복됩니다. 녹색의 <() = ()> 블럭은 Numbers에 위치합니다.

[turn (15) degrees]
표적을 한번 반복될 때마다 15도씩 시계방향으로 회전시킵니다.

3. 화살 스크립트

마우스가 클릭되었을 때 화살을 마우스가 눌려진 위치에 출력하고 표적을 정지 시키기 위해 아래와 같이 명령어 블럭들을 배치 합니다.

사용자 삽입 이미지

[hide]
시작시에는 화살의 모습을 숨깁니다.

if <<isEnd = 0> AND <mouse down?>>]
isEnd 변수가 0(표적이 회전 중)이고 사용자의 마우스가 눌러 졌을 경우에만 화살을 발사하도록 합니다. <> and <> 블록은 좌측과 우측의 값이 모두 참(1)일 경우에만 참(1)이 됩니다.

[set isEnd to (1)]
화살이 발사 되었으므로 isEnd를 1로 설정합니다. isEnd가 1이므로 표적이 회전하지 않습니다. (상단 표적 스프라이트 참조)

[play sound [pop]]
스프라이트가 기본으로 가지고 있는 소리(pop)를 출력합니다.

[go to [mouse-pointer]]
마우스 포인터가 위치한 곳으로 스프라이트의 위치를 이동합니다.

[show]
이제 화살을 출력합니다.

이제 테스트를 위해 시작버튼을 클릭합니다. 회전하는 표적에 마우스를 가져가서 클릭하면 해당 위치에 화살이 출력되며 표적이 멈춥니다.


AND

이번 장에서는 마우스를 이용하여 자유롭게 그림을 그릴 수 있는 페인트 툴을 만들어 보겠습니다. Pen을 이용하여 선의 크기와 색상을 변경할 수 있고, 전체를 지울 수 있는 간단한 기능을 넣어 보겠습니다.

사용자 삽입 이미지

1. 변수 생성 및 설정

사용자 삽입 이미지
Variables 의 [Make a variable] 버튼을 클릭하여 좌측과 같이 color와 size 두개의 변수를 생성합니다.

color는 현재 칠해질 색상을 저장하며 size는 선의 굵기를 저장합니다. 스크래치에서 color 값은 0 (빨강) 부터 시작하여 숫자가 커질 수록 무지개 색의 '빨주노초파남보'를 나타내며 다시 200에서 빨강으로 설정됩니다.  




사용자 삽입 이미지
캔버스에서 color 변수를 마우스로 우클릭 하면 좌측과 같은 메뉴가 나타납니다. 색의 범위를 0~200까지 설정하기 위해 'set slider min and max'를 클릭합니다.



아래와 같이 슬라이더의 범위를 설정하는 창이 출력되면 Min에 0을 Max에 200을 입력하고 [OK]를 클릭합니다.
사용자 삽입 이미지


2. 스프라이트 생성

사용자 삽입 이미지
기본 스프라이트를 삭제하고 좌측의 'Paint new Sprite' 버튼을 클릭하여 페인트 에디터를 실행합니다.
 
사용자 삽입 이미지

마우스 커서만 보여지게 하기 위해 시작시 스프라이트를 숨기기(hide) 때문에 좌측처럼 점만 하나 찍은 후에 페인트 에디터의 [OK] 버튼을 클릭하여 저장합니다.



3. 스크립트 생성

전체 스크립트의 모습은 아래와 같으며, 그리 복잡하지 않습니다.

사용자 삽입 이미지

1) 초기화
시작버튼이 클릭되면 페인터의 초기화를 위해 아래와 같은 작업을 합니다.

[hide]
스프라이트를 숨깁니다.

[set color to (100)]
현재 색상을 100으로 설정합니다. 기본으로 다른 색상을 원할 경우에는 100이외의 다른 값으로 변경하셔도 됩니다.

[set size to (3)]
현재 선 굵기를 3으로 설정합니다. 위의 color와 같이 다른 값으로 설정하셔도 됩니다.

[pen up]
그리기 모드를 해제합니다.

[clear]
캔버스를 지웁니다.

2) 루프
시작 후에는 forever 내에서 무한으로 아래의 작업을 반복합니다.

[set pen size to (size)], [set pen color to (color)]
사용자에 의해 펜의 색상과 크기가 변경되었을 경우에 다시 설정합니다.

[go to [mouse-pointer]]
스프라이트의 현재 위치를 마우스 포인터의 위치로 설정합니다.

[if <mouse down?>]
마우스가 클릭되었을 경우에는 [pen down]으로 선을 그리고 클릭되지 않은 상태면 [pwn up]으로 선을 그리지 않습니다.

3) 캔버스 삭제
[when [c] key pressed]
키보드에서 c 키가 눌러 졌을 경우에는 [clear]로 전체 캔버스를 지웁니다.


이제 완성되었습니다. 시작 버튼을 눌러 color와 size의 값들을 변경해 가면서 그림을 그려 봅니다.

전체 소스는 아래의 압축파일을 다운로드 받으세요

AND

티스토리 블로그의 상황을 알려주는 티돌이의 윈도우 버젼입니다. 비스타에서 제작하고 테스트 해 보았는데, XP에서도 문제는 없을 것 같습니다. 역시 급조한거라 버그가 많을 것으로 생각되는데 알려 주시면 수정해서 다시 올리겠습니다.

사용자 삽입 이미지

사용법은 맥버젼과 똑 같습니다. 항목을 더블클릭하면 해당 블로그로 연결됩니다. 타이틀 바에는 오늘 방문자 수가 출력됩니다.

사용자 삽입 이미지

알림 사운드는 기본으로 '스타크래프트의 사이언스 베슬 효과음'을 넣었습니다. 블로그에 변동이 생기면 작업 표시줄에서 활성화 되며 효과음을 출력합니다.

사용자 삽입 이미지

등록 시 블로그 주소를 정확히 입력하셔야 합니다.  'http://'는 넣지 마시고 뒤에 '/'도 막지 않으며 순수한 주소만 입력합니다. 모든 것이 맥용과 동일하니 기존에 사용하셨던 분들은 쉽게 사용하실 수 있습니다.

* 주의: 접속 정보는 해당 컴퓨터의 레지스트리에 저장됩니다. 패스워드는 아주 간단하게 암호화 하여 저장합니다. 보안을 위하여 개인 PC에서만 사용하시기를 바랍니다.

'습작 소프트웨어' 카테고리의 다른 글

파일명 일괄 변환 툴  (2) 2008.04.11
맥 OS X용 올블로그 실시간 인기글 위젯 수정본  (2) 2008.02.26
티돌이 1.0B  (24) 2008.01.07
티돌이 0.7B  (2) 2007.11.08
맥 OS X용 티스토리 알리미 - 티돌이  (27) 2007.11.05
AND