8. 내 맘대로 그림판 만들기

【배우기】


다양한 색의 선 그리기

굵기, 투명도를 달리해서 선 그리기

그림판 지우기

1다양한 색의 선 그리기

가. 사용할 블록
이미지. 붓의 색을 빨간색으로 정하기 블록의 스크린샷

붓의 색을 정하는 블록이다. 70가지의 색을 지정할 수 있고, [그리기 시작하기] 블록을 사용할 경우 지정한 색으로 붓이 그림을 그리는 것을 확인할 수 있다.

이미지. 그리기 시작하기 블록의 스크린샷

그리기를 명령하는 블록이다. 지정한 색과 굵기, 투명도로 그림이 그려지게 된다.

이미지. 그리기 멈추기 블록의 스크린샷

그리기를 멈추라고 명령하는 블록이다. 그림을 그리는 과정을 멈추게 된다.

이미지. 마우스 포인터 위치로 이동하기 블록의 스크린샷

오브젝트를 마우스 포인터가 위치한 곳으로 이동할 때 사용하는 블록이다. 그림판 프로그램에서는 그림을 그리는 연필 오브젝트가 마우스가 위치한 곳을 따라다녀야 하므로 이 블록을 사용해야 한다.

이미지. 계속 반복하기 블록의 스크린샷

계속 반복하기 블록은 감싸고 있는 블록이 계속해서 실행되도록 해주는 블록이다. 연필 오브젝트가 마우스 위치를 계속해서 따라다녀야 하기 때문에 [마우스 포인터 위치로 이동하기] 블록을 [계속 반복하기] 블록으로 감싸줘야 한다.

이미지. 대상없음 신호 보내기 블록의 스크린샷

[신호 보내기] 블록은 다른 오브젝트와 상호작용하기 위한 블록이다. 그림판 프로그램에서 선을 그릴 때는 물감을 클릭했을 때, 연필이 해당하는 물감의 색으로 선의 색을 변경해야 하므로 [신호 보내기] 블록이 사용된다.


이미지. 대상없음 신호를 받았을 때 블록의 스크린샷

[신호를 받았을 때] 블록은 [신호 보내기] 블록과 함께 사용된다. [신호 보내기] 블록에서 보낸 신호를 받았을 경우 아래 연결된 명령이 실행된다. 그림판 프로그램에서는 물감의 색에 해당하는 신호를 받았을 때 연필의 색을 받은 신호의 색으로 바꾸게 된다.

나. 오브젝트 배치
이미지. 공책 오브젝트의 스크린샷

[나의 공책] 배경 오브젝트 추가

이미지. 공책 오브젝트에 연필 오브젝트가 추가된 화면의 스크린샷

[연필(1)] 오브젝트 추가

이미지. 공책 오브젝트에 연필 오브젝트와 물감 오브젝트 4개를 배치한 스크린샷

[물감]오브젝트를 4개 배치하고 [모양]에서 빨강, 노랑, 파랑, 검정의 4가지 색으로 배치

다. 선 색깔 달리해서 그리기
이미지. 연결된 블록의 스크린샷 4개가 있는 이미지. 1. 오브젝트를 클릭했을 때 블록과 파랑 신호 보내기 블록이 연결되어 있는 스크린샷, 2. 오브젝트를 클릭했을 때 블록과 노랑 신호 보내기 블록이 연결되어 있는 스크린샷. 3. 오브젝트를 클릭했을 때 블록과 검정 신호 보내기 블록이 연결되어 있는 스크린샷. 4. 오브젝트를 클릭했을 때 블록과 빨강 신호 보내기 블록이 연결되어 있는 스크린샷

[속성]탭의 [신호]에서 색깔 신호 만들기

이미지. 시작하기 버튼을 클릭했을 때 블록, 계속 반복하 블록, 마우스포인터 위치로 이동하기 블록이 연결되어 있는 스크린샷

[움직임] 꾸러미의 [마우스 포인터 위치로 이동하기] 블록을 [흐름] 꾸러미의 [계속 반복하기] 블록으로 감싸주기

이미지. 마우스를 클릭했을 때 블록, 그리기 시작하기 블록이 연결되어 있는 스크린샷
이미지. 마우스를 클릭했을 때 블록, 그리기 멈추기 블록이 연결되어 있는 스크린샷

[시작] 꾸러미의 [마우스를 클릭했을 때] 블록과 [마우스 클릭을 해제했을 때] 블록에 각각 [붓] 꾸러미의 [그리기 시작하기]블록과 [그리기 멈추기] 블록을 연결하기

이미지. 연결된 블록의 스크린샷 4개가 있는 스크린샷. 1. 빨간 신호를 받았을 때 블록, 붓의 색을 빨강으로 정하기 블록이 연결되어 있는 스크린샷. 2. 노랑 신호를 받았을 때 블록, 붓의 색을 노랑으로 정히가 블록이 연결되어 있는 스크린샷. 3. 파랑 신호를 받았을 때 블록, 붓의 색을 파랑으로 정하기 블록이 연결되어 있는 스크린샷. 4. 검정 신호를 받았을 때 블록, 붓의 색을 검정으로 정하기 블록이 연결되어 있는 스크린샷.

