CODEWITHSUNDEEP
swiftswiftuiuisplitviewcontrollersidebarios14
Hunter Meyer
Hunter Meyer

Reputation: 314

Using a SwiftUI List Sidebar in a UISplitViewController

I am attempting to build my app's navigation such that I have a UISplitViewController (triple column style) with my views built with SwiftUI. My Primary Sidebar is currently quite simple:

struct PrimarySidebarView: View {
    
    @EnvironmentObject var appModel: AppModel
    
    var body: some View {
        List(PrimarySidebarSelection.allCases, id: \.self, selection: $appModel.primarySidebarSelection) { selection in
            Text(selection.rawValue)
        }
        .listStyle(SidebarListStyle())
        .navigationBarItems(trailing: EditButton())
    }
}

where PrimarySidebarSelection is an enum. I am planning to access the same AppModel environment object in my other sidebar, allowing me to change what is displayed in the Supplementary Sidebar, depending on the Primary Selection. I am using the new SwiftUI App life-cycle, rather than an AppDelegate.

I would like to know how to change the style of selection from this to the typical sidebar selection style that is used in SwiftUI's NavigationView. According to SwiftUI's List Documentation the selection is only available when the list is in edit mode (and the selection shows the circle next to each item, which I do not want, instead I want the row to highlight like how it does in NavigationView when working with NavigationLinks).

Thanks in advance.

Upvotes: 1

Views: 480

Answers (1)

lorem ipsum
lorem ipsum

Reputation: 29242

enum PrimarySidebarSelection: String, CaseIterable {
    case a,b,c,d,e,f,g
}
struct SharedSelection: View {
    @StateObject var appModel: AppModel = AppModel()
    var body: some View {
        NavigationView{
            PrimarySidebarView().environmentObject(appModel)
            Text(appModel.primarySidebarSelection.rawValue)
        }
    }
}
class AppModel: ObservableObject {
    @Published var primarySidebarSelection: PrimarySidebarSelection = .a
}
struct PrimarySidebarView: View {
    
    @EnvironmentObject var appModel: AppModel
    
    var body: some View {
        List{
            ForEach(PrimarySidebarSelection.allCases, id: \.self) { selection in
                Button(action: {
                    appModel.primarySidebarSelection = selection
                }, label: {
                    HStack{
                        Spacer()
                        Text(selection.rawValue)
                            .foregroundColor(selection == appModel.primarySidebarSelection ? .red : .blue)
                        Spacer()
                    }
                }
                )
                .listRowBackground(selection == appModel.primarySidebarSelection ? Color(UIColor.tertiarySystemBackground) : Color(UIColor.secondarySystemBackground))
            }
            
        }
        .listStyle(SidebarListStyle())
        .navigationBarItems(trailing: EditButton())
        
    }
}

Upvotes: 1

Related Questions