0

I am using a "Slider" in my WatchOS interface, built with SwiftUI. Since the Slider is contained inside another container, I really need the background of the Slider to be fully transparent (Color.clear). I have tried to use the .background(Color.clear) modifier and .buttonStyle(PlainButtonStyle()), both made no difference to the default behaviour of the Slider, there is always the default semi-transparent background.

Is there any way to get rid of that default background of the Slider component on WatchOS?

import SwiftUI

struct CustomSlider: View {
    @State var value: Double = 2.0
    
    var body: some View {
        VStack {
            Text("Adjust value")
            Slider(
                value: $value,
                in: 0...3,
                step: 1,
                minimumValueLabel: Text("-"),
                maximumValueLabel: Text("+")
            ) {}
            .buttonStyle(PlainButtonStyle())
            .background(Color.clear)
            .accentColor(.green)
            
            Text("VALUE")
                .foregroundColor(.white)
        }
        .padding()
        .background(Color(red: 0.1, green: 0.2, blue: 0.3, opacity: 1.0))
        .cornerRadius(10.0)
    }
}

struct CustomSlider_Previews: PreviewProvider {
    static var previews: some View {
        CustomSlider()
    }
}

How do I get rid of that lighter background color in the Slider

Bocaxica
  • 3,911
  • 3
  • 37
  • 54
  • Does this answer your question? [How customise Slider blue line in SwiftUI?](https://stackoverflow.com/questions/57101754/how-customise-slider-blue-line-in-swiftui) – mahan Dec 17 '20 at 15:32
  • @mahan Thanks, unfortunately it doesn't really answer my question, the other question is a different question and is about the colors in the track bar rather than the background colour of the slider container. This background is specific to WatchOS, the background color of the slider I am struggling with does not apply to the iOS Slider. – Bocaxica Dec 17 '20 at 15:51
  • 2
    We really cannot, at least till SwiftUI 2.0, because it is system rendered and flat. So the solution is to return to UISlider. – Asperi Dec 17 '20 at 16:12
  • OK thanks.. It shouldn't be too hard to make your own custom SwiftUI Slider element either.. However I hoped to avoid that. For now I'll build a custom Slider. – Bocaxica Dec 17 '20 at 16:59

0 Answers0