SwiftUI

Question

我是编程和 SwiftUI 的新手，我正在努力解决这个问题：

我创建了一个简单的滑块：

Slider(value: $sliderValue, in: 0...100, step: 1)
            .padding(8)
            .overlay(
                Capsule()
                    .stroke(Color.purple, style: StrokeStyle(lineWidth: 5))
        )

我可以在 TextView 中显示值：

Text("\(sliderValue)")

现在我要做的是创建另一个 TextView，它通过简单的计算显示 Slider Value。我当然可以在 TextView 中多重播放 sliderValue - 效果很好。

Text("\(sliderValue * 10)")

但是有没有办法将其放入另一个函数中以更加灵活，尤其是在计算变得更加复杂的情况下？拖动滑块时它应该仍然实时更新。

这是经过美化处理的完整代码。也许你可以向我解释一下这在 SwiftUI 中是如何工作的？

struct ContentView: View {

    @State private var sliderValue: Double = 0

    var body: some View {
        VStack(alignment: .leading) {
            VStack(alignment: .leading) {
                Text("value".uppercased())
                    .font(.largeTitle)
                    .fontWeight(.bold)
                Text("\(sliderValue)")
                    .font(.system(size: 60, weight: .bold))
                Text("new value".uppercased())
                    .font(.largeTitle)
                    .fontWeight(.bold)
                Text("\(sliderValue * 10)") // I'd like to put this into a function somehow!?
                    .font(.system(size: 60, weight: .bold))
            }


            Slider(value: $sliderValue, in: 0...100, step: 1)
                .padding(8)
                .overlay(
                    Capsule()
                        .stroke(Color.purple, style: StrokeStyle(lineWidth: 5))
            )


        }//END: VSTACK
        .padding()
    }
}

感谢您的帮助！

Answer 1

这是可能的方法

struct ContentView: View {

    @State private var sliderValue: Double = 0

    var body: some View {
        VStack(alignment: .leading) {
            VStack(alignment: .leading) {
                Text("value".uppercased())
                    .font(.largeTitle)
                    .fontWeight(.bold)
                Text("\(sliderValue)")
                    .font(.system(size: 60, weight: .bold))
                Text("new value".uppercased())
                    .font(.largeTitle)
                    .fontWeight(.bold)

                self.calculatedView(for: sliderValue)
            }

            Slider(value: $sliderValue, in: 0...100, step: 1)
                .padding(8)
                .overlay(
                    Capsule()
                        .stroke(Color.purple, style: StrokeStyle(lineWidth: 5))
            )


        }//END: VSTACK
        .padding()
    }

    private func calculatedView(for value: Double) -> some View {
        Text("\(value * 10)")
            .font(.system(size: 60, weight: .bold))
    }
}

这是另一种可能的方法

struct ContentView: View {

    @State private var sliderValue: Double = 0

    var body: some View {
        VStack(alignment: .leading) {
            VStack(alignment: .leading) {
                Text("value".uppercased())
                    .font(.largeTitle)
                    .fontWeight(.bold)
                Text("\(sliderValue)")
                    .font(.system(size: 60, weight: .bold))
                Text("new value".uppercased())
                    .font(.largeTitle)
                    .fontWeight(.bold)

                CalculatedView(value: sliderValue)
            }

            Slider(value: $sliderValue, in: 0...100, step: 1)
                .padding(8)
                .overlay(
                    Capsule()
                        .stroke(Color.purple, style: StrokeStyle(lineWidth: 5))
            )


        }//END: VSTACK
        .padding()
    }
}

struct CalculatedView: View {
    let value: Double

    var body: some View {
        Text("\(value * 10)")
            .font(.system(size: 60, weight: .bold))
    }
}

Answer 2

我推荐计算属性仅用于计算：

var calculatedValue: Double {
    sliderValue * 10
    // or some more complex calculations...
}

calculatedValue 将始终与 sliderValue 同步。

然后您可以使用 Asperi 的答案将您的 TextView 移动到另一个函数或将其留在原处。

Text("\(calculatedValue)")
    .font(.system(size: 60, weight: .bold))

SwiftUI - 如何通过函数（使用滑块）更新值？

SwiftUI - How to update a value through a function (with a slider)?

function

slider

textview

swift