The video wwdc21-10062 claimed that by using swiftUI developers can build an app with a detail panel (like the right sidebar in Xcode), but didn't say how to implement that.
I have tried to use HSplitView but failed.
My code is like:
var body: some View {
NavigationView {
Text("sidebar")
HSplitView {
Text("Primary View")
Text("Detail Panel")
}
}
}
Try this:
NavigationView {
Text("sidebar")
HSplitView {
Text("Primary View")
.frame(maxWidth: .infinity, maxHeight: .infinity)
.background(.blue)
Text("Detail Panel")
.frame(maxWidth: .infinity, maxHeight: .infinity)
.background(.red)
}
}
The background colors aren't even necessary. They just allow you to better visualize the bounds of each section of the HSplitView.
Thanks for your reply. By using your code, if user resize the app horizontally, the width of detail panel also changed, but I wish that only the primary view resizes with dragging but the width of the sidebar and the detail view remain the same (I think we need something like holdingPriority in NSSplitView ?)
NavigationView {
Text("sidebar")
HSplitView {
Text("Primary View")
.frame(maxWidth: .infinity, maxHeight: .infinity)
.background(.blue)
.layoutPriority(1)
Text("Detail Panel")
.frame(maxWidth: .infinity, maxHeight: .infinity)
.background(.red)
}
}
-
—
Don Nissen
Add a CommentRemove the HSplitView. This should give you three sections.