在 SwiftUI 中更改滑块拇指

Question

是否可以像使用 UIKit 中的 UISlider 一样更改 SwiftUI 中滑块的拇指？使用 UISlider，您所要做的就是：

self.setThumbImage(UIImage(named: "Play_black"), for: .normal)

Answer 1

您可以使用 SwiftUI-Introspect 来完成此操作。

您基本上只是从 SwiftUI 的

UISlider

访问底层

Slider

，然后在那里设置它。这比创建自定义滑块或制作可表示的滑块要容易得多。

代码：

struct ContentView: View {
    @State private var value: Double = 0

    var body: some View {
        Slider(value: $value)
            .introspectSlider { slider in
                slider.setThumbImage(UIImage(named: "Play_black"), for: .normal)
            }
    }
}

结果（临时图像）：

Answer 2

您可以在 SwiftUI 中使用 UIKit 的

appearance

来完成此操作。

示例：

struct CustomSlider : View {
    @State private var value : Double = 0
    init() {
        let thumbImage = UIImage(systemName: "circle.fill")
        UISlider.appearance().setThumbImage(thumbImage, for: .normal)
    }
    
    var body: some View {
        Slider(value: $value)
    }
}

Answer 3

您不能简单地修改 SwiftUI 中 Slider 的拇指。 但是，您可以创建自定义滑块。

这是一个示例：https://swiftuirecipes.com/blog/custom-slider-in-swiftui

Answer 4

在 iOS 16 中遇到同样的事情。自定义它的最简单方法是使用 .onAppear 修饰符：

Slider(value: $value)
    .onAppear {
        let thumbImage = UIImage(systemName: "circle.fill")
        UISlider.appearance().setThumbImage(thumbImage, for: .normal)
    }

灵感来源：https://developer.apple.com/forums/thread/719658