#7 Final Game_You die Or I die Part 1

這次的主題想了很久～～因為想利用這次的機會做一個市面上沒有的遊戲。剛好之前看很多主播在玩對戰的小遊戲，所以創造了三個小關卡讓玩家進行對戰。

You die Or I die 是一款雙人對戰的小遊戲，目前有三個關卡，未來還會繼續開發，玩家必須層層通關贏過對手，是一款速度與眼力的考驗。搭配輕快且刺激的音樂，讓氣氛達到最高點

這次的東西有點多所以會分成兩個文章去寫：

Part 1主要介紹登入，註冊和房間連線。

Part 2 介紹3個小遊戲的功能，詳情請看以下連結

#8 Final Game_ You die Or I die Part 2

ㄧ、成果MP4

Youtube

二、Github link

GitHub - Pscabby/You_Die_Or_I_Die

三、iPhone截圖

以下都是在iPhone 14 Pro的畫面

1. 身份驗證

left: Sign up; right: Login in

2. 主選單

Menu

3. 選擇房間 (Join With Friends)

Waiting Room

4. 等待室

left: Player1 waiting right: 2 Player waiting

四、架構介紹

這次的登入和創建房間系統主要是使用FireBase 提供的身份認證

並使用MVVM架構讓設計主畫面更簡潔

Structure

Room data 存放每個房間的資料

struct rooms : Identifiable,Codable{
    @DocumentID var id:String?
    var player = [""]
    var gameState = ""
    var Player1Ok = false
    var Player2Ok = false
    var Player1Ready = false
    var Player2Ready = false
    var Player1Score = 0
    var Player2Score = 0
}

Player data 存放玩家資料

struct players : Identifiable, Codable{
    @DocumentID var id:String?
    var name = ""
    var currentRoom = ""
    var role = ""
    var isPlayer1 = true
    var mail = ""
    var joinedDate: Date = Date()
}

FireBase

五、功能介紹

1. 登入系統

登入過的使用者會將資訊存在本地端，下次開啟的時候就不用再登入一遍

— 成功 （跳轉到遊戲頁面）

Login Success GIF

— 失敗（左：無此信箱, 右：密碼錯誤）

Failure GIF

2. 註冊系統

— 成功 （跳轉到遊戲頁面）

Success GIF

— 失敗（左：信箱重複註冊, 右：其他錯誤）

Failure GIF

3. 網路連線錯誤

network Problem GIF

4. 創間房間和加入房間

使用者可以選擇要創建房間還是要加入房間

當兩個人都按下Ready後遊戲才會開始

在這裡你可以自由選擇遊戲角色和背景顏色

也可以查看敵人選擇的角色

Room Page

當玩家輸入錯誤的房號時，會顯示Alert要求重新輸入

六、結論與心得

這次在創建房間的地方花了一點時間，其中也有想過要把Room Code改成簡單的4個數字，但跟寫的架構會有點衝突，所以打算等有時間的時候再把它做得更完美。