UIPickerView that looks like UIDatePicker but with seconds UIPickerView that looks like UIDatePicker but with seconds ios ios

UIPickerView that looks like UIDatePicker but with seconds


Alrighty folks, here is the code to get hours/mins/secs in your UIPickerView. You can add 3 labels an strategically place them on the picker. I have attached a picture as well.

If you like the answer do rate it up! Good developers share knowledge not hide it like some people suggested. Have fun coding!

enter image description here

In your header .h file put this

@interface v1AddTableViewController : UITableViewController{    IBOutlet UIPickerView *pickerView;        NSMutableArray *hoursArray;    NSMutableArray *minsArray;    NSMutableArray *secsArray;    NSTimeInterval interval;}@property(retain, nonatomic) UIPickerView *pickerView;@property(retain, nonatomic) NSMutableArray *hoursArray;@property(retain, nonatomic) NSMutableArray *minsArray;@property(retain, nonatomic) NSMutableArray *secsArray;

in your .m file put this

@synthesize pickerView;@synthesize hoursArray;@synthesize minsArray;@synthesize secsArray;@synthesize interval;- (void)viewDidLoad{    [super viewDidLoad];    //initialize arrays    hoursArray = [[NSMutableArray alloc] init];    minsArray = [[NSMutableArray alloc] init];    secsArray = [[NSMutableArray alloc] init];    NSString *strVal = [[NSString alloc] init];    for(int i=0; i<61; i++)    {        strVal = [NSString stringWithFormat:@"%d", i];        //NSLog(@"strVal: %@", strVal);        //Create array with 0-12 hours        if (i < 13)        {            [hoursArray addObject:strVal];        }        //create arrays with 0-60 secs/mins        [minsArray addObject:strVal];        [secsArray addObject:strVal];    }    NSLog(@"[hoursArray count]: %d", [hoursArray count]);    NSLog(@"[minsArray count]: %d", [minsArray count]);    NSLog(@"[secsArray count]: %d", [secsArray count]);}//Method to define how many columns/dials to show- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView{    return 3;}// Method to define the numberOfRows in a component using the array.- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent :(NSInteger)component {     if (component==0)    {        return [hoursArray count];    }    else if (component==1)    {        return [minsArray count];    }    else    {        return [secsArray count];    }}// Method to show the title of row for a component.- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component{    switch (component)     {        case 0:            return [hoursArray objectAtIndex:row];            break;        case 1:            return [minsArray objectAtIndex:row];            break;        case 2:            return [secsArray objectAtIndex:row];            break;        }    return nil;}-(IBAction)calculateTimeFromPicker{    NSString *hoursStr = [NSString stringWithFormat:@"%@",[hoursArray objectAtIndex:[pickerView selectedRowInComponent:0]]];    NSString *minsStr = [NSString stringWithFormat:@"%@",[minsArray objectAtIndex:[pickerView selectedRowInComponent:1]]];    NSString *secsStr = [NSString stringWithFormat:@"%@",[secsArray objectAtIndex:[pickerView selectedRowInComponent:2]]];    int hoursInt = [hoursStr intValue];    int minsInt = [minsStr intValue];    int secsInt = [secsStr intValue];    interval = secsInt + (minsInt*60) + (hoursInt*3600);    NSLog(@"hours: %d ... mins: %d .... sec: %d .... interval: %f", hoursInt, minsInt, secsInt, interval);    NSString *totalTimeStr = [NSString stringWithFormat:@"%f",interval];}


Unlike the accepted solution above, I came up with something a little less terrible. Definitely not perfect, but it has the desired effect (I've only tested in iOS 7 on iPhone, only works in portrait as written). Edits to make better are welcome. Relevant display code below:

// assumes you conform to UIPickerViewDelegate and UIPickerViewDataSource in your .h- (void)viewDidLoad{    [super viewDidLoad];    // assumes global UIPickerView declared. Move the frame to wherever you want it    picker = [[UIPickerView alloc] initWithFrame:CGRectMake(0, 100, self.view.frame.size.width, 200)];    picker.dataSource = self;    picker.delegate = self;    UILabel *hourLabel = [[UILabel alloc] initWithFrame:CGRectMake(42, picker.frame.size.height / 2 - 15, 75, 30)];    hourLabel.text = @"hour";    [picker addSubview:hourLabel];    UILabel *minsLabel = [[UILabel alloc] initWithFrame:CGRectMake(42 + (picker.frame.size.width / 3), picker.frame.size.height / 2 - 15, 75, 30)];    minsLabel.text = @"min";    [picker addSubview:minsLabel];    UILabel *secsLabel = [[UILabel alloc] initWithFrame:CGRectMake(42 + ((picker.frame.size.width / 3) * 2), picker.frame.size.height / 2 - 15, 75, 30)];    secsLabel.text = @"sec";    [picker addSubview:secsLabel];    [self.view addSubview:picker];}- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView{    return 3;}- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component{    if(component == 0)        return 24;    return 60;}- (CGFloat)pickerView:(UIPickerView *)pickerView rowHeightForComponent:(NSInteger)component{    return 30;}- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view{    UILabel *columnView = [[UILabel alloc] initWithFrame:CGRectMake(35, 0, self.view.frame.size.width/3 - 35, 30)];    columnView.text = [NSString stringWithFormat:@"%lu", (long) row];    columnView.textAlignment = NSTextAlignmentLeft;    return columnView;}

And the result:

H/M/S Picker


swift implementation

class TimePickerView: UIPickerView, UIPickerViewDataSource, UIPickerViewDelegate {    var hour:Int = 0    var minute:Int = 0    override init() {        super.init()        self.setup()    }    required internal init(coder aDecoder: NSCoder) {        super.init(coder: aDecoder)        self.setup()    }    override init(frame: CGRect) {        super.init(frame: frame)        self.setup()    }    func setup(){        self.delegate = self        self.dataSource = self        /*let height = CGFloat(20)        let offsetX = self.frame.size.width / 3        let offsetY = self.frame.size.height/2 - height/2        let marginX = CGFloat(42)        let width = offsetX - marginX        let hourLabel = UILabel(frame: CGRectMake(marginX, offsetY, width, height))        hourLabel.text = "hour"        self.addSubview(hourLabel)        let minsLabel = UILabel(frame: CGRectMake(marginX + offsetX, offsetY, width, height))        minsLabel.text = "min"        self.addSubview(minsLabel)*/    }    func getDate() -> NSDate{        let dateFormatter = NSDateFormatter()        dateFormatter.dateFormat = "HH:mm"        let date = dateFormatter.dateFromString(String(format: "%02d", self.hour) + ":" + String(format: "%02d", self.minute))        return date!    }    func numberOfComponentsInPickerView(pickerView: UIPickerView) -> Int {        return 2    }    func pickerView(pickerView: UIPickerView, didSelectRow row: Int, inComponent component: Int) {        switch component {        case 0:            self.hour = row        case 1:            self.minute = row        default:            println("No component with number \(component)")        }    }    func pickerView(pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int {        if component == 0 {            return 24        }        return 60    }    func pickerView(pickerView: UIPickerView, rowHeightForComponent component: Int) -> CGFloat {        return 30    }    func pickerView(pickerView: UIPickerView, viewForRow row: Int, forComponent component: Int, reusingView view: UIView!) -> UIView {        if (view != nil) {            (view as UILabel).text = String(format:"%02lu", row)            return view        }        let columnView = UILabel(frame: CGRectMake(35, 0, self.frame.size.width/3 - 35, 30))        columnView.text = String(format:"%02lu", row)        columnView.textAlignment = NSTextAlignment.Center        return columnView    }}