SwiftUI 如何给 Slider 一个最小值和最大值并在文本中显示其值？

Question

import SwiftUI

struct ContentView : View {
    var body: some View {
        PasswordGeneratorSettings(settingsConfiguration: PasswordGeneratorSettings.Settings.init(passwordLength: 20))
    }
}


struct PasswordGeneratorSettings : View {
    @State var settingsConfiguration: Settings
    struct Settings {
        var passwordLength = UInt()
    }
    var body: some View {
        NavigationView {
            List {
                Slider(value: $settingsConfiguration.passwordLength) { pressed in
                    Text("Password Length: \(settingsConfiguration.passwordLength)")
                }
                }.navigationBarTitle(Text("Settings"))
        }
    }
}

所以我正在制作一个密码生成器，我想从 slider 开始，最小长度为 1，最大长度为 512，label 显示它的值（作为整数），但这就是我所要做的表格视图（列表）左侧的更新 label 与右侧的 slider 但这甚至无法编译。

太久没有阅读：我正在尝试：

1. 弄清楚如何使用 Slider 设置最小值和最大值

2. 在表格视图单元格的左侧有一个 label 和滑块的值（作为整数），在右侧有 slider。

我想在没有 UIKit 的情况下完成所有这些，只需 SwiftUI （如果需要，还可以合并）。

Answer 1

这是您使用滑块的方式：

import SwiftUI

struct ContentView : View {
    @State var length: Float = 20

    var body: some View {
        NavigationView {
            List {
                PasswordGeneratorSettings(length: $length)
            }.navigationBarTitle(Text("Settings"))
        }
    }
}


struct PasswordGeneratorSettings : View {
    @Binding var length: Float

    var body: some View {

        VStack(alignment: .leading) {
            Slider(value: $length, in: 1...512, step: 1)

            Text("Password Length: \(Int(length))")

        }
    }
}

Answer 2

您的代码无法编译，因为您需要在滑块值参数中使用 double。 您可以使用以下代码实现您的要求。 Slider 取三个参数值，from 和 through。 用简单的语言来说，from 是 minValue，through 是 maxValue，并且在任何给定时间“value”都将返回滑块中的当前值。

struct PasswordGeneratorSettings : View {
    @State var settingsConfiguration: Settings
    struct Settings {
        var passwordLength: Double = 1.0
    }
    var body: some View {
        NavigationView {
            List {
                HStack {
                    Text("Password Length: \(Int(settingsConfiguration.passwordLength))")
                    Slider(value: $settingsConfiguration.passwordLength, from: 1, through: 512)
                }
                .padding()
            }.navigationBarTitle(Text("Settings"))
        }
    }
}

Answer 3

struct BoundsSlider : View {
    let min: CGFloat
    let max: CGFloat
    
    @Binding var value: CGFloat
    @State var lastValue: CGFloat
    
    init (min: CGFloat, max: CGFloat, value: Binding<CGFloat>) {
        self.min = min
        self.max = max
        _value = value
        _lastValue = State(initialValue: value.wrappedValue)
    }
    
    var body: some View {
        Slider(value: Binding.init(get: { () -> CGFloat in return value },
                                   set: { (newValue) in if true { value = newValue; lastValue = newValue } }), in: min...max)
    }
}

用法：

BoundsSlider(min: 0.7, max: 5, value: $speed)