Question

My application is looking like the below image

I have 3 buttons in my segmented control. Assume that hitting the “Department” button will display 3 departments & hitting “Name” button will show 6 names.

I follow the below steps to make this..

1. Create UISegmentedControl by this code

   segmentedControl = [[UISegmentedControl alloc] initWithItems:[NSArray arrayWithObjects:@"Department", @"Name", @"ID",nil]];  //Initialize Segmented Control
   
   segmentedControl.segmentedControlStyle = UISegmentedControlStyleBar; //Define bar type (optional)
   
   segmentedControl.selectedSegmentIndex = 0; //Define default clicked button
   
   [segmentedControl addTarget:self action:@selector(segmentClicked) forControlEvents:UIControlEventValueChanged];  //Set target and define which method should called when tapping buttons
   
   self.navigationItem.titleView = segmentedControl; //To add UISegmented Control in the title of the navigation bar
   

2. Define the method(segmentClicked) for UISegmented Control

   segment = segmentedControl.selectedSegmentIndex;
   
   if (segment==0) {
       //Do something for Department tab
       [self.tableView reloadData];
   }
   
   else if (segment==1) {
       //Do something for Name tab
       [self.tableView reloadData];
   }
   
   else {
       //Do something for ID tab
       [self.tableView reloadData];
   }
   

3. Create the cells with reference to the value of segment in tableView: cellForRowAtIndexPath: method. (So that we can get various cells for each UISegmentedControl buttons)

   if (segment == 0) {
   
       cell.textLabel.text = [listOfDepartments objectAtIndex:indexPath.section]; //listOfDepartments is the NSMutableArray that contains list of Departments names
   
   }
   
   else if (segment == 1) {
   
       cell.textLabel.text = [listOfNames objectAtIndex:indexPath.section];  //listOfNames is the NSMutableArray that contains list of person names
   
   }
   
   else {
   
       cell.textLabel.text = [listOfIDs objectAtIndex:indexPath.section];  //listOfIDs is the NSMutableArray that contains list of person ID's
   
   }
   
   return cell;
   

So, finally i got the view showed in the above image.

When i press on the UISegmentedControl buttons, the table view reloads its cells & showing corresponding values perfectly. By default, the “Department” button was selected. If i tap the “Name” button(that is, table will show 6 cells instead of 3), The table changes immediately without any animations. It simply hide 3 cells of department names and showing 6 cells that displaying names of persons without any animations. I could not find a way to making the cell changes with smooth animations.

What should i implement to achieve the smooth animations?

Thanks in Advance

Answer 1

Use insertRowsAtIndexPaths:withRowAnimation: and deleteRowsAtIndexPaths:withRowAnimation: methods which has options for specifying some build-in cool animations.

typedef enum {
    UITableViewRowAnimationFade,
    UITableViewRowAnimationRight,    
    UITableViewRowAnimationLeft,
    UITableViewRowAnimationTop,
    UITableViewRowAnimationBottom,
    UITableViewRowAnimationNone,        
    UITableViewRowAnimationMiddle,      
} UITableViewRowAnimation;