#023 Food Wordle
初次與延遲動畫打交道…
遊戲規則說明
- 猜出五個英文字母組成的食物相關單字
- 共有八次猜題機會
- 字母變綠色表示字母與位置皆正確、字母變黃色表示字母正確但位置不正確、字母變深灰色表示字母與位置皆錯誤
運用程式
- enum
- struct
- UIView.transition 翻字母卡牌動畫
- DispatchQueue.main.asyncAfter 延遲動畫
- UIAlertController Alert對話視窗
程式解說時間
首先建立問題庫Struct
將符合答案的單字變成Array<String>，接著創造隨機取題目的function
function 中隨機取出的字串要回傳出來，又因為使用者輸入進去的字母皆為大寫，因此對答案時也必須用大寫來比對，因此return randomWord.uppercaseed() 將回傳出來的單字字母皆變大寫
CheckResults Enum 定義所有會出現的字卡狀態
宣告color變數，因應字卡及鍵盤按鈕要隨著對出的答案狀況顯示不同顏色
宣告emoji變數，這是最後結果彈跳視窗出來時，要顯示的emoji
//宣告之後會用到儲存的array、題目與參數var inputLabelIndex = -1
var newQuestion = Question().newQuestion()
var guessWords = [String]()
var questionWords = [String]()
var emojiResults = [String]()
複雜的對答案part
flipCard(views: Array<UILabel>, num: Int)
一行有五張字卡，用for in迴圈跑這五張字卡，為了達到一張一張接續翻牌，而不是五張一起翻的動畫，使用DispatchQueue.main.asyncAfter()
為了達到這樣的動畫效果，在每次進入迴圈時，跑的時間是現在+0.5秒，但是deadline後面必須+Int64的型別才能計算，因此不能輸入0.5
宣告let delayTime = DispatchTimeInterval.nanoseconds(i % 5 * 100000000) 讓他跟前面的.now()可以做運算
成也延遲敗也延遲，這邊卡了超級久，因為想要邊翻牌邊對答案的緣故，但始終找不出為何append進去的東西外面會讀不到，後來向Peter求救，於是用playground模擬一下，從下圖可知，在DispatchQueue.main.asyncAfter()括弧內部的東西都會delay才出來，如果要讀取的地方沒有一起延後，就會讀不到東西，這次的程式裡只有最後要顯示emoji的時候會要讀取延遲傳出來的array，所以就在讀取前也讓他延遲，就可以同步了！！！
擷取function內對答案部分
//答案單字變questionWords array
for character in newQuestion {
questionWords.append(String(character))
}
//猜的單字變guessWords array
let character = views[i].text!
self.guessWords.append(character)
//字母分別對答案
if self.questionWords[i] == self.guessWords[i] {
//字卡背景顏色變換
views[i].backgroundColor = CheckResult.correct.color
//儲存emoji
self.emojiResults.append(CheckResult.correct.emoji)
//鍵盤背景顏色轉換
for j in 0..<self.keyBoardBtns.count {
let keyboardCharacter = self.keyBoardBtns[j].configuration?.title!
if keyboardCharacter == self.questionWords[i] {
self.keyBoardBtns[j].configuration?.baseBackgroundColor = CheckResult.correct.color
}
}
} else if self.newQuestion.contains(character) {
views[i].backgroundColor = CheckResult.wrongPlace.color
self.emojiResults.append(CheckResult.wrongPlace.emoji)
for j in 0..<self.keyBoardBtns.count {
let keyboardCharacter = self.keyBoardBtns[j].configuration?.title!
if keyboardCharacter == self.guessWords[i] {
self.keyBoardBtns[j].configuration?.baseBackgroundColor = CheckResult.wrongPlace.color
}
}
} else {
views[i].backgroundColor = CheckResult.wrong.color
self.emojiResults.append(CheckResult.wrong.emoji)
for j in 0..<self.keyBoardBtns.count {
let keyboardCharacter = self.keyBoardBtns[j].configuration?.title!
if keyboardCharacter == self.guessWords[i] {
self.keyBoardBtns[j].configuration?.baseBackgroundColor = CheckResult.wrong.color
}
}
}第一層先利用答案單字與輸入的單字各自轉換為array來比對字母，第二層看答案單字的字串（不是array）內有沒有包含輸入的單字字母，剩下的就是錯誤字母拉～
歡迎載載玩玩
參考
