꽃 만들기[04] – 엔트리

지난 작품에 이어서 이번에는 이 작품의 제목을 출력해 보자. 제목은 회전하면서 작은 글씨에서 점차 큰 글씨로 변해간다. 제목이 나타난 후에 플레이어로 부터 화면에 그려질 꽃송이의 갯수를 입력받고 시작 버튼을 클릭하면 장면이 바뀌어 지난 작품에서 만든 꽃이 화면에 그려지도록 한다.

장면 추가하기

꽃만들기300.png


지난 작품을 로드하면 장면 1에 그려져 있는데 + 탭을 클릭하여 장면을 추가한다. 탭을 옮겨 장면의 순서를 바꿀 수 있고 이름도 바꿀 수 있다. 그렇게 하여 과거에 만든 오브젝트들을 장면 2에 담고, 이번 작품에서 새로 추가할 오브젝트들을 장면 1에 담을 수 있도록 준비한다.

배경 만들기

꽃만들기301.png


꽃밭 그림의 배경을 장면 1에 추가한다.

제목 만들기

꽃만들기302.png


글상자 오브젝트를 추가한다. 오브젝트의 이름은 제목 으로 하고 글 내용은 꽃 만들기 로 한다. 글상자 배경색은 투명으로 하고, 글자색은 배경에 비해 눈에 잘 띄는 색으로 정한다. 이번 작품에서는 노란색으로 정했다. 글씨의 크기와 위치를 적당히 설정한다.

신호 추가하기

꽃만들기303.png


사용자입력 이라는 이름으로 신호를 추가한다.

제목 오브젝트의 블럭 코딩

꽃만들기304.png


위 그림과 같이 제목 오브젝트의 블럭코딩을 완성하고 실행해 본다.
제목의 글씨가 회전하면서 점점 커지고 멈출 것이다.

  • 회전 속도를 다르게 하거나,
  • 글씨의 크기를 다르게 하려면 어떻게 해야 할까?

사용자 입력을 위한 변수 추가

꽃만들기305.png


꽃개수라는 이름으로 변수를 추가한다. 슬라이드 속성을 활성화 하여 화면에 슬라이드바를 보이게 한다. 기본값은 10으로 정한다.

시작 버튼 만들기

꽃만들기306.png


시작 이라는 이름으로 글상자 오브젝트를 만든다. 글 내용도 시작으로 한다. 글상자의 배경색과 글자색을 모드 다르게 설정하여 버튼처럼 보이게 한다.

시작 버튼의 블럭코딩

꽃만들기307.png


시작 버튼의 블럭코딩을 그림과 같이 완성하고 실행시킨다.
제목이 등장한 뒤 플레이어가 꽃개수를 정하고 시작 버튼을 클릭할 때 까지 기다린다.

장면 전환 후 꽃 그리기

꽃만들기308.png


장면 2 에 담긴 줄기 오브젝트의 코딩블럭을 수정한다.

꽃 만들기[03] – 엔트리

지난 시간에 이어 꽃을 완성하기로 한다. 지난 시간 까지는 꽃의 줄기와 잎을 생성하였고, 이번 시간에는 그 위에 꽃을 생성하도록 한다.


꽃만들기200.png


모든 코드블럭이 완성되고 실행해 보면 위 그림과 같이 플레이 될 것이다.

신호 및 변수 만들기


꽃만들기201.png


꽃생성잎생성 이라는 이름으로 신호를 만든다.
꽃잎수, 줄기방향, 꽃위치x, 꽃위치y 라는 이름으로 변수를 만든다. 이때, 모든 오브젝트에서 사용 옵션을 선택한다.


줄기 코딩블럭 수정 및 확인


꽃만들기202.png


잎 코딩블럭 수정 및 확인


꽃만들기203.png


꽃 오브젝트 생성


꽃만들기204.png


그림과 같이 꽃 오브젝트를 새로 생성한다. 그리고 꽃잎 한장을 그리고 꽃잎 이라는 이름으로 모양을 생성한다.


꽃만들기205.png


꽃 오브젝트의 이름을 으로 정하고, 이동방향의 값을 0.0 으로 정한다.

꽃 오브젝트 코딩블럭


꽃만들기206.png


위 그림과 같이 꽃 오브젝트의 코딩블럭을 작성하고 실행해 본다.

꽃 만들기[02] – 엔트리

전 작품에 이어 이번 작품도 꽃을 만들어 보자. 이번 작품에서는 꽃송이뿐만 아니라 줄기와 잎도 만들어 보자.

줄기 만들기

