article

Wednesday, May 26, 2021

SwiftUI Splash Screen tap start button goto HomepageView

SwiftUI Splash Screen tap start button goto HomepageView
 
//
//  ContentView.swift
//  Devapp
//
//  Created by Cairocoders
//

import SwiftUI

struct ContentView: View {
    
    @State private var isOnboardinDone: Bool = false

    var body: some View {
        
        if isOnboardinDone {
            Homepage()
        } else if !isOnboardinDone {
            OnboardingView(done: $isOnboardinDone)
        } else {
            Homepage()
        }
       
    }

}

struct details_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

struct Homepage: View {
    
    var body: some View {
        NavigationView {
            List {
                Text("Episode IV – A New Hope")
                Text("Episode V – The Empire Strikes Back")
                Text("Episode VI – Return of the Jedi")
            }
            .navigationTitle("Home")
        }
    }
}


struct OnboardingView: View {
    
    @Binding var done: Bool

    var body: some View {
        ScrollView {
            VStack(alignment: .center) {

                Spacer()

                TitleView()

                InformationContainerView()

                Spacer(minLength: 30)
                
                Button(action: { done.toggle() }, label: {
                    Text("Start")
                        .customButton()
                })
                .padding(.horizontal)
                
            }
        }
    }
}

struct InformationDetailView: View {
    var title: String = "title"
    var subTitle: String = "subTitle"
    var imageName: String = ""

    var body: some View {
        HStack(alignment: .center) {
            Image(systemName: imageName)
                .font(.largeTitle)
                .foregroundColor(.mainColor)
                .padding()
                .accessibility(hidden: true)

            VStack(alignment: .leading) {
                Text(title)
                    .font(.headline)
                    .foregroundColor(.primary)
                    .accessibility(addTraits: .isHeader)

                Text(subTitle)
                    .font(.body)
                    .foregroundColor(.secondary)
                    .fixedSize(horizontal: false, vertical: true)
            }
        }
        .padding(.top)
    }
}

struct InformationContainerView: View {
    var body: some View {
        VStack(alignment: .leading) {
            InformationDetailView(title: "Splash Screen", subTitle: "Onboarding screen is shown (OnboardingView)", imageName: "desktopcomputer")

            InformationDetailView(title: "Start Button", subTitle: "By tapping Start Button Go to home page (HomeView)", imageName: "forward.frame.fill")

            InformationDetailView(title: "Start App", subTitle: "Splash Screen Start the application", imageName: "iphone")
        }
        .padding(.horizontal)
    }
}

struct TitleView: View {
    var body: some View {
        VStack {
            Image("pic1")
                .resizable()
                .aspectRatio(contentMode: .fit)
                .frame(width: 180, alignment: .center)
                .accessibility(hidden: true)

            Text("Welcome")
                .customTitleText()

            Text("Take Some time out")
                .customTitleText()
                .foregroundColor(.mainColor)
        }
    }
}

struct ButtonModifier: ViewModifier {
    func body(content: Content) -> some View {
        content
            .foregroundColor(.white)
            .font(.headline)
            .padding()
            .frame(minWidth: 0, maxWidth: .infinity, alignment: .center)
            .background(RoundedRectangle(cornerRadius: 15, style: .continuous)
                .fill(Color.mainColor))
            .padding(.bottom)
    }
}

extension View {
    func customButton() -> ModifiedContent<Self, ButtonModifier> {
        return modifier(ButtonModifier())
    }
}

extension Text {
    func customTitleText() -> Text {
        self
            .fontWeight(.black)
            .font(.system(size: 36))
    }
}

extension Color {
    static var mainColor = Color(UIColor.systemGreen)
}

Related Post