Trying to add inline UIDatePicker to UITableViewCell

Question

I am trying to create an inline DatePicker inside a TableView cell, similar to this and this SO stream.

I create a date picker using the method below, which is called when the view is loaded:

- (void)createDatePicker{ _datePicker = [[UIDatePicker alloc]init]; _datePicker.datePickerMode = UIDatePickerModeTime; _datePicker.clipsToBounds = YES; _datePicker.backgroundColor = [UIColor colorWithRed:0.922 green:0.937 blue:0.949 alpha:1]; NSLog(@"date picker created"); } 

Then I check to see if the bottom row of the third section is selected in my table view. If so, and the date picker is no longer displayed, I call the method to show the date picker:

 - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath { if (indexPath.row == HourTimeZoneRow && self.datePickerIsShowing == NO) { NSLog(@"Time of day section"); [self showDatePickerCell]; } else { [self hideDatePickerCell]; } [self.tableView deselectRowAtIndexPath:indexPath animated:YES]; } 

The following are ways to display the date picker:

 - (void)showDatePickerCell { [self.tableView addSubview:_datePicker]; self.datePickerIsShowing = YES; self.datePicker.hidden = NO; [self.tableView reloadData]; NSLog(@"Show date picker"); } 

... and hide the cell:

 - (void)hideDatePickerCell { self.datePickerIsShowing = NO; self.datePicker.hidden = YES; [self.tableView reloadData]; NSLog(@"Hide date picker"); } 

The following is a method for determining whether to view a table to add an extra cell to display a UIDatePicker.

 - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section { switch (section) { case TableSectionOne: return TotalRowsSection1; break; case TableSectionTwo: return TotalRedZoneRows; break; case TableSectionThree: if (self.datePickerIsShowing == YES) { return TableSectionThree + 1; } else { return TableSectionThree; } break; default: return 0; break; } } 

Finally, the method below is what should determine the height of the date picker:

 - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath { CGFloat rowHeight = self.tableView.rowHeight; if (indexPath.row == HourTimeZoneRow){ rowHeight = 164; } else { rowHeight = self.tableView.rowHeight; } return rowHeight; } 

However, what happens when the last row of the third section is selected, the date picker is displayed in the first line of the first section. Does anyone have any suggestions on what I'm doing wrong?

Answer 1

You add datePicker to tableView, not to cell in tableView.

Remove this line from showDatePickerCell:

 [self.tableView addSubview:_datePicker]; 

Then add it (or show) in the appropriate cell inside cellForItemAtIndexPath.

(sort of:

 - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { static NSString *simpleTableIdentifier = @"SimpleTableItem"; UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:simpleTableIdentifier]; if (cell == nil) { cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:simpleTableIdentifier]; } if (indexPath.row == HourTimeZoneRow) { // show the datePicker here } cell.textLabel.text = [tableData objectAtIndex:indexPath.row]; return cell; } 

)