한국어

Programming

twin 주소복사
조회 수 2368 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄

 앱인벤터2 강좌 18: 숫자 암기 게임

 이번 시간에는 앱인벤터2로 만드는 게임시리즈로 화면에 9개의 숫자를 임의로 보여주고 다시 복원하는 게임을 만들어 보겠다. 이 게임은 카드 암기게임을 실행하기 전에 한두번 정도 해 보면 두뇌를 조금 각성시키는 효과가 있을 것으로 생각한다. 이 게임 또한 TinyDB에 나온 숫자를 저장하고 유저가 버튼을 누르때 마다 저장된 숫자와 유저가 누른 숫자가 맞는지 확인하는 절차를 거친다. 그림을 보면서 설명하겠다.
출처: http://kusson.tistory.com/151?category=635753 [꾸숑의 ICT 월드]

 앱인벤터2 디자이너 에디터에 위와 같이 화면을 구성한다. 화면 중간의 숫자들은 TableArragement를 3×3으로 구성해서 숫자를 하나씩 채워준다. TableArragement 아래에 나오는 HorizontalArragement 9칸은 유저가 버튼을 눌렀을때 정답이면 그 숫자가 들어가는 자리이다. 마지막으로 'NewGame'과 힌트를 표시해 주는 '다시보기' 버튼을 배치한다. 또 Non-visible components로는 클락 2개와 TinyDB 하나, 그리고 알림표시를 위한 Notifier 하나가 필요하다.

 

    

 이해를 돕기 위해 게임을 실행했을때 나오는 화면을 스크린샷으로 저장해서 표시했다. 처음 게임이 실행되면 1초 간격으로 숫자가 표시된다. 9개의 숫자가 모두 표시되었으면 '숫자를 차례대로 누르세요'란 메시지가 나온다.

이때 어떤 숫자가 나왔는지 기억이 잘 나지 않을 경우에는 '다시보기'버튼을 눌러 힌트를 얻을 수 있다.

 

    

 번호 버튼을 눌러서 그 버튼이 순서에 맞는 수일 경우에는 아래 빈칸에 숫자가 하나씩 채워지고 틀리면 틀렸다는 알림창이 뜨면서 다시 버튼을 눌려야 한다. 9개의 숫자가 모두 채웠졌으면 'Sucess!!' 알림창이 뜨면서 새로운 게임을 할 것인지 게임을 끝낼 것인지 선택하게 한다.

 

 이제 블럭 에디터 그림을 보면서 위의 상황들을 어떻게 프로그램적으로 처리하는지 알아보자.

 

 먼저 이 게임에 쓰이는 변수를 선언한다. 'randomNumberCount' 변수는 이름에서 알수 있듯이 화면에 임의의 숫자가 하나씩 표시될때 그 순서를 저장하기 위한 변수이다. 'viewCount'는 힌트가 표시될때 그 힌트가 몇번째 나온 숫자인지를 나타내는 변수이고 'pushButtonCount'는 유저가 화면 중앙의 숫자 버튼을 누를때 카운트되는 변수이다. 'randomNumber 리스트'는 1부터 9까지의 숫자 중에서 임의로 하나를 선택하기 위한 리스트이다.

 

 

 이제 화면에 임의의 숫자가 나타나게 하는 루틴을 살펴보자. 그 처리는 'randomNumberClock.Timer'에서 실행된다. 게임이 시작되면 'randomNumberClock.Timer'가 enable되면서 이벤트 블럭안의 순서대로 처리된다. 먼저 3×3 테이블 안의 숫자를 모두 안보이게 만들고 'randomNumberCount'를 하나씩 올리면서 임의의 숫자를 화면에 표시하고 그 숫자를 TinyDB에 저장한다. TinyDB의 이름이 'randomNumSaveDB'로 되어있으니 혼동하지 말기 바란다. 숫자를 저장할때 그 숫자는 'randomNumberCount'를 tag로해서 저장된다.

 

 숫자 버튼을 누르면 'pushButtonCount'가 하나씩 올라가고 만약 1번 버튼을 눌렀으면 '1'과 TinyDB tag1번의 숫자를 비교한다. 숫자가 틀리면 다른 번호를 누르라는 알림창이 뜨고 pushButtonCount를 올리지 않는다. 즉 하나를 뺀다. 또 pushButtonCount가 9일때를 비교하는 것은 1번 버튼을 9번째로 눌렀다는 의미이고 '1'이 TinyDB tag9의 숫자와 같을 때 즉 TinyDB tag9에 저장되어 있는 숫자가 '1'일 경우에는 모두 다 맞힌 것을 의미하므로 성공했다는 알림창을 띄우기 위한 것이다.  

 

 Screen4.Initialize는 게임이 처음 실행되었을때 초기화하는 부분이다. TinyDB안에 들어 있는 모든 숫자를 지우고 변수를 0으로 셋팅한다. 그리고 'Ready!'라는 문자를 화면에 출력하고 잠시후 1부터 9까지의 수중에서 임의의 한 숫자를 1초 간격으로 화면에 표시한다. NewGame.Click 이벤트 블럭은 게임 중간에 언제든지 새게임을 시작하고 싶을 때 실행되는 상황을 나타낸다.

 

 'showNumClock.Timer'는 유저가 누른 버튼이 그때의 순서에 맞는 숫자일 경우 아래 숫자란에 표시해 주는 블럭이다. 'pushButtonCount'는 유저가 버튼을 눌렀을때 정답일 경우에만 하나씩 올라가므로 만약'pushButtonCount'가 3이라면 TinyDB tag3번의 숫자가 숫자란3에 표시된다는 것이다. 'showNumber.Click'은 힌트를 표시해 주기 위한 이벤트 블럭이다.



