Tuesday, 4 June 2013

How to create an UITableView: Xcode

Overview
     An instance of UITableView (or simply, a table view) is a means for displaying and editing hierarchical lists of information.



xib:

 Drag and drop tableView.
 Connect  tableView : dataSource   ---->     viewController/File's owner
                                  deligate         ---->     viewController/File's owner

in .h:

@interface ViewController : UIViewController <UITableViewDataSource,UITableViewDelegate>
{
     NSArray *exercises;
    UITableViewCell *cell;
}
@end

in .m:

@implementation ViewController
     
- (void)viewDidLoad
{
  //-----------create table list array-----------//
     exercises = [[NSArray alloc]initWithObjects:@"Name 1",@"Name 2",@"Name 3",@"Name 4",
                             @"Name 5",@"Name 6",@"Name 7",@"Name 8",@"Name 9",@"Name 10",nil];
   
     [super viewDidLoad];
}

 //Add table view delegates //

//------------delegate that decides the number of rows in table view--------------//        
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
      return exercises.count;
}

//------------delegate decides the content of each table cell--------------//
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
      //-----------create a cell-----------//
        cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"cell"];
   
     //-----------fill it with contents-----------//
        cell.textLabel.text = [exercises objectAtIndex:indexPath.row];
           
     //-----------return it-----------//
        return cell;
}

//------------To get the touched cell val/name --------------//
 - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
        NSLog(@"Selected Row    %@",[exercises objectAtIndex:indexPath.row]);
}

//------------Table view swipe delete deligate(optional)------------//

                            For using this method, you have to add and connect IBOutlet to your table view (say myEditableTable), and load your table from an NSMutableArray (say exercises_Mutable). Then use the following method:


- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath {
   
    if (editingStyle == UITableViewCellEditingStyleDelete) {
        // Repsond to delete
NSLog(@”Delete-à %@”, [exercises_Mutable objectAtIndex:indexPath.row]);
[exercises_Mutable removeObjectAtIndex: indexPath.row] ;
[myEditableTable reloadData];

    }    
}

Here, the ‘[exercises_Mutable removeObjectAtIndex: indexPath.row]’ will remove the clicked indexed element from your Mutable array, and ‘[myEditableTable reloadData]’ will reload the table with the changed array.

Optional : And if you want to change the text of the Delete button you can use the following syntax*/
                  tableView:titleForDeleteConfirmationButtonForRowAtIndexPath:


//------------To add an image to UITableViewCell(optional)------------//
-(void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath{
        cell.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"myImage.png"]];
  }



//------------To change UITable view separator color and style(optional)------------//
 Separator is the straight line that separates each cell in a tableView. You have control over it's style and color. You can change those properties as follows:

        myTableView.separatorStyle=UITableViewCellSeparatorStyleSingleLine;
        myTableView.separatorColor = [UIColor brownColor];

2 comments:

  1. Please explain to me how you would put proper code to delete the row you swiped to reveal the delete button on. (in the "//respond to delete" section).

    ReplyDelete
    Replies
    1. I've edited that section for your convenience ............. :)

      Delete