ios - Slider - incorrect color at the beginning and in the end

Question

I have a custom slider where i have to increase slider's height (thickness). The code looks like this:

class CustomSlider: UISlider
{   
    override open func trackRect(forBounds bounds: CGRect) -> CGRect {
        var defaultBounds = super.trackRect(forBounds: bounds)
        let newHeight: CGFloat = 20
        
        return CGRect(x: defaultBounds.origin.x,
                      y: defaultBounds.origin.y + defaultBounds.size.height/2 - newHeight/2,
                      width: defaultBounds.size.width,
                      height: newHeight)
    }
}

The height is increased, but the problem now is that slider is not colored properly at the beginning and in the end. For example, at the beginning it now looks like this: wrong color at the beginning

After some point the color becomes correct and fills blue: correct color after some point

In the end there is the same problem, at first everything works as expected: normal behavior

But then after some point the color becomes updated to blue too soon: wrong color in the end

Has anyone experienced anything similar before? Is there any solution for this?

I have tried using setMinimumTrackImage and setMaximumTrackImage instead of minimumTrackTintColor and maximumTrackTintColor, it works, but i cannot use it because when i rotate screen - slider stretches and the image which i am using stretches as well, so slider's corner radius looks stretched and not the same as it has to be.

Also an interesting fact is that the more I increase slider height - the later the correct color appears at the beginning.

question from:https://stackoverflow.com/questions/65919672/slider-incorrect-color-at-the-beginning-and-in-the-end

Answer 1

Since setting track images is working and the only issue is stretched corners, the latter can be solved by using resizableImage(withCapInsets:) on your track images, so only the middle part of the image will be stretched and the rest will remain untouched.

These articles cover the topic in great details:

https://www.natashatherobot.com/ios-stretchable-button-uiedgeinsetsmake/

https://www.hackingwithswift.com/example-code/media/how-to-make-resizable-images-using-resizableimagewithcapinsets