SwiftUI：使用自定义滑块时防止视图消失的正确逻辑语句是什么

Question

当我使用定制滑块时，我的 SwiftUI 视图消失了。我相信这是因为 Views 的框架值正在变得消极；但是，我觉得我已经正确地编写了逻辑代码以防止这种情况发生（但是出了点问题）。

我尝试了几种不同的 if 语句来防止值变为负值，但我没有成功。

import SwiftUI

struct ContentView: View {

@State var scale: CGFloat = 1.0
@State private var dragged = CGSize.zero
@State private var accumulated = CGSize.zero

var body: some View {
    ZStack {
        Rectangle()
            .stroke()
            .frame(width: 300, height: 5, alignment: .leading)
            .position(x: 180, y: 30)
        Rectangle()
            .frame(width: 0 + dragged.width, height: 5, alignment: .leading)
            .position(x: 30 + (0.5 * dragged.width), y: 30)
        Circle()
            .foregroundColor(.red)
            .frame(width: 20, height: 20).border(Color.red)
            .position(x: 30, y: 30)
            .offset(x: self.dragged.width)
            .gesture(DragGesture()
                .onChanged{ value in

//My IF-Statement
                    if value.translation.width > 0 {
                        self.dragged = CGSize(
                            width: value.translation.width + self.accumulated.width,
                            height: value.translation.height + self.accumulated.height
                        )
                    }
            }
            .onEnded{ value in
                self.dragged = CGSize(
                    width: value.translation.width + self.accumulated.width,
                    height: value.translation.height + self.accumulated.height)
                self.accumulated = self.dragged
                }
        )
        VStack{
            Text("\(dragged.width)")
            Text("\(30 + (0.5 * dragged.width))")
        }
    }
  }
}

当我快速将红色圆圈向左滑动太远时出现错误。我希望 IF 语句在使变量变为负值之前停止圆圈（如果我对使它消失的原因的假设是正确的）。

Answer 1

限制在右边

您不需要 if 语句，而是 width 可以达到的最大值。一种方法是使用 min(maxValue, calculated) 强制 width 不超过 maxValue.

向左限制

您的拖动从红点开始，但拖动不限于您绘制的比例，但您可以向左拖动，因为屏幕一直延伸到屏幕边缘，这使得向左的拖动变为负数.

为了避免这种情况，您可以检查结果是否为负数，如果是，只需使用 0 而不是负值，如下所示。

import SwiftUI

struct SliderView: View {

    @State var scale: CGFloat = 1.0
    @State private var dragged = CGSize.zero
    @State private var accumulated = CGSize.zero

    let maxWidth: CGFloat = 300

    var body: some View {
        ZStack {
            Rectangle()
                .stroke()
                .frame(width: maxWidth, height: 5, alignment: .leading)
                .position(x: 180, y: 30)
            Rectangle()
                .frame(width: 0 + dragged.width, height: 5, alignment: .leading)
                .position(x: 30 + (0.5 * dragged.width), y: 30)
            Circle()
                .foregroundColor(.red)
                .frame(width: 20, height: 20).border(Color.red)
                .position(x: 30, y: 30)
                .offset(x: self.dragged.width)
                .gesture(DragGesture()
                    .onChanged{ value in
                        print("on changed called. width: \(value.translation.width)")

                        self.dragged = CGSize(
                            width: value.translation.width + self.accumulated.width > 0 ?
                                min(self.maxWidth, value.translation.width + self.accumulated.width) : 0,
                            height: value.translation.height + self.accumulated.height
                        )
                }
                .onEnded{ value in
                    self.dragged = CGSize(
                        width: value.translation.width + self.accumulated.width > 0 ?
                            min(self.maxWidth, value.translation.width + self.accumulated.width) : 0,
                        height: value.translation.height + self.accumulated.height)
                    self.accumulated = self.dragged
                    }
            )
            VStack{
                Text("\(dragged.width)")
                Text("\(30 + (0.5 * dragged.width))")
            }
        }
    }
}

SwiftUI：使用自定义滑块时防止视图消失的正确逻辑语句是什么

SwiftUI: What is the Proper Logic Statement to Prevent Views From Disappearing While Using a Custom Slider

swiftui

限制在右边

向左限制