mblock 아두이노 조이스틱 제어(미로게임 만들기)

Posted by JaGG
2018. 5. 28. 11:43 카테고리 없음

오늘은 아두이노에 사용하는 센서 중 가장 흥미로운 센서인 조이스틱을 다루어 보도록 하겠습니다.


먼저 목차로는

 1. 조이스틱에 대해서

2. 회로 스케치 및 브래드보드 레이아웃

3. 미로게임 만들기

4. Mblock으로 미로게임 코딩하기


로 진행하겠습니다.


1. 조이스틱 모듈



    


먼저 조이스틱 모듈은 다음과 같이 생겼습니다. 첫번째 사진 조이스틱 커버를 보면 우리가 흔히 볼 수 있는 게임기의 조이스틱이 있습니다.


이 조이스틱 모듈 안쪽에는 x, y축의 변화량에 따라 아날로그 값으로 출력이 되고 하나의 푸쉬버튼으로 구성이 되어 있습니다.


아날로그 출력 2핀, 버튼 1핀, Vcc, GND 까지 총 5개의 핀을 가집니다.



2. 회로스케치 및 브래드보드 레이아웃



회로도


브래드보드 레이아웃



부품과 아두이노 사이에 연결은 크게 어려운 부분은 없으리라고 생각이 듭니다. 


모듈의 Vcc, GND는 아두이노 +, -에 x, y 이동값에 대한 출력핀은 아날로그핀 A0, 1에 연결하면 됩니다.


남은 하나의 핀은 버튼에 대한 핀인데 일단 오늘은 사용하지 않습니다.


하지만 버튼까지 사용을 해야 한다면 버튼핀을 디지털핀에 연결한 뒤에 아두이노에서 버튼과 같은 방식으로 제어하면 됩니다.



3. Mblock을 이용하여 미로게임 만들기


지금까지 조이스틱을 제어하기 위한 방법에 대해서 살펴보았습니다. 


이 조이스틱과 엠블럭(Mblock)을 이용해서 간단한 게임을 만들어 보겠습니다.


먼저 엠블록을 실행합니다.




가장 먼저 연결된 아두이노의 시리얼 포트를 잡아줍니다. 


연결 > 시리얼포트 에서 컴퓨터에 연결된 포트를 볼 수 있습니다.



다음으로 사용하고 있는 아두이노 보드를 설정합니다.


저는 아두이노 우노 보드를 사용하고 있기 때문에 "Arduino UMO"를 선택 했습니다.



그리고 연결에서 "펌웨어 업그레이드"를 클릭해서 아두이노 보드에 Mblock펌웨어를 다운받습니다.


s4a에서 아두이노 펌웨어를 다운받고 시작하는것과 같은 원리 입니다.


이 펌웨어를 다운받지 않으면 엠블럭에서 아두이노의 블록의 기능을 사용 할 수 없습니다.


기능은 활성화되지 않지만 블록은 활성화가 되어 있기 때문에 처음 시작하시는 분들은 여기서 아두이노가 동작하지 않아 혼등을 겪을수도 있습니다.



펌웨어까지 업로드 받았다면 기능이 정상적으로 활성화 되고 있는지 살펴보겠습니다.


위의 사진과 같이 클릭 했을때 아날로그 1번핀에 값을 말하기 라고 간단하게 코딩 해보았습니다.


그러니 팬더가 현재 연결된 센서(조이스틱 x축)값을 출력하는것을 볼 수 있습니다.


여기까지 세팅이 완료 되어야만 정상적인 엠블록 코딩이 가능해 집니다.



한가지 더 팁을드리면 굳이 센서값을 말하라는 코딩을 하지않아도 블록목록에 "아날로그x값 읽기"블록을 클릭하면 위와 같이 센서값이 블록에 출력이 됩니다.


하지만 이 값은 변동되지 않고 출력되는 값 또한 위와 같이 40 정도의 오차를 가지는 모습입니다.


지금까지 엠블록을 이용한 코딩을 하기위한 초기 설정을 해보았습니다.


그리고 게임을 본격적으로 코딩하기 이전에 한가지 더 세팅 해야할 부분이 있습니다.


바로 배경과 스프라이트를 만드는 것입니다.


엠블록을 처음 실행하면 배경은 흰색배경에 스프라이트는 시그니처 케릭터인 팬더가 있습니다. 


미로게임을 만들기 위하여 배경에 미로를 만들고 스프라이트의 크기를 줄여주는 작업이 필요합니다.


먼저 배경설정에서 "배경 새로그리기"버튼을 클릭합니다.



그러면 다음과 같이 배경을 그릴 수 있는 페이지로 이동이 됩니다.


여기서 선을 선택하고 선 굵기를 적절하게 선택한 후 사진과 같이 배경에 선을 그어줍니다.


직각의 선을 그을때는 shift를 누른채로 선을 그으면 됩니다.



이렇게 대략적인 미로 배경이 완성되었습니다.



다음으로 팬더 스프라이트가 미로에 비해 크기가 크기 때문에 스프라이트의 크기를 출여야 합니다.


스프라이트의 모양에 들어가서 팬더 그림을 클릭하면 쉽게 크기를 줄이고 늘릴 수 있습니다.



4. Mblock으로 미로게임 코딩하기


엠블록과 아두이노의 연결, 펨웨어 업그레이드, 보드의 동작상태를 확인하고,


스프라이트와 배경의 세팅이 완료되면 지금부터 코딩을 시작합니다.


미로게임을 하기 위해서 필요한 기능은 크게


1. 조이스틱으로 스프라이트 움직이기

2. 미로 안에서 스프라이트가 벽을 넘지 못하게 하기

3. 출발선과 도착선 만들기

4. 목숨을 설정해서 게임의 긴장도 높이기

5. 미로 사이에 아이템을 배치하기


엠블록 코딩에 대해서는 블록 하나하나 설명하는 것 보다 소스코드를 직접 보는것이 더 이해가 빠르기 때문에 완성된 코드만 보여드리는 것으로 코딩 설명은 길게 하지 않겠습니다.

먼저 제가 만든 미로 배경입니다.


게임의 완성도를 높이기 위한 바나나 아이템도 게임에 넣어서 만들었습니다.


이렇게 작은 기능을 하나하나 추가 함으로써 작품이 더 높은 완성도를 가지게 되는 것입니다.


판다 스프라이트 코딩


바나나 아이템 스프라이트 코딩