Question

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

我尝试了几种不同的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的方法。

限制在左侧

您的拖动从红点开始，但是拖动并不限于您绘制的比例，而是您宁可向其左侧拖动，因为屏幕一直持续到屏幕边缘，这使得向左的拖动变为负数。 / p>

要避免出现这种情况，您可以检查结果是否为负，如果是，则使用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：什么是防止使用自定义滑块时视图消失的正确逻辑语句

1 个答案:

限制在右侧

限制在左侧