16. 앱인벤터 퀴즈만들기 - 리스트(list)활용 철학의 달인 퀴즈 만들기

 

 

 

 

 

이번에는 리스트 속 리스트를 활용하여 

간단한 퀴즈 앱을 만들어겠습니다.

 

퀴즈앱의 이름은 '철학의 왕!' 입니다. ㅎㅎ

 

이 퀴즈앱은 철학자들의 명언을 보고 이 명언을 말한 철학자의 이름을

맞히는 앱으로 이를 응용하여 속담 맞추기, 넌센스 퀴즈 앱 등을 만들 수 있습니다. 

 

 

---

 

 

 

1. 앱 화면 및 기능 구상하기

 

 

'철학의 달인' 앱은

철학자의 명언 문제를 보고 그 명언을 말한 철학자의 이름을 맞추는 간단한 퀴즈 앱입니다.

 

기능을 살펴보겠습니다.

'시작' 버튼을 누르면 문제번호와 철학자의 명언이 나옵니다.

답 입력 칸에 해당 명언을 말한 철학자의 이름을 적고 '입력' 버튼을 누릅니다.

정답이면 '정답입니다.' 라고 나오고 정답이 아니면 '다시 생각해보세요.' 라는 문구가 나옵니다.

 

다음 문제로 넘어가려면 '다음' 버튼을 누릅니다.

 

총 7개의 문제를 다 풀고 '다음' 버튼을 누르면 

최종 점수가 나옵니다.

 

 

 

 

2. 앱 화면 만들기

 

 

디자인은 심플하게! 

그림이 짤려 보이지만 실제로 앱을 작동시키면 제대로 나옵니다.크기만 잘 세팅해놓으면 됩니다.

 

 

 

 

3. 코딩하기

 

 

3-1. 퀴즈 리스트 만들기

 

지난번 글에서 썼던 것처럼

리스트 안에 리스트를 만들어서 각 문제를 리스트 형태로 만들어 줍니다.

(앱인벤터에 딕셔너리 기능이 추가되어 이제 딕셔너리로 만들어도 될듯합니다!)

 

 

3-2. 문제 번호와 점수 변수 만들기

 

문제 번호와 점수는

변수로 만들어 줍니다.

 

 

3-3. 퀴즈 출제 함수 만들기

 

문제 번호는 퀴즈와 index값으로 하고

실제 문제는 quiz리스트에서 index번째 위치에 있는 항목 중

다시 1번 위치에 있는 항목을 가져옵니다.

리스트 안의 리스트이기 때문에 quiz리스트 속 1번 리스트 속 1번 항목을 가져오는 것이죠.

 

 

 

3-4. 시작 버튼 코딩

 

'시작' 버튼을 누르면 퀴즈문제가 출제되도록 해보겠습니다.

시작 버튼을 누르면 문제 번호(index)는 1이 되고, 점수(score)는 0이 됩니다.

답 입력 박스와 입력 버튼은 보이고, 최종 정답 개수와 문구는 보이지 않게 합니다.

그리고 퀴즈 문제 함수를 호출합니다.

 

 

3-5. 입력 버튼 코딩

 

다음으로 '입력'버튼을 눌렀을 경우를 코딩해보겠습니다.

사용자가 정답을 입력한 뒤 '입력' 버튼을 누르면 정답이 맞는지 아닌지 판단을 해야하겠죠.

 

만약 답입력 박스에 적힌 텍스트가

quiz리스트 안의 1번 리스트 안의 2번 위치에 있는 답 항목을 포함하고 있다면

점수(score)에 1점을 추가합니다.

그리고 '정답' 이라고 알려줍니다.

 

만약 정답이 아니라면 점수는 추가하지 않고, '다시 생각해봐요!' 라고 안내문구를 띄웁니다.

 

 

3-6. 다음 버튼 코딩

 

마지막 '다음' 버튼을 클릭했을 때를 코딩해보겠습니다.

 

다음 버튼이 좀 복잡합니다.

 

일단 다음 버튼을 눌렀다면 정답여부와 답입력박스 텍스트는 지워줍니다.

 

그리고 만약에 문제 번호가 quiz리스트보다 작다면

index에 1를 더해준 뒤 퀴즈출제 함수를 호출하면 되겠죠. 

즉 문제는 7개가 있기 때문에 문제 번호(index)가 7보다 작다면 다음 문제를 계속 보여주는 것입니다.

 

근데 만약에 7개가 다 끝나서 index가 8이 되었다면

문제 번호가 있는 부분에는 '문제 끝' 이라는 문구를 띄워주고 

실제 문제, 답입력박스, 입력버튼 등은 다 안보이게 해야합니다.

그리고 최종 정답 개수와 문구만 보이게 합니다.

 

이 때에도 만약에 사용자가 퀴즈를 6개 이상 맞추었다면

최종점수를 보여주고 '철학의 달인이시군요.' 라고 문구를 띄웁니다.

 

만약 사용자가 6개 미만으로 퀴즈를 맞추었다면

최종점수를 보여주고 '철학은 우리 삶 속에 있어요.' 라는 문구를 띄워줍니다.

 

사용자가 '시작' 버튼을 누른다면 퀴즈는 다시 시작됩니다.

물론 index는 다시 1번, 점수(score)는 다시 0점이 되겠죠!

 

 

 

 

 

3-7. 최종 블록

 

위의 블록들을 모은 최종 블록입니다.

복잡해보이지만

기능별로 분해해서 코딩하다보면

금방 전체 코드가 완성 된답니다. 

 

---

 

 

 

4. 테스트하기

 

마지막!테스트하기 입니다.테스트를 보며 철학의 달인 퀴즈를 한 번 풀어보세요!