問答題App — アニメクイズ

這次作業的題目，我是從20部不同的動畫裡出的，我出的都是基本題，超級簡單，只要你有看，一定秒回答！！！

icon是基德，截圖也是基德

接下來就附上gif～～

我寫的程式會從20題題庫中隨機抽選10題，四個選項的排序也是隨機排，然後答題結束之後，會以AlertController顯示得分，並且會出現再玩一次的按鈕

步驟：

1 想畫面＆找圖片＆排版

2 拉線

@IBOutlet：圖片、第幾題的label、題目內容、四個選項（選項是button喔）按鈕、再玩一次按鈕

@IBOutlet weak var image: UIImageView! //corresponding image
@IBOutlet weak var questionNumber: UILabel! //第幾題
@IBOutlet weak var Question: UILabel! //question
@IBOutlet var buttons: [UIButton]! //4 choices
@IBOutlet weak var Play_Again_Outlet: UIButton! //appear after game set

值得注意的是，因為選項有四個，我想把他們放在一起，所以選擇Outlet Collection，這樣他們就會用array的方式存起來，依照拉線的順序，index分別為0,1,2,3

@IBAction：四個選項、再玩一次按鈕

//action for 4 choices
@IBAction func choose(_ sender: UIButton)
@IBAction func playAgain(_ sender: Any)

3 建立題庫

我先建立一個struct，裡面有題目內容、選項、圖片、答案

struct QandA
{
var question:String
var choice:[String]=[]
var image:String
var answer:String
}

依照下列方式建立題庫，這是其中一題

//20 questions
var questions = [QandA(question:”請問殺老師的真實身份是？”,choice:[“初代死神”,”大魔王”,”魑魅魍魎”,”廚師”],image:”1.jpg”,answer:”你猜猜看～”),

4 設定初始值

//use for randomly choose questions
var number = [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19]
var question_count = 0 //count for question now
var score = 0
var right_answer = “” //which stores string type

number array是用來隨機選題的，透過裡面的數字連結到題庫內容

question_count是在算現在總共出幾題了

score是得分

right_answer是正確答案

5 建立出現問題的function — showQuestion()

這個function是這個作業的重點！！！

A. 每呼叫一次，總題數就要加一

B. 隨機選題

＊因為總共有20題，而我以array的形式儲存，因此此20題的編號為0~19

＊利用這一點，我建立一個儲存0~19的array，代表隨機選到的題目編號

＊為了不重複選到同一個數字（也就是同一題），選到這個數字之後，就要把它從array中移除，所以array的長度經過每次的隨機抽選，都會改變

＊因此，隨機選數的範圍從0選到array長度-1，這不是代表題目編號，而是代表array中剩餘element的index，此index儲存的element才是題目編號

let random_number = Int(arc4random_uniform(UInt32(number.count)))

＊所以需要另一個變數來儲存此index的element，也就是題目編號

let value = number[random_number]

＊設定此題的圖片、題數、題目、答案

image.image = UIImage(named: questions[value].image)
questionNumber.text = “第\(question_count)題”
Question.text = questions[value].question
right_answer = questions[value].answer

＊移除此數

number.remove(at: random_number)

C. 隨機排序選項

＊方法與隨機選題一樣，先建立一個代表選項編號的array，從上到下四個選項的編號為0,1,2,3

var choice_index = [0,1,2,3]

＊用for loop跑四個選項，範圍從0~選項數-1，此處跑的數字會用在儲存選項的array的index（因為我的四個選項是存成array），最後移除掉

for i in 0..<buttons.count
{
let random_number_for_choice_index = Int(arc4random_uniform(UInt32(choice_index.count)))
let choice_value = choice_index[random_number_for_choice_index]
buttons[i].setTitle(questions[value].choice[choice_value], for: .normal)
choice_index.remove(at: random_number_for_choice_index)
}

6 建立選項按鈕（4個都一樣）

此處有兩個判斷

＊如果選對了，就加十分

if sender.currentTitle == right_answer
{
score = score + 10
}

＊如果題數已達到10題，就顯示得分及再玩一次按鈕（一開始我設為Hidden），未達10題則繼續顯示題目

if question_count == 10
{
show_alertController()
//show out play_again button
Play_Again_Outlet.isHidden = false
}
else
{
//continue showing question
showQuestion()
}

得分部分我用AlertController顯示

7 建立AlertController function — show_alertController()

func show_alertController()
{
//make an alertController
let alertController = UIAlertController(
title: “測驗結束”,
message: “得分為\(score)分(滿分100)”,
preferredStyle: .alert)
//make[確認]button
let okAction = UIAlertAction(
title: “確認”,
style: .default,
handler:{
(action: UIAlertAction!) -> Void in
})
alertController.addAction(okAction)
//show the alertController
self.present(alertController, animated: true, completion: nil)
}

8 建立再玩一次按鈕

首先先將用到的變數恢復成初始值，再開始顯示題目，並且再玩一次按鈕要再度隱藏

@IBAction func playAgain(_ sender: Any)
{
initialize()
showQuestion()
//hide the play_again button
Play_Again_Outlet.isHidden = true
}

9 初始化function — initialize()

將number array恢復0~19的內容，題數及得分設為0

func initialize()
{
number = [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19]
question_count = 0
score = 0
}

Github:

lindarunesugar/Anime_Quiz