An iOS game develop with SwiftUI & Firebase in MVVM with so many excellent features

by iOS Example

Quoridor iOS Game

An iOS game develop with SwiftUI & Firebase in MVVM with so many excellent features！UI refer to STARLUX、Pokémon GO and Instagram. User could login with many social media accounts and play Quoridor with others on Internet.

Overview

Authentication

Sign In／Sign Up

  • User should choose「RETURING PLAYER」or「NEW PLAYER」first
    • If user choose RETURING PLAYER will display「Sign in」and show「Forgot your password？」button
    • If user choose NEW PLAYER will display「Sign up」and hide「Forgot your password？」button
  • We provide 4 Sign-in method：
    • Facebook、Google、Twitter：「Sign In」and「Sign Up」are using the same function
    • Email／Password：
      • If user has finished typing email, he/she could click「Enter」on the keyboard to switch @FocusState to password rather than touch the password field on screen
      • If user has finished typing password, he/she could click「Enter」on the keyboard to process「Sign In」or「Sign Up」rather than click the button on screen

Demo GIF on iPhone 13 Pro Max：This may need some time to load.

Forgot Password & Reset

  • 「Forgot your password？」button will show only if user is a「RETURING PLAYER」
  • We’ll send a reset password email to what email account user input
  • User could follow the link in email to reset their password

Change Password

  • Only if user had linked an email account to Quoridor could see security section and change their password in settings because sign in with Facebook, Google or Twitter doesn’t need to use password
  • Because we couldn’t access user’s password through Firebase to check the current password that user inputed is correct, I save user’s password in @AppStorage when they login or link using「Email／Password」successfully
  • Because changing password is a security-sensitive action, Firebase need user to have signed in recently. If user had login for a while, we’ll show error to tell user to relogin and try again
  • While SecureField is focused, the prompt will become smaller and move up, the clear button will appear on right
  • While SecureField is not focused, but it has value, the prompt will not back to down, the clear button will disappear
  • The third SecureField‘s prompt,「New password, again」, will determine whether the second and third SecureField‘s values are the same, if not, it will display red alert message instead
  • Only if all three SecureField have value and two new passwords are match could click the「SAVE」button on top right to change password
  • Using @FocusState and onSubmit to let user could change focus to the next SecureField easily by clicking「Enter」on the keyboard
  • Click on the blank below will cancel any @FocusState on SecureField

Link Multiple Auth Providers

User could connect their social medias’ account to a sigle Quoridor account. This let user could sign in through multiple methods！

User could also disconnect account that have connected to Quoridor, but must remain at least one sign in method.

Delete Account

Users could delete their Quoridor account if they want. We’ll delete their data on Firestore, Firestorage and Firebase Authentication.

Player’s Profile

If user sign up with Facebook, Google or Twitter, we’ll use their name and photo to initialize thier profile. User could edit their info, remove photo and create their avatar later.

Game

Game Reward

User can get random money from $1 to $200 every 4 games.

Game Type：Rank、Casual

User could create a rank room or casual room, but rank room need to cost $200, and casual room for free. Other players could also use room id to join. We use different color to separate rank and casual.

Start the Game！

If there are already 2 players in a room, only room owner could start the game but need the other player to click “Ready to Play”. And if there are only 1 player in a room, user could also click the “Start the Game”, we’ll match player for user.

Playing Quoridor！

  • Each turn player could build wall or move chessman.
  • Every player only have 10 wall to build.
  • We’ll show available position that chessman could move.
  • Players only have 40 seconds each turn, if player doesn’t do anything, next turn player will only have 8 seconds.
  • If player do nothing 5 turns will lose this game.
  • Player could give up the game any time.

Google AdMod：Watch Video to get money $200！

Every day player could watch video one time to get $200！

Leader Board

Could sort by：Star、Win Rate、Money

License：MIT

This repository is MIT licensed.

GitHub

View Github