Expand and show more text in UITableViewCell on click - ios

Question

I'm trying to learn about iOS development, and followed Apple's own tutorial for making a To-Do list. After the tutorial, they recommended that I continued to build the app, implement more features and so on.
What I'm trying to achieve is when a user clicks on a cell, it expands and shows extra content. For example:
Buy groceries <- "item1"
Do homework <- "item2"
Go for a jog <- "item3"
Turns into this when tapped:
Buy groceries <- "item1"
Buy apples <- "subitem1"
Buy bread <- "subitem2"
Buy milk <- "subitem3"
Do homework <- "item2"
Go for a jog <- "item3"
Right now I have a XYZToDoSubItem class and a XYZToDoItem class. XYZToDoItem inherits Name, Completed-state and Creation-date from XYZToDoSubItem. In addition it has an Mutable Array containing Subitems.
I have also implemented a set of other functions:
When a user "holds" a cell it enters edit mode
When a user double taps a cell, it set completion state to YES and adds a checkmark
So the single-tap cannot interfere with these functions.
I also have a "listener" for single taps (not complete viewDidLoad function):
-(void) viewDidLoad {
UITapGestureRecognizer *stp = [[UITapGestureRecognizer alloc] initWithTarget:self action:#selector(handleSingleTap:)];
stp.numberOfTapsRequired = 1;
stp.numberOfTouchesRequired = 1;
[stp requireGestureRecognizerToFail:dtp];
[self.tableView addGestureRecognizer:stp];
}
Where dtp is a double-tap recognizer.
My handleSingleTap function looks like this:
- (void)handleSingleTap:(UITapGestureRecognizer *)gestureRecognizer {
CGPoint p = [gestureRecognizer locationInView:self.tableView];
NSIndexPath *indexPath = [self.tableView indexPathForRowAtPoint:p];
if(indexPath != nil) {
//Add contents to cell and update height here
}
}
Basically how it works is that when a user taps a cell (and don't proceed to tap it again (no double-tap)), handleSingleTap runs. Here we get the indexPath of the cell tapped, and if that is anything else than nil (which means a cell was tapped, not the background), I wanna add more content to the cell and update the height.
How would I proceed to do this?
Is it possible to just add the content as multiple subtitles, and then call [self.tableView realoadData] or [self.tableView beginUpdates] and [self.tableView endUpdates], and iOS handles the resizing itself? If that's the case, how do I add the data? And how would I call the resize method? If not, how would I manually resize the cells after inserting the data?
My setup looks like this:
In the ViewController class:
#property NSMutableArray *toDoItems;
In the ToDoItem class (inherits from subitem):
#property NSMutableArray *toDoSubItems;
In the SubItem class:
#property NSString *itemName;
#property BOOL completed;
#property (readonly) NSDate *creationDate;
I hope someone is able to figure out how to solve this.
Thanks in advance,
Aleksander.

Answer 1

I personally really like using [tableView beginUpdates]; [tableView endUpdates];, it gives you a really nice animation. :-)
The problem with that code is that it doesn't actually update the cells themselves, it doesn't call cellForRowAtIndexPath. I would recommend using the previously mentioned code, to animate the height change, together with [tableView reloadData] or [tableView reloadRowsAtIndexPaths:NSArray* withRowAnimation:UITableViewRowAnimation]; to update the cells content.
Simply store which row was touched and when cellForRowAtIndexPath and heightForRowAtIndexPath gets called, check if it's the same row and act accordingly.
From a usability stand-point I would recommend putting all the sub-tasks in the cell from the beginning but putting them outside of the cells frame. That way, when the cell gets touched only the cells height needs to change to reveal the views outside of the cells frame. This way, you don't have to deal with the content changing either.
Cheers!