[Quiz 앱 1] 구조체

Lena·2021년 12월 30일

iOS앱개발 입문기

목록 보기

12/17

이번에 만들어 볼 퀴즈앱에서는 문제가 주어지면 True or False 문제를 풀 수 있다. 질문과 답변을 2차원 배열 및 구조체 모두로 구현해 볼 것이다.

Storyboard의 레이블 및 버튼들을 소스코드로 연결해준다. (Ctrl + Drag & Drop) (IBOutlet)

    @IBOutlet weak var questionLabel: UILabel!
    @IBOutlet weak var ProgressBar: UIProgressView!
    @IBOutlet weak var trueButton: UIButton!
    @IBOutlet weak var falseButton: UIButton!

IBAction 추가해서 true 버튼 false 버튼 모두 연결하기

// 답을 입력했을 경우에 동작하는 함수이니까

    @IBAction func answerButtonPressed(_ sender: UIButton) {   
    }

질문을 담은 배열 만들고 오버라이드 함수 안에서 할당 및 문제번호 업데이트하기


import UIKit

class ViewController: UIViewController {
    
    
    
    @IBOutlet weak var questionLabel: UILabel!
    @IBOutlet weak var ProgressBar: UIProgressView!
    @IBOutlet weak var trueButton: UIButton!
    @IBOutlet weak var falseButton: UIButton!
    
    let quiz = [
        "Four + Two is equal to Six",
        "Five - Three is Greater than One",
        "Three + Eight is less than Ten"
    
    ]
    
    var questionNumber = 0 // 문제번호 초기화
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        updateUI() // updateUI()함수 호출
    }

    
    @IBAction func answerButtonPressed(_ sender: UIButton) {
    // 문제번호를 하나씩 늘려간다
        questionNumber += 1
        updateUI()
    }
    
    func updateUI() { // 문제번호를 업데이트 하는 함수
        questionLabel.text = quiz[questionNumber]
    }
}

여기까지 하면 두 가지 문제가 생긴다.
1. 문제를 맞춘 경우 잘 넘어가지만 틀린 경우 오류가 발생한다
2. 인덱스가 범위를 초과하여 에러가 발생한다.
이러한 문제를 다음과 같이 해결한다.

2차원 배열 이용 및 답 채점

문제와 답 2차원 배열로

  let quiz = [
          ["Four + Two is equal to Six","True"],
          ["Five - Three is Greater than One","True"],
          ["Three + Eight is less than Ten", "False"]
      ] // 2D Array

사용자의 답을 채점하기
사용자가 True 혹은 False 버튼을 눌렀을 때 답을 채점해야 하므로 answerButtonPressed 함수를 구현해야 한다.

    @IBAction func answerButtonPressed(_ sender: UIButton) {
        
        let userAnswer = sender.currentTitle
        // 사용자의 답에 currentTitle의 sender 값을 넣는다 (True, False)
        
        
        let actualAnswer = quiz[questionNumber][1] // 실제 답
        
        // 사용자가 입력한 답 채점
        if userAnswer == actualAnswer{ // 답이 맞으면 
            print("Right!")
        } else { // 틀린 경우 
            print("Wrong!")
        }
        
        // 문제번호를 하나씩 늘려간다
        if questionNumber + 1 < quiz.count {
        // out of range index 오류를 해결하기 위해 +1 해준 것 
            questionNumber += 1
            
        }
        updateUI()
    }

문제가 끝나지 않고 계속 반복되려면?
반복되어야 한다고 생각해서 계속 while true{ ... } 를 이용한 무한루프만 생각했는데 내 생각과는 다르게 실행 자체가 되지 않았다. 하지만 간단하게

        if questionNumber + 1 < quiz.count {
            questionNumber += 1
            
        } else {
            questionNumber = 0 
        }

: else 조건으로 문제를 모두 풀면 다시 인덱스를 0으로 설정해줌으로써 다시 돌아가는 방법이 있었다.

배열 대신 구조체 이용하기

file - new file - swift file 선택 - 이름 설정 (여기서는 Question) - Create 하게 되면 카테고리에 새로운 Question 메뉴가 생긴다.

구조체 생성하기

import Foundation

struct Question {
    let text: String
    let answer: String
    
    init(q: String, a: String){
      text = q
      answer = a
    }
}

ViewController로 돌아와서 2차원 배열 대신 struct으로 수정해본다.

    let quiz = [
        Question(q: "Four + Two is equal to Six", a: "True"),
        Question(q: "Five - Three is Greater than One", a: "True"),
        Question(q: "Three + Eight is less than Ten", a: "False")
    ]

IBAction 함수에서 사용되었던 배열도 구조체 property로 교체해보자.

    @IBAction func answerButtonPressed(_ sender: UIButton) {
        
        let userAnswer = sender.currentTitle 
        let actualAnswer =  quiz[questionNumber].answer 
        // 인덱스 대신 구조체 property를 사용함으로써 훨씬 보기가 편해졌다. 나는 답! 
        
        if userAnswer == actualAnswer{
            print("Right!")
        } else {
            print("Wrong!")
        }
        
        if questionNumber + 1 < quiz.count {
            questionNumber += 1
            
        } else {
            questionNumber = 0
        }
        updateUI()
    }
    
    func updateUI() { 
        questionLabel.text = quiz[questionNumber].text
	// 나는 문제! 
    }