三列布局的SwiftUI macOS工具栏图标对齐
在这个问题之后,我有一个稍微不同的问题。我正试图实现同样的目标,但第二列和第三列包含在视图中,而视图又添加在NavigationView中,第一列是侧边栏 代码示例三列布局的SwiftUI macOS工具栏图标对齐,macos,swiftui,toolbar,swiftui-navigationview,Macos,Swiftui,Toolbar,Swiftui Navigationview,在这个问题之后,我有一个稍微不同的问题。我正试图实现同样的目标,但第二列和第三列包含在视图中,而视图又添加在NavigationView中,第一列是侧边栏 代码示例 import SwiftUI @main struct ThreeColumnsAppApp: App { var body: some Scene { WindowGroup { ContentView() .frame(minWidth: 900,
import SwiftUI
@main
struct ThreeColumnsAppApp: App {
var body: some Scene {
WindowGroup {
ContentView()
.frame(minWidth: 900, maxWidth: .infinity, minHeight: 600, maxHeight: .infinity)
}
.windowStyle(DefaultWindowStyle())
.windowToolbarStyle(UnifiedWindowToolbarStyle(showsTitle: true))
}
}
struct ContentView: View {
var body: some View {
NavigationView {
Sidebar()
.toolbar { Button(action: {}, label: { Image(systemName: "sidebar.left") }) }
MainContentView()
}
.frame(maxWidth: .infinity, maxHeight: .infinity)
}
}
struct Sidebar: View {
var body: some View {
List {
Text("Menu 1")
Text("Menu 2")
Text("Menu 3")
Text("Menu 4")
}
.frame(minWidth: 250)
.listStyle(SidebarListStyle())
}
}
struct MainContentView: View {
var body: some View {
NavigationView {
ListItemView()
DetailView()
}
.navigationTitle("Items List")
.navigationSubtitle("5 items found")
}
}
struct ListItemView: View {
var body: some View {
List {
Text("List item 1")
Text("List item 2")
Text("List item 3")
Text("List item 4")
Text("List item 5")
}
.frame(minWidth: 250)
.listStyle(InsetListStyle())
.toolbar {
Button(action: {}, label: { Image(systemName: "arrow.up.arrow.down.square") })
}
}
}
struct DetailView: View {
var body: some View {
Text("Detail of list 1")
.frame(maxWidth: .infinity, maxHeight: .infinity)
.toolbar {
Button(action: {}, label: { Image(systemName: "plus") })
Button(action: {}, label: { Image(systemName: "minus") })
Button(action: {}, label: { Image(systemName: "pencil") })
}
}
}
输出
如下图所示,应位于第二列工具栏上的箭头图标将与详图视图的工具栏图标一起推到右侧。NavigationView似乎将ListItemView和DetailView工具栏视为一个单独的工具栏
所需输出
问题
所以,我的问题是如何使工具栏图标与其视图对齐