如何在 SwiftUI 中保存和恢复 HSplitview 位置

Question

我希望能够保存和恢复 SwiftUI splitView 的位置，但我无法\xe2\x80\x99t 弄清楚如何做到这一点。我还没有找到任何示例，并且文档中没有任何信息。我有以下内容：

\n\n

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

\n\n

有谁知道如何获取滑块的位置以便保存并在启动时恢复？\n谢谢！

\n

Answer 1

这是我一直在使用的解决方法。它使用简单HStack且可拖动的视图来重新创建内容HSplitView。draggableWidth您可以根据需要保存然后保存状态。

public struct SlideableDivider: View {
    @Binding var dimension: Double
    @State private var dimensionStart: Double?

    public init(dimension: Binding<Double>) {
        self._dimension = dimension
    }
    
    public var body: some View {
        Rectangle().background(Color.gray).frame(width: 2)
            .onHover { inside in
                if inside {
                    NSCursor.resizeLeftRight.push()
                } else {
                    NSCursor.pop()
                }
            }
            .gesture(drag)
    }
    
    var drag: some Gesture {
        DragGesture(minimumDistance: 10, coordinateSpace: CoordinateSpace.global)
            .onChanged { val in
                if dimensionStart == nil {
                    dimensionStart = dimension
                }
                let delta = val.location.x - val.startLocation.x
                dimension = dimensionStart! + Double(delta)
            }
            .onEnded { val in
                dimensionStart = nil
            }
    }
}
...
struct ContentView: View {
    @AppStorage("ContentView.draggableWidth") var draggableWidth: Double = 185.0
    var body: some View {
        // This will be like an HSplitView
        HStack(spacing: 0) {
            Text("Panel 1")
            .frame(width: CGFloat(draggableWidth))
            .frame(maxHeight: .infinity)
            .background(Color.blue.opacity(0.5))
            
            SlideableDivider(dimension: $draggableWidth)
            
            Text("Panel 2")
            .frame(maxWidth: .infinity, maxHeight: .infinity)
            .background(Color.red.opacity(0.5))
            
        }.frame(maxWidth: .infinity)
    }
}