在swiftUI中使用2个HSplitViews创建3窗格界面 [英] Creating a 3 pane Interface in swiftUI using 2 HSplitViews

问题描述

这是针对MacOS的.我正在尝试制作一个相当标准的3窗格界面，就像您在Xcode和其他应用程序中看到的那样，其中调整窗口大小时，中心视图具有优先权.这两个侧视图是可调整大小的，但是在调整窗口大小时应保持相同的大小.我有下面的示例，它可以满足我的要求，但是在调整窗口大小时会出现奇怪的调整大小伪像，但是只有当我缩小窗口时才可以(实际上只有在缩小窗口时才可以):

This is for MacOS. I am trying to make a fairly standard 3 pane interface much like you see in Xcode and other apps where the centre view has priority when resizing the window. The two side views are resizable but should stay the same size when the window is resized. I have the following example which does what I want but there is a weird resizing artefact when I resize the window, but ONLY when I make the window smaller ( actually only when it is made narrower ):

struct ContentView: View {
   var body: some View {
      GeometryReader{geometry in
         HSplitView(){
            Rectangle().foregroundColor(.red).frame(minWidth:200, idealWidth: 200, maxWidth: .infinity)//.layoutPriority(0)
            HSplitView(){
                Rectangle().foregroundColor(.black).frame(minWidth:200, idealWidth: geometry.size.width, maxWidth: .infinity).layoutPriority(1)
                Rectangle().foregroundColor(.green).frame(minWidth:200, idealWidth: 200, maxWidth: .infinity)
            }
         }.frame(width: geometry.size.width, height: geometry.size.height)
      }
   }
}

当使窗口变窄时，左侧红色矩形似乎优先于中心矩形，这导致闪烁，因为红色矩形在两个宽度之间翻转.我已经用layoutPriority和其他一些东西尝试了各种方法，但是问题仍然存在.任何帮助，将不胜感激.

When making the window narrower, the left side red rectangle seems to take priority over the centre rectangle causing a flicker as the red rectangle flips between two widths. I have tried various things with layoutPriority and a few other things but the problem persists. Any help with this would be much appreciated.

推荐答案

好吧，我会的.经过数周的艰苦努力之后，一个小时后，我问了一个问题，我似乎已经解决了！只需将第二个HSplitView的layoutPriority设置为1，并将中心视图也设置为1.当您考虑时很有意义:

Well, I'll be. After struggling with this on and off for weeks, an hour after I asked the question I have appeared to solve it! Simply set the layoutPriority of the second HSplitView to 1 and the centre view to 1 as well. Makes sense when you think about it:

struct ContentView: View {
   var body: some View {
      GeometryReader{geometry in
         HSplitView(){
            Rectangle().foregroundColor(.red).frame(minWidth:200, idealWidth: 200, maxWidth: .infinity)
            HSplitView(){
                Rectangle().foregroundColor(.black).layoutPriority(1)
                Rectangle().foregroundColor(.green).frame(minWidth:200, idealWidth: 200, maxWidth: .infinity)
            }.layoutPriority(1)
         }.frame(width: geometry.size.width, height: geometry.size.height)
      }
   }
}

那么简单.爱SwiftUI！

So simple. Loving SwiftUI!

这篇关于在swiftUI中使用2个HSplitViews创建3窗格界面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！