Expand and collapse method for tableview in iOS - ios

Question

I created one tableview with 2 section and i displayed the array of the data in the tableview .. now i want to expand and collapse the section…
i am just a beginner please give any sample code for expand and collapse the tableview section…
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
return 2;
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
return [arraytable count];
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
static NSString *cellitem = #"simpletableitem";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellitem];
if (!cell) {
cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellitem];
}
cell.textLabel.text = [arraytable objectAtIndex:[indexPath row]];
return cell;
}
This is my cellForRowAtIndexPath and arraytable is my array i give it in view did load
arraytable = #[#"hari12",#"narayanan",#"Praba",#"Deepak",#"Sailesh",#"Ram charan"];

Answer 1

Here's a sample code I've made to achieve what you want.
You can use this as a general guideline, since there are plenty of ways to achieve this, other than what I've done.
I've noticed from your example above that you have a table view with 2 sections, so this is what I'll use for the sample code.
There are maybe better ways to implement the below, but that was at the top of my head, and I think it's pretty simple and straightforward.
I've also included explanations as comments in the code below.
Note that you'll probably need to change some variables' names to fit your code (such as self.tableView, if you use something else) and section1DataArray, section2DataArray
// I've declared 2 BOOL properties to hold whether each section is visible or not
#interface ViewController ()
#property (nonatomic) BOOL section1visible, section2visible;
#end
-(void)viewDidLoad {
// After creating the table view, I've set the footer view frame to CGRectZero,
// so when a table view is collapsed you won't have the table columns 'bounds'
self.tableView.tableFooterView = [[UIView alloc] initWithFrame: CGRectZero];
}
// Then I've created a custom header for each table since I've wanted to make the header
// name a button which collapse/expand the table view.
-(CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section {
// Here I've set the height arbitrarily to be 50 points
return 50;
}
-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
// Change the below frame to fit your needs. In my example, I've used a table view
// to be at the width of the screen, and the height of 50 points (as we've set above)
UIView *header = [[UIView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 50)];
// Then create a button
// I've arbitrarily chosen a size of 100x20 and created a frame to be placed in the
// middle of the above header
UIButton *button = [[UIButton alloc] initWithFrame:CGRectMake(header.frame.size.width/2 - 50, header.frame.size.height/2 - 10, 100, 20)];
// Now I'm setting the tag (for later use) and title of each button
if(section == 0) { // First section
[button setTitle:#"Section 1" forState:UIControlStateNormal];
button.tag = 0;
} else { // Else, second section, since we only have two
[button setTitle:#"Section 2" forState:UIControlStateNormal];
button.tag = 1;
}
// I've arbitrarily chose to set the button colour to gray colour
button.titleLabel.textColor = [UIColor grayColor];
// Then we need to actually add an action to the button
[button addTarget:self action:#selector(updateTableView:) forControlEvents:UIControlEventTouchUpInside];
// Then we need to add the button to the header view itself
[header addSubview:button];
return header;
}
// Then we need to update our tableView:numberOfRowsInSection: to check for our BOOL value
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
if(section == 0 && self.section1visible) {
return [self.section1DataArray count];
} else if (section == 1 && self.section2visible) {
return [self.section2DataArray count];
} else {
return 0;
}
}
// Then we need to create the actual method the button calls
-(void)updateTableView:(UIButton *)sender {
// Check the button tag, to identify which header button was pressed
NSInteger section = sender.tag;
if(section == 0) {
self.section1visible = !self.section1visible;
} else { // section == 1
self.section2visible = !self.section2visible;
}
// Use an animation to update the UI to create a 'smooth' expand/collapse
[self.tableView reloadSections:[NSIndexSet indexSetWithIndex:section] withRowAnimation:UITableViewRowAnimationFade];
}
Good luck mate.