Implement A Custom Accessory View For UITableView In iPhone

In this application we’ll see how to implement a custom accessory view for your UITableView in the form of a checkmark button.

Step 1: Create a Window base application using template. Give the name of the application “CheckMark”.

Step 2: Xcode automatically creates the directory structure and adds essential frameworks to it. You can explore the directory structure to check out the content of the directory.

Step 3: We need to add the resource file called as “checked.png” and “unchecked.png” into the resource folder. Select resources and add files existing sources and select the checked.png and unchecked.png.

Step 4: Now we’ll add Table view controller class to the project. Choose New file -> Select cocoa touch classes group and then select UITableViewController subclass. Give the name TableView.

Step 5: In the AppDelegate.h file, we define UINavigationController. Make the following changes in the AppDelegate.h file .

 

 

 

Step 6: In the AppDelegate.m file , make the following changes :

 

 

 

Step 7: We added dataArray in the TableView.h file, so make the following changes:

 

 

 

Step 8: Double click the MainWindow.xib file and open it to the Interface Builder. Drag Navigation Controller from the library and place it in the MainWindow. Double click Navigation Controller icon and open the Navigation Controller window. Change the title into “Add CheckMark”. Select View Controller and bring up identity inspector change the class name into TableView. Now drag table view from the library and place it to the Navigation Controller window. Select it and bring up connection inspector, you will see two connection are available dataSource and delegate. Drag dataSource to the table view . Do it once more time for the delegate. Save it and go back to the Xcode.

Step 9: In the TableView.m file make the following changes:

 

 

 

Step 10: Compile and run the application in the Simulator.

You can downloaded SourceCode from here CheckMark 2

Leave a Comment:

9 comments
Brad Rbinson says June 15, 2010

Hi Guys

This is a great tutorial got it working straight away with own data, but the next biggest question for this tutorial would be how would you make this data persistent.

Thanks for the help, Brad

Reply
Dimitar M says August 30, 2010

Use NSUserDefaults to save user settings

Reply
    brad robinson says December 20, 2010

    I tried this but it wouldn’t save the bool value for the checked state just the text and then starts the value back at 0.

    Thanks
    Brad

    Reply
Ladislav Klinc says November 10, 2010

Hey,

great tutorial, right what I was looking for !

Ladislav

Reply
shaxpear says February 25, 2011

Good example.. great explanation.. Good Job

Reply
Atul says July 19, 2011

Great tutorial.

Reply
khushi says October 21, 2011

Hi,

This tutorial is best. I used ur logic with my logic and requirement , but i have facing a problem. My problem is ,when i check my last index then my first index is automatically unchecked.
How to unchecked my First index when i checked my last index and Vice Versa also ?

Reply
Boris says December 10, 2011

There is a bug. You accessory button intercepts touch and does not propagate it to UITableViewCell. Meaning it will no select the cell if your user touches accessory view.

Reply
How to: Using a custom image for a UITableViewCell's accessoryView and having it respond to UITableViewDelegate | SevenNet says December 21, 2014

[…] I found this website to be very helpful: custom accessory view for your uitableview in iphone […]

Reply
Add Your Reply