SwiftUI修改自定义滑块值时矩形颜色未同步更新

两个核心问题导致颜色无法同步更新：

• 取值范围不匹配：SwiftUI 的 Color(red:green:blue:opacity:) 要求RGB通道传入值必须在 0.0~1.0 区间，超出的值会被系统强制钳位到0或1。你给自定义滑块设置的取值范围是(0,100)，拖动时redValue很快就会超过1，红通道直接锁死在最大值，后续数值再涨颜色也不会变化。系统原生Slider默认范围就是0~1，刚好匹配颜色参数要求，所以能正常运行。
• 坐标计算错误：你之前用全局坐标空间（.global）计算拖动位置，但没有减去滑块轨道在全局坐标下的起始x偏移，导致滑块只拖动很小一段距离，计算出的value就已经超过1，大半截拖动行程里颜色都不会有变化，看起来就像不同步。

1. 改用局部坐标空间计算拖动位置，从根源上避免全局坐标偏移带来的计算错误，不需要手动算minX，适配性更好
2. 要么把自定义滑块的取值范围改成0_{1直接匹配Color的参数要求，要么保留0}100范围（方便滑块上显示整数），在传值给Color时除以100映射回0~1区间即可。

修复后的核心代码：
首先是自定义滑块的位置计算逻辑：

private func view(geometry: GeometryProxy) -> some View {
    // 改用局部坐标空间
    let frame = geometry.frame(in: .local)
    // 拖拽手势也指定使用局部坐标空间
    let drag = DragGesture(minimumDistance: 0, coordinateSpace: .local)
        .onChanged { drag in
            self.onDragChange(drag, frame)
        }

    let offsetX = self.getOffsetX(frame: frame)
    let knobSize = CGSize(width: knobWidth ?? frame.height, height: frame.height)
    let barLeftSize = CGSize(width: CGFloat(offsetX + knobSize.width * 0.5), height:  frame.height)
    let barRightSize = CGSize(width: frame.width - barLeftSize.width, height: frame.height)

    let modifiers = CustomSliderComponents(
        barLeft: CustomSliderModifier(name: .barLeft, size: barLeftSize, offset: 0),
        barRight: CustomSliderModifier(name: .barRight, size: barRightSize, offset: barLeftSize.width),
        knob: CustomSliderModifier(name: .knob, size: knobSize, offset: offsetX))

    return ZStack { viewBuilder(modifiers).gesture(drag) }
}

private func onDragChange(_ drag: DragGesture.Value,_ frame: CGRect) {
    let width = (knob: Double(knobWidth ?? frame.size.height), view: Double(frame.size.width))
    let xrange = (min: Double(0), max: Double(width.view - width.knob))
    // 局部坐标下直接取触摸点x值即可，不用拼接startLocation和translation
    var value = Double(drag.location.x)
    value -= 0.5*width.knob
    // 钳位到滑块轨道的有效滑动范围
    value = min(max(value, xrange.min), xrange.max)
    value = value.convert(fromRange: (xrange.min, xrange.max), toRange: range)
    self.value = value
}

如果你要保留滑块0_{100的取值范围（适配滑块上显示整数的逻辑），只需要修改Rectangle的颜色赋值逻辑，把数值映射回0}1区间：

Rectangle()
    .foregroundColor(Color(red: redValue/100, green: greenValue, blue: blueValue, opacity: 1.0))
    .cornerRadius(10)

如果不需要显示0~100的整数，直接把CSlider初始化时传入的range改成(0,1)，颜色部分不用做除法即可正常工作。

内容的提问来源于stack exchange，提问作者Thomas Braun