Mission| Philosophy| Solutions| Client Area| Hiring

Friday, January 30, 2009

Part II: Building a To Do List Application for the iPhone

Okay, in this part of the Tutorial we are going to make the To Do List actually useable. We will add in the functionality to allow you to remove To Do Tasks.

Removing To Do Tasks



This is a lot easier than you might think. Xcode has most of this functionality already built out for you, all you need to do is connect the user interaction in deleting to how you store your data.

We need to enable a button to show the edit Button to enable removing tasks from the view.

1. Open up RootViewController.m

Uncomment the method viewDidLoad. You will notice that Xcode has already coded the line to enable the editButtonItem. We are going to make one small change and have the edit show up on the left side of the toolbar instead of the right side.

Your method should look like this:


- (void)viewDidLoad {
[super viewDidLoad];

// Uncomment the following line to display an Edit button in the navigation bar for this view controller.
self.navigationItem.leftBarButtonItem = self.editButtonItem;
}


2. Build and Go

After compiling and deploying your code you should see the following:



Now click on the Edit Button. Notice how it handles showing the delete functionality:



Now click on the red circle near Task #2, it should show the following:



Now click on the red delete button, and you should see:



You see how the Task #2 still shows up? That is because the task list still has the task in the list property of ToDoListAppDelegate. We need to remove the task from the list.

Here is how we do that:

3. Open up RootViewController.m

After the delete button has been pushed it calls the method - (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath.

It passes in the view, the type of editing it is doing, and the row in the table view.

Xcode has the method built for you all we are going to do is uncomment it and add a couple of lines in bold to adjust the array for us.

// Override to support editing the table view.
- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath {

if (editingStyle == UITableViewCellEditingStyleDelete) {
// Delete the row from the data source
ToDoListAppDelegate *appDelegate = (ToDoListAppDelegate *)[[UIApplication sharedApplication] delegate];
[appDelegate removeToDoTaskInListAtIndex:indexPath.row];
[tableView deleteRowsAtIndexPaths:[NSArray arrayWithObject:indexPath] withRowAnimation:YES];
}
else if (editingStyle == UITableViewCellEditingStyleInsert) {
// Create a new instance of the appropriate class, insert it into the array, and add a new row to the table view
}
}

As you can see this method checks the editing style and when it sees a delete we tell it to tell the appDelegate to remove the task at the specific index.

We now need to add that method to the ToDoListAppDelegate.

3. Open up ToDoTaskAppDelegate.h

We are going to define the method in the header add the following code in bold so that your interace looks like this:


@interface ToDoListAppDelegate : NSObject {

UIWindow *window;
UINavigationController *navigationController;

NSMutableArray *list;
}

- (NSUInteger) countOfToDoList;
- (NSString *) toDoTaskInListAtIndex:(NSUInteger)theIndex;
- (void) removeToDoTaskInListAtIndex:(NSUInteger)theIndex;

@property (nonatomic, retain) IBOutlet UIWindow *window;
@property (nonatomic, retain) IBOutlet UINavigationController *navigationController;

@property (nonatomic, retain) NSMutableArray *list;

@end




3. Open up ToDoTaskAppDelegate.m

We are going to code the method by adding the following code in bold so that your implementation looks like this:

@implementation ToDoListAppDelegate

@synthesize window;
@synthesize navigationController;

- (void)applicationDidFinishLaunching:(UIApplication *)application {
self.list = [NSMutableArray arrayWithObjects:@"Task #1", @"Task #2", @"Task #3",nil];// Configure and show the window

[window addSubview:[navigationController view]];
[window makeKeyAndVisible];
}


- (void)applicationWillTerminate:(UIApplication *)application {
// Save data if appropriate
}


- (void)dealloc {
[navigationController release];
[window release];
[super dealloc];
}

#pragma mark ToDoListAppDelegate Actions
- (NSUInteger) countOfToDoList{
return [list count];
}

- (NSString *) toDoTaskInListAtIndex:(NSUInteger)theIndex{
return [list objectAtIndex:theIndex];
}

- (void) removeToDoTaskInListAtIndex:(NSUInteger)theIndex{
[list removeObjectAtIndex:theIndex];
}

@synthesize list;
@end


4. Build and Go

Compile the code and now when you try to delete the task it should look like this:



Summary



Ok you learned how easy it is to provide deleting capabilities to your table view. In the next part I will show you how to add new tasks to your To Do List.

In case you have any challenges building the code attached is my build at
ToDoList_2.tar.gz

0 Comments:

Post a Comment

<< Home