꽃만들기101.png
줄기 오브젝트를 생성하기 위해 + 버튼을 클릭하고, 줄기의 모양은 동그란 원으로 직접 그린다. 원의 크기와 색은 어떤 것으로 해도 상관없으니 자유롭게 정하자. 모양의 이름은 줄기로 한다.
꽃만들기102.png
오브젝트의 이름도 줄기 라고 정한다.

꽃만들기103.png
위 그림과 같이 블럭코딩을 완성하고 실행해 보자.
우리가 그린 모양은 나타나지 않는다. 대신 오브젝트가 움직인 자리에 붓이 그림을 그린다. 붓이 오브젝트를 따라 움직인다.

꽃만들기104.png
다양한 모양의 줄기를 완성하기 위해 블럭코딩을 위 그림과 같이 수정한다.

  • 줄기의 모양을 다르게 하기 위해 코딩블럭이 어떻게 바뀌었는지 생각해 보라.

잎 만들기

줄기에 잎을 달자.
꽃만들기105.png
먼저, 잎 오브젝트를 위 그림과 같이 만든다.

꽃만들기106.png
오브젝트의 이름도 으로 한다. 이동방향을 0.0으로 한다.
여기서 특히 중요한 것은 잎의 회전중심점을 아래로 이동해야한다.

꽃만들기107.png
위 그림과 같이 변수를 추가한다. 추가해야 할 변수는 다음과 같다. 모두 모든 오브젝트에서 사용 옵션을 선택한다.

  • 잎위치x
  • 잎위치y
  • 줄기방향

꽃만들기108.png
위 그림과 같이 신호를 추가한다.
신호의 이름은 잎생성 으로 한다.

잎 오브젝트의 블럭코딩

꽃만들기109.png

줄기 오브젝트의 블럭코딩 수정

꽃만들기110.png

  • 잎의 크기를 바꾸기 위해서는 어떻게 수정하겠는가?
  • 잎의 각도를 바꾸기 위해서는 어떻게 수정하겠는가?
  • 줄기를 따라 더 많은 잎을 생성해 보자.

꽃 만들기[00] – 엔트리

꽃을 만들어 보자. 예쁜 꽃.

꽃잎 오브젝트 만들기

꽃만들기001.png
제일 먼저, + 버튼을 클릭하여 꽃잎 오브젝트를 만들자. 오브젝트 모양은 직접 그리고 이름을 모양01 로 한다. 꽃잎 한 장의 모양을 그리면 된다.
꽃만들기002.png
오브젝트의 이름을 꽃잎으로 하고, 이동방향은 0으로 한다.
꽃만들기003.png
꽃잎의 회전중심을 꽃잎의 중앙에서 아래로 바꾼다.


꽃잎 모양 첫번째 코딩블럭

꽃만들기004.png
위와 같이 코딩블럭을 완성한다.
꽃만들기005.png
시작하기 버튼을 클릭하여 위와 같은 그림이 그려졌는가 확인해 본다.

  • 꽃잎이 모두 10장인데 왜 그럴까?
  • 꽃잎을 5장으로 바꾸어 보아라.그러기 위해서는 회전하는 방향을 몇도로 해야 할까?

꽃잎 모양 바꾸기

꽃잎의 위치, 꽃잎의 투명도 바꾸기

꽃만들기006.png
위와 같이 블럭을 수정하고 실행해 본다.
꽃잎의 위치를 바꾸고, 꽃잎 한 장 한 장의 투명도를 바꾸면서 변화를 준다.

  • 생성되는 꽃잎의 위치가 제대로 바뀌어 있는가?
  • 꽃잎의 투명도 효과가 잘 적용 되었는가?

꽃잎의 크기와 색깔과 밝기를 무작위로 바꾸기

꽃만들기007.png
위와 같이 블럭코딩을 수정하고 실행해 본다.

꽃잎의 갯수를 무작위로 정하기

꽃만들기008.png
먼저 속성탭을 클릭하여 변수를 만든다. 변수명은 꽃잎수로 하고 이 오브젝트에서 사용을 선택하여 확인을 클릭한다.

꽃만들기009.png
위와 같이 블럭코딩을 수정하고 실행해 본다.

  • 꽃잎의 갯수가 3~20 장으로 무작위하게 정해지는가?
  • 투명도 와 방향을 정하는 코딩블럭이 왜 이렇게 수정되어야 하는가?

30개의 꽃을 무작위로 만들기

꽃만들기010.png
위와 같이 코딩블럭을 수정하고 수정한다.

꽃만들기011.png
위와 같은 결과가 얻어진다.