Introducing SMWheelControl

Posted on June 10, 2013

Today I am proud to announce the availability of a new Pod for iOS which will be included in my forthcoming app.


an iOS control allowing the selection of an item from a 360° spinning wheel with a smooth inertial rotation.

The code, released under the BSD 3-clause license, is loosely based on the tutorial “How To Create a Rotating Wheel Control with UIKit” published on this Ray Wenderlich’s post by Cesare Rocchi

As usual, you can insert it into your podfile by adding

pod "SMWheelControl", "0.1.1"

Some howto follows.


Initialization and data source

Instantiate the control with a classical - (id)initWithFrame:(CGRect)rect and add a target as you usually do with a control, e.g.:

SMWheelControl *wheel = [[SMWheelControl alloc] initWithFrame:CGRectMake(0, 0, 320, 320)];
[wheel addTarget:self action:@selector(wheelDidChangeValue:) forControlEvents:UIControlEventValueChanged];

Then add a dataSource:

wheel.dataSource = self;
[wheel reloadData];

and implement the following methods (the dataSource should conform to the SMWheelControlDataSource):

- (UIView *)wheel:(SMWheelControl *)wheel viewForSliceAtIndex:(NSUInteger)index;
- (NSUInteger)numberOfSlicesInWheel:(SMWheelControl *)wheel;

For instance:

- (NSUInteger)numberOfSlicesInWheel:(SMWheelControl *)wheel
    return 10;

- (UIView *)wheel:(SMWheelControl *)wheel viewForSliceAtIndex:(NSUInteger)index
    UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 150, 30)];
    label.backgroundColor = [UIColor whiteColor];
    label.text = [NSString stringWithFormat:@" %d", index];
    return label;

When the wheel ends snapping to the closest slice, if you added a target, then it will receive the event UIControlEventValueChanged, and the selector you specified will be executed.

- (void)wheelDidChangeValue:(id)sender
    self.valueLabel.text = [NSString stringWithFormat:@"%d", self.wheel.selectedIndex];