Latest 1.2.2
License MIT
Platforms ios 5.0, requires ARC
Frameworks CoreGraphics, QuartzCore

Build Status

A custom component like UISegmentedControl highly customizable.

STTimeSlider screenshot



You can use CocoaPods by adding STTimeSlider in your Podfile. If you don’t want to use this method, please refer to the following method:

Please include these 4 files:

  • STTimeSlider.h
  • STTimeSlider.m
  • STTimeSliderModeView.h
  • STTimeSliderModeView.m

And include QuartzCore.framework and CoreGraphics.framework.

This plugin is highly customizable. You can customize:

STTimeSlider doc sizes


  • STTimeSliderMode mode: The mode of the slider (multi points or solo)
  • int startIndex: In mode STTimeSliderModeMulti, it’s the initial departure point


  • float numberOfPoints: The number of points (more than 1)
  • float radiusPoint: (1) The radius of the point
  • float heightLine: (2) The height of the line between two points. The height must be lower than radiusPoint * 2;
  • float spaceBetweenPoints: (3) The space between two points
  • float radiusCircle: (4) The radius of the point inside the selected circles


  • CGGradientRef gradient: The gradient of the background bar
  • CGGradientRef gradientForeground: The gradient of the foreground bar


  • UIColor *strokeColor: The color of the background bar’s stroke.
  • float strokeSize: The size of the background bar’s stroke.
  • UIColor *strokeColorForeground: The color of the foreground bar’s stroke.
  • float strokeSizeForeground: The size of the foreground bar’s stroke.


  • CGSize shadowSize: The size.
  • float shadowBlur: The blur.
  • UIColor *shadowColor: The color.


Build and run the project STTimeSliderExample in Xcode to see STTimeSlider in action.

Example Usage

    STTimeSlider *timeSlider = [[STTimeSlider alloc] initWithFrame:CGRectMake(5.0, 5.0, 310.0, 110.0)];
    [timeSlider setDelegate:self];
    [self.view addSubview:timeSlider];

Don’t forget to implementSTTimeSliderDelegate protocol in your ViewController. Without it, you won’t be able to detect when the user will change the index:

    - (void)timeSlider:(STTimeSlider *)timeSlider didSelectPointAtIndex:(int)index {
        NSLog(@"User clicked on TimeSlider %@ at Index %d", timeSlider, index);

or when the slider has changed:

    - (void)timeSlider:(STTimeSlider *)timeSlider didMoveToPointAtIndex:(int)index {
        NSLog(@"TimeSlider %@ has changed at Index %d", timeSlider, index);

You can change the index of the slider with - (void)moveToIndex:(int)index;.


Sebastien Thiebaud


STTimeSlider is available under the MIT license.

Latest podspec

    "name": "STTimeSlider",
    "version": "1.2.2",
    "summary": "A custom component like UISegmentedControl highly customizable.",
    "homepage": "",
    "license": {
        "type": "MIT",
        "file": "LICENSE"
    "authors": {
        "Sebastien THIEBAUD": "[email protected]"
    "source": {
        "git": "",
        "tag": "1.2.2"
    "platforms": {
        "ios": "5.0"
    "source_files": [
    "requires_arc": true,
    "frameworks": [

Pin It on Pinterest

Share This