NEW: Learn to build the incredible iOS 15 Weather app today! >>

How can I make each button go to a separate page in Swift UI

Forums > SwiftUI

How can I do that? I have built a side menu and want each thing to go to a seperate page(settings to settings... etc) How can I do this?

//HOME PAGE

import SwiftUI

struct Home: View {

    @State private var isShowing: Bool = false
    var body: some View {
        NavigationView{
            ZStack {
                if isShowing {
                    SideView(isShowing: $isShowing)
                }
                HomeView()
                    .cornerRadius(isShowing ? 20:10)
                    .offset(x: isShowing ? 300.0 : 0, y: isShowing ? 44:0)
                    .scaleEffect(isShowing ? 0.8 : 1.0)
                    .navigationBarItems(leading: Button(action: {
                        withAnimation(.spring()) {
                            isShowing.toggle()
                        }
                    }, label: {
                        Image(systemName: "list.bullet")
                            .foregroundColor(Color.primary)
                    }))
                    .navigationTitle("Welcome To Sai Mirras!")
            }

        }
    }
}

struct Home_Previews: PreviewProvider {
    static var previews: some View {
        Home()

    }
}

struct HomeView: View {
    var body: some View {
        ZStack {
            Color(.white)

            Text("Hi")
                .padding()
        }

    }
}

And this is my header view:

import SwiftUI

struct SideMenuHeaderView: View {

    @Binding var isShowing: Bool

    var body: some View {
        ZStack(alignment: .topTrailing) {

            Button(action: {
                withAnimation(.spring()) {
                    isShowing.toggle()
                }
            }, label: {
                Image(systemName: "xmark")
            })
            .frame(width: 32, height: 32)
            .foregroundColor(Color.white)
            .padding()

            VStack(alignment: .leading){
                Image("1")
                    .resizable()
                    .scaledToFill()
                    .clipped()
                    .frame(width: 64, height: 64)
                    .clipShape(Circle())
                    .padding(.bottom, 16)
                Text("Harrinandhaan SN")
                    .font(.system(size: 24, weight: .semibold))

                Text("Customer Since January 2021")
                    .font(.system(size: 14))
                    .padding(.bottom, 24)

                HStack(spacing: 12){
                    HStack(spacing: 4){
                        Text("Titanium").bold()
                        Text("Member")
                    }
                    HStack(spacing: 4){
                        Text("1,200").bold()
                        Text("Points")

                    }
                    Spacer()
                }
                Spacer()

            } .padding()
        }
    }
}

struct SideMenuHeaderView_Previews: PreviewProvider {
    static var previews: some View {
        SideMenuHeaderView(isShowing: .constant(true))
    }
}

This is my options view:

import SwiftUI

struct SideViewOptionView: View {

    let viewModel: SideMenuViewModel

    var body: some View {
        HStack(spacing: 16){
            Image(systemName: viewModel.imageName)
                .frame(width: 24, height: 24)

            Text(viewModel.title)
            .font(.system(size: 15, weight: .semibold))

            Spacer()
        }
        .padding()
        .foregroundColor(Color.white)
    }
}

struct SideViewOptionView_Previews: PreviewProvider {
    static var previews: some View {
        SideViewOptionView(viewModel: .home)
    }
}

This is my data model:

import Foundation

enum SideMenuViewModel: Int, CaseIterable {
    case home
    case menu
    case cart
    case membership
    case table
    case settings
    case profile

    var title: String {
        switch self {
                case .home: return "Home"
                case .menu: return "Menu"
                case .cart: return "Cart"
                case .membership: return "Membership"
                case .table: return "Book A Table"
                case .settings: return "Settings"
                case .profile: return "Profile"
        }
    }
    var imageName: String{
        switch self {
                case .home: return "house"
                case .menu: return "list.dash"
                case .cart: return "cart.fill"
                case .membership: return "diamond.fill"
                case .table: return "bookmark.fill"
                case .settings: return "gear"
                case .profile: return "person.fill"
        }
    }
}

And this is the menu view:

import SwiftUI

struct SideView: View {

    @Binding var isShowing: Bool

    var body: some View {
        ZStack {
            LinearGradient(gradient: Gradient(colors: [Color.blue, Color.purple]), startPoint: .top, endPoint: .bottom)
                .ignoresSafeArea()

            VStack{
                SideMenuHeaderView(isShowing: $isShowing)
                .foregroundColor(Color.white)
                .frame(height: 240)

                ForEach(SideMenuViewModel.allCases, id: \.self){ option in
                    SideViewOptionView(viewModel: option)

                            }
                Spacer()
        }
        }.navigationBarHidden(true)
}
}

struct SideView_Previews: PreviewProvider {
    static var previews: some View {
        SideView(isShowing: .constant(true))
    }
}

Please help!

   

Lots of code there, but I think yourr answere lies in using NavigationLinks.

NavigationLink(destination: SomeOtherView()) {
    Text("Go To Other View")
        .font(.headline)
        .foregroundColor(.blue)
    Image(systemName: "plus")
        .font(.headline)
        .foregroundColor(.blue)
}

That's the beauty of the NavigationView.

   

Hacking with Swift is sponsored by Sentry

SPONSORED With Sentry’s error and performance monitoring for iOS, you see mobile vitals that actually matter, can solve any latency issues quickly, and learn how each release is performing over time.

Learn More

Sponsor Hacking with Swift and reach the world's largest Swift community!

Reply to this topic…

You need to create an account or log in to reply.

All interactions here are governed by our code of conduct.

 
Unknown user

You are not logged in

Log in or create account
 

Link copied to your pasteboard.