10

I'm trying to create a three column window with a sidebar and a splitview. Each of the left and right views in the split view should have a corresponding ToolbarItem that display in their respective toolbar/navigationtitle space.

For this purpose, I created a simple view that has a sidebar, left and right views. I created a ToolbarItem for left view and another ToolbarItem for right view. However, the ToolbarItem belonging to the right view shows in the left view's toolbar space. Is there a way to create ToolbarItem's specific to each of the views. Any help is greatly appreciated.

Below is the source code that I created. I've also attached a screenshot showing the issue. I'm using Xcode 12 beta and macOS Big Sur Beta.

Toolbar issue

import SwiftUI

struct ContentView: View {
    enum NavigationItem {
        case demo
    }
    @State private var selection: Set<NavigationItem> = [.demo]

    var body: some View {
        NavigationView {
                List(selection: $selection) {
                    Label("Demo", systemImage: "list.bullet")
                }
                .listStyle(SidebarListStyle())
                .frame(minWidth: 200, idealWidth: 250, maxWidth: 300, maxHeight: .infinity)

            Text("Left")
                .frame(maxWidth: 500, maxHeight: .infinity)
                .toolbar {
                    ToolbarItem {
                        Button(action: {}) {
                            Text("Left Toolbar")
                        }
                    }
                    ToolbarItem { Spacer() }
                }
                .presentedWindowToolbarStyle(ExpandedWindowToolbarStyle())

            Text("Right")
                .frame(maxWidth: .infinity, maxHeight: .infinity)
                .toolbar {
                    ToolbarItem {
                        Button(action: {}) {
                            Text("Right Toolbar")
                        }
                    }
                }
        }
    }
}
Felix Marianayagam
  • 2,634
  • 2
  • 9
  • 29
  • I reproduce your problem. I tested it with the latest Xcode version on an iMac and it works all fine. But if you want you can add an placement to your ToolbarItem like:ToolbarItem(placement: ToolbarItemPlacement.primaryAction) {} or something like this. – DoTryCatch Jan 16 '21 at 18:11
  • 1
    On 11.1, your code does not behave as pictured. https://imgur.com/a/9CNPBra The icons collapse with a temporary divider when in a narrow middle pane state. In a wide middle pane state, the buttons separate as you hope. – Ryan Jan 17 '21 at 03:50
  • I am seeing exactly what @Ryan is. – Yrb Jan 17 '21 at 20:49
  • I tested in BigSur 11.2 RC with Xcode 12.4 RC and I also see what @Ryan describes. Maybe the Beta version that you are using has some kind of bug that has resolved. – lorem ipsum Jan 22 '21 at 18:22
  • I tested in macOS Monterey 12.4 (21F79) and its exactly what @Ryan said. – Gavin Morrow Jul 08 '22 at 22:20

0 Answers0