CODEWITHSUNDEEP
swiftswiftui
ElKePoN
ElKePoN

Reputation: 930

Sidebar Menu for macOS in SwiftUI

I'm trying to implement a menu, so far this is what have:

enter image description here

NavigationView

struct macOS_NavigationView: View {
    
    @State private var selectedTab: HostingBarCategories = .Screen1
    
    var body: some View {

        NavigationView {
            // SideBar Menu
            List {
                ForEach(1 ... 10, id: \.self) { index in
                    NavigationLink(destination:
                                    Text("\(index)")
                                    .frame(maxWidth: .infinity, maxHeight: .infinity)
                    ) {
                        Text("Link \(index)")
                    }
                }
            }
            .listStyle(SidebarListStyle())
            
            // Primary View
            Text("Select a menu...")
                .frame(maxWidth: .infinity, maxHeight: .infinity)
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity)
    }
}

The part where I'm stuck is trying to implement my current model that I'm using for iOS in the TabBar:

HostingBarCategories

enum HostingBarCategories: Hashable {
    case Screen1
    case Screen2
    case Screen3
    case Screen4
    case Screen5
}

So how can I use that model so when a user clicks a menu it goes to that screen? (the model can be expanded, it doesn't have to be that one specifically)

Edit: Let me add the current iOS TabBar so it's more visually understandable, this is just for reference for the above and has nothing to do with the question:

struct iOS_TabBarView: View {
    
    @State private var selectedTab: HostingBarCategories = .Screen1
    
    var body: some View {
        TabView(selection: $selectedTab) {
            Text("1")
                .tag(0)
                .tabItem {
                    Image(systemName: "pencil.and.outline")
                    Text("1")
                }
            Text("2")
                .tag(1)
                .tabItem {
                    Image(systemName: "checkmark")
                    Text("2")
                }
            Text("3")
                .tag(2)
                .tabItem {
                    Image(systemName: "calendar.circle.fill")
                    Text("3")
                }
            Text("4")
                .tag(3)
                .tabItem {
                    Image(systemName: "flame")
                    Text("4")
                }
            Text("5")
                .tag(3)
                .tabItem {
                    Image(systemName: "slider.horizontal.3")
                    Text("5")
                }
        }
    }
}

Upvotes: 4

Views: 1396

Answers (1)

Asperi
Asperi

Reputation: 257543

You need to make your enum case-iterable to use it as model in ForEach, like

enum HostingBarCategories: Hashable, CaseIterable {
    case Screen1
    case Screen2
    case Screen3
    case Screen4
    case Screen5
    
    var string: String { String(describing: self) }
}

struct macOS_NavigationView: View {
    
    @State private var selectedTab: HostingBarCategories = .Screen1
    
    var body: some View {

        NavigationView {
            // SideBar Menu
            List {
                ForEach(HostingBarCategories.allCases, id: \.self) { screen in
                    NavigationLink(destination:
                                    Text(screen.string)
                                    .frame(maxWidth: .infinity, maxHeight: .infinity)
                    ) {
                        Text("Link \(screen.string)")
                    }
                }
            }
            .listStyle(SidebarListStyle())
            
            // Primary View
            Text("Select a menu...")
                .frame(maxWidth: .infinity, maxHeight: .infinity)
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity)
    }
}

Upvotes: 2

Related Questions