Make UISlider height larger?

Question

I've been searching for a way to make the UISlider progress bar taller, that is, increase the height. However, I haven't had any success. I don't want to use a custom image or anything, just make it taller, so the UISlider doesn't look so thin. Am I missing something super obvious?

Answer 1

The accepted answer will undesirably change the slider's width in some cases, like if you're using a minimumValueImage and maximumValueImage. If you only want to change the height and leave everything else alone, then use this code:

override func trackRect(forBounds bounds: CGRect) -> CGRect {
   var newBounds = super.trackRect(forBounds: bounds)
   newBounds.size.height = 12
   return newBounds
}

Answer 2

Here's my recent swifty implementation, building on CularBytes's ...

open class CustomSlider : UISlider {
    @IBInspectable open var trackWidth:CGFloat = 2 {
        didSet {setNeedsDisplay()}
    }

    override open func trackRect(forBounds bounds: CGRect) -> CGRect {
        let defaultBounds = super.trackRect(forBounds: bounds)
        return CGRect(
            x: defaultBounds.origin.x,
            y: defaultBounds.origin.y + defaultBounds.size.height/2 - trackWidth/2,
            width: defaultBounds.size.width,
            height: trackWidth
        )
    }
}

Use this on a UISlider in a storyboard by setting its custom class

The IBInspectable allows you to set the height from the storyboard

Answer 3

For those that would like to see some working code for changing the track size.

class CustomUISlider : UISlider {

    override func trackRect(forBounds bounds: CGRect) -> CGRect {

        //keeps original origin and width, changes height, you get the idea
        let customBounds = CGRect(origin: bounds.origin, size: CGSize(width: bounds.size.width, height: 5.0))
        super.trackRect(forBounds: customBounds)
        return customBounds
    }

    //while we are here, why not change the image here as well? (bonus material)
    override func awakeFromNib() {
        self.setThumbImage(UIImage(named: "customThumb"), for: .normal)
        super.awakeFromNib()
    }
}

Only thing left is changing the class inside the storyboard:

You can keep using your seekbar action and outlet to the object type UISlider, unless you want to add some more custom stuff to your slider.

Answer 4

I found what I was looking for. The following method just needs to be edited in a subclass.

- (CGRect)trackRectForBounds:(CGRect)bounds{
    CGRect customBounds = ...
    return customBounds;
}

Answer 5

You could play with this, see what happens:

slider.transform = CGAffineTransformScale(CGAffineTransformIdentity, 1.0, 2.0);