출처: http://kusson.tistory.com/151?category=635753 [꾸숑의 ICT 월드]


List of Articles
번호 제목 글쓴이 날짜 조회 수
51 2020 게임제작과 직업교육 실습 자료  twin 2020.12.07 342
50 [앱인벤터2 강좌] 가위 바위 보 앱  twin 2019.09.18 3018
49 [앱인벤터2 강좌] 폭탄 돌리기  twin 2019.09.17 1572
» 앱인벤터2 강좌 : 숫자 암기 게임  twin 2018.10.12 2368
47 앱인벤터2 강좌: fingerFind5 게임  twin 2018.10.12 1809
46 과제알림장 앱 만들기  twin 2018.10.12 2476
45 문자메시지 보내기  twin 2018.10.12 1828
44 메모장 앱 만들기  twin 2018.10.12 1659
43 앱인벤터 동영상 강좌 app123.kr  twin 2018.09.17 52509
42 색상 팔렛트 만들기  twin 2018.09.14 1586
41 지도에 내 위치 표시하기  twin 2018.09.14 5834
40 스톱워치 만들기  twin 2018.09.14 7758
39 [앱 인벤터2] 두더지 잡기 게임2  twin 2018.09.14 2665
38 [앱인벤터] 예제 - 두더지 게임  twin 2018.09.11 11771
37 [앱 인벤터2] 우주선게임  twin 2018.08.30 2776
36 [앱 인벤터2] 간단한 계산기  twin 2018.08.30 3072
35 [앱 인벤터2] 공튀기기  1 twin 2018.08.30 2487
34 [앱인벤터2] Extension(확장기능)을 사용한 깜박이는 플래시라이트  twin 2018.08.27 2193
33 [앱인벤터2] PasswordTextBox와 TinyDB를 사용한 PIN 번호 체크  twin 2018.08.27 3109
32 [앱인벤터] ListPicker와 WebViewer를 이용한 내가 즐겨찾는 사이트 앱  twin 2018.08.27 2827
Board Pagination Prev 1 2 3 Next
/ 3