0

I need to create a subclass of UISlider in swift so that it has 3 bar views & 1 thumb image. Currently iOS Provides only 2 bar views & 1 thumb image.

The two bar views are minimumTrackImage & maximumTrackImage.

enter image description here

I need one more bar view on right hand side which is permissible limit of UISlider. i.e if slider has current value 50 max allowed value value is 100. I can able to set Permissible limit to 80 and slider will look like as below.

enter image description here

Could anyone please help...

Anil Kothari
  • 7,653
  • 4
  • 20
  • 25
  • Since you can't easily have *three* track images, could you use *two*? Your `minimumTrackImage` is solid green, so that's good. Make your `maximumTrackImage` a bit more dynamic... in your case something white with a gray bar in it. Not sure how well you can use auto layout if you need to... but creating an image that is a white background with a gray bar 80% of the width is pretty easy to make. –  Jun 12 '17 at 17:16

1 Answers1

-1

Here is an example I quickly put together that hopefully shows what you need (see github-link below)....

Link to the example "permissibleLimitSlider" on GitHub (The solution is done with Swift-3.1, Xcode-8.3.3 and iOS-Simulator-10.0)

The trick was:

A) to create a new maximumTrackImage (called "slider-track" in my example). I created that image in photoshop (but you can use a different graphics-program).

B) to add an IBAction (with Event "ValueChanged") from your Storyboard-Slider into the MyViewController. And in this method you simply observe the sender.value and limit it to 0.8

That's how it looks like in my github example: Feel free to change colors by changing the Asses-images in the project!

enter image description here

Hope this static limit (of 0.8) is what you need. If you need a dynamic limit (settable in code), I suggest you provide something like 10 images, make the Slider a "discrete slider" and set your maximumTrackImage to one or the other image whenever you need to...

More examples on how to make your slider a discrete-slider can be found here

A very good tutorial on how to make custom-sliders can be found here

iKK
  • 6,394
  • 10
  • 58
  • 131