[시작] 꾸러미의 [신호를 받았을 때] 블록을 이용해 붓의 색을 물감의 색으로 변경하기

이미지. 물감이 있는 공책 오브젝트에, 연필오브젝트로 그림판이라고 적고 있는 화면의 스크린샷

다양한 색으로 그림 그려보기

[실행결과]
이미지. 다양한 색으로 그림 그려보기 동영상의 스크린샷

2굵기, 투명도를 달리해서 선 그리기

가. 사용할 블록
이미지. 붓의 투명도를 10% 만큼 바꾸기 블록의 스크린샷

붓의 투명도를 변화시킬 때 사용하는 블록이다. 정한 비율만큼 투명도가 변화된다.

이미지. 붓의 굵기를 1 만큼 바꾸기 블록의 스크린샷

붓의 굵기를 변화시킬 때 사용하는 블록이다. 정한 비율만큼 굵기가 변화된다.

나. 오브젝트 배치
이미지. 공책 오브젝트에 물감 오브젝트, 연필오브젝트, 빼기, 더하기, 마름모 오브젝트가 배치되어 있는 화면의 스크린샷

① 빼기, 더하기, 마름모 오브젝트 배치

② 마름모 오브젝트는 2개를 배치하는 데 크기를 조절해서 한 개는 작게, 한 개는 크게 만들기

다. 선 색깔 달리해서 그리기
이미지. 연결된 블록의 스크린샷 2개가 있는 이미지. 1. 오브젝트를 클릭했을 때 블록, 얇게 신호 보내기 블록이 연결되어 있는 스크린샷. 2. 오브젝트를 클릭했을 때 블록, 두껍게 신호 보내기 블록이 연결되어 있는 스크린샷.

빼기와 더하기 오브젝트를 클릭했을 때 [얇게] 신호와 [두껍게] 신호 보내기

이미지. 연결된 블록의 스크린샷 2개가 있는 이미지. 1. 오브젝트를 클릭했을 때 블록, 희미하게 신호 보내기 블록이 연결되어 있는 스크린샷. 2. 오브젝트를 클릭했을 때 블록, 선명하게 신호 보내기 블록이 연결되어 있는 스크린샷.

작은 마름모와 큰 마름모를 클릭했을 때 [희미하게] 신호와 [선명하게] 신호 보내기

이미지. 연결된 블록의 스크린샷 2개가 있는 이미지. 얇게 신호를 받았을 때 블록, 붓의 굵기를 -1만큼 바꾸기 블록이 연결되어 있는 스크린샷, 두껍게 신호를 받았을 때 블록, 붓의 굵기를 1만큼 바꾸기 블록이 연결되어 있는 스크린샷

[얇게 신호를 받았을 때]와 [두껍게 신호를 받았을 때] 블록에 [붓의 굵기를 -1만큼 바꾸기]와 [붓의 굵기를 1만큼 바꾸기] 블록을 연결하기

이미지. 연결된 블록의 스크린샷 2개가 있는 이미지. 희미하게 신호를 받았을 때 블록, 붓의 투명도를 1퍼센트만큼 바꾸기 블록이 연결되어 있는 스크린샷, 선명하게 신호를 받았을 때 블록, 붓의 투명도를를 -1퍼센트 만큼 바꾸기 블록이 연결되어 있는 스크린샷

[희미하게 신호를 받았을 때]와 [선명하게 신호를 받았을 때] 블록에 [붓의 투명도를 1만큼 바꾸기]와 [붓의 투명도를 -1만큼 바꾸기] 블록을 연결하기

이미지. 원하는 굴기와 투명도로 공책오브젝트에 그림을 그리고 있는 화면의 스크린샷

원하는 굵기와 투명도로 그림그리기

[실행결과]
이미지. 원하는 굵기와 투명도로 그림그리기 동영상의 스크린샷

3그림판 지우기

가. 사용할 블록
이미지. 모든 붓 지우기 블록의 스크린샷

그려진 모든 그림을 지울 때 사용하는 블록이다. 그림판 프로그램에서는 지우개 버튼을 클릭하면 모두 지워지게 하는 역할을 한다.

나. 오브젝트 배치
이미지. 공책 오브젝트에 지우개 버튼 오브젝트를 배치한 화면의 스크린샷

지우개 버튼 오브젝트 배치

다. 그려진 그림 지우기
이미지. 오브젝트를 클릭했을 때 블록, 지우개 신호 보내기 블록이 연결된 스크린샷

지우개 버튼 오브젝트를 클릭하면 [지우기] 신호 보내기

이미지. 지우개 신호를 받았을 때 블록, 모든 붓 지우기 블록이 연결된 스크린샷.

[지우기] 신호를 받았을 때 블록에 [붓] 꾸러미의 [모든 붓 지우기] 블록 연결하기

[실행결과]
이미지. 그림판 지우기 동영상의 스크린샷