SwiftUI：Slider 在导航栏项目的 leading/trailing 中时的奇怪行为

Question

我无法将滑块作为视图放置在导航栏的尾部。因为它挂钩到一个状态，改变它的状态是非常跳跃的，一点也不顺利。

这是我的示例代码：

struct ContentView: View {
    @State var opacityValue: Double = 1
    
    var body: some View {
        NavigationView {
            GeometryReader { geometry in
                VStack {
                    Slider(value: self.$opacityValue, in: 0...100, step: 5) { changed in
                        
                    }
                    Image(systemName: "photo.fill")
                        .foregroundColor(.blue)
                        .padding()
                        .opacity(opacityValue / 100)

                }.navigationBarItems(trailing: HStack(spacing: 20) {
                    Slider(value: self.$opacityValue, in: 0...100, step: 5) { _ in
                        
                    }.frame(width: 100)
                }).frame(width: geometry.size.width / 2)
            }
        }
    }
}

我在常规 VStack 中的滑块非常平滑地改变了不透明度（它甚至移动了导航栏中的滑块。）但另一方面，移动导航栏中的滑块是非常 glitchy/jumpy.

有没有办法让它工作？

Answer 1

您可以使用 @Binding 属性为图像制作新的视图模型，并通过它传递不透明度，将停止 在滑块上移动 @State 属性更改并且必须刷新视图

struct ContentView: View {
    @State var opacityValue: Double = 1
    var body: some View {
        NavigationView {
            GeometryReader { geometry in
                VStack {
                    
                    Slider(value: self.$opacityValue, in: 0...100, step: 5) { _ in
            
                    }
                    
                    ImageOpacityView(opacity: $opacityValue)

                }.navigationBarItems(trailing: HStack(spacing: 20) {
                    
                    Slider(value: self.$opacityValue, in: 0...100, step: 5) { _ in
                        
                    }.frame(width: 100)
                    
                }).frame(width: geometry.size.width / 2)
            }
        }
    }
    
    struct ImageOpacityView: View {
        @Binding var opacity: Double
        
        var body: some View {
            Image(systemName: "photo.fill")
                .foregroundColor(.blue)
                .padding()
                .opacity(opacity / 100)
        }
    }
}

SwiftUI：Slider 在导航栏项目的 leading/trailing 中时的奇怪行为

SwiftUI: Weird behaviour of Slider when it is in the leading/trailing of navigation bar items

ios

swift

swiftui

swiftui-navigationview