New SwiftUI: How to create a Trip Advisor Splash Screen Animation using Xcode 14

Photo by Annie Spratt on Unsplash

Hello everyone, welcome to a new SwiftUI tutorial. I hope you are all doing well. Today I am going to show you how to design a Trip Advisor splash screen animation in SwiftUI 4 and Xcode 14.

Let’s get started with opening up Xcode 14. Before we get started on the code we are going to add some assets for our app and splash screen!

Assets

Here is the Hex for the background color we are going to be using.

Let’s create a new SwiftUI file called SplashScreen.

import SwiftUI
struct SplashScreen: View {
 @State var animationValues: [Bool] = Array(repeating: false,  count: 10)
  var body: some View {
     ZStack {
      GeometryReader { proxy in
         let size = proxy.size
         HomeView()
        .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .center)
        .offset(y: animationValues[6] ? 0 : (size.height + 50))