iOS & Swift – Making Custom Slider With UIView

iPhone custom slider






TOKYO (MacHouse) – It’s been 7 months since I started developing software in Swift. I didn’t quite like Swift at the beginning because it’s totally different from Objective-C especially in the way it defines variables without data types. Well, I have a changed heart. I love Swift.

Anyway, one thing that I don’t like about iOS is its ugly UISlider. The touch part is a big circle, and it comes with a very thin, blue, horizontal line. Yuck! It’s ugly. So I’ve decided to make my own custom slider.  


iPhone custom slider

Screenshot 1
  iPhone custom slider

Screenshot 2



Taking a quick look, a resulting slider looks seeminly better than UISlider. (See Screenshot 1.) But considering the amount of effort that I’ve made in making this slider, I wonder if it’s all that worth it. Well, I’ve spent more than 6 hours since I started from scratch. This slider is the result of three UIView suclasses (RoundView.swift, TouchView.swift, TicksView.swift). (See Screenshot 2.)



Click here to watch a quick iPhone Simulator QuickTime movie.



In order to create a UIView-based custom slider like the one shown in Screenshot 1, you need to now how to allow the user to move a UIView object with the touchesMoved method. You also have to know how to send the touch location value from UIView to UIViewController with protocol.

Leave a Reply

Your email address will not be published. Required fields are marked *

Notify me of followup comments via e-mail. You can also subscribe without commenting.