How to display expandable cells when we click on a particular cell in the cursor menu in iOS?

advertisements

In my project, I have added one menu slider like the first screen below, and when I click at row one in that slider menu, I want to show an expandable list like the second image. I tried so much but I can't make it.

My menu slider code:

.h file

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController<UITableViewDelegate,UITableViewDataSource>

@property (nonatomic,strong) UIToolbar *toolBar;
@property (nonatomic,strong) UIView *view1;
@property (nonatomic,strong) IBOutlet UILabel *label1;
@property (nonatomic,strong) IBOutlet UIView *backgroundView;

-(void)menubtn:(UIView *)myView;

@end

----------------------------

.m file

#import "ViewController.h"

@interface ViewController ()
{
    NSMutableArray *items;
    UITableView *tableView1;
}
@end

@implementation ViewController

@synthesize toolBar,view1,label1,backgroundView;

- (void)viewDidLoad {

    [super viewDidLoad];

    items = [[NSMutableArray alloc] initWithObjects:@" Raju",@" Krishna",@" Mahesh",@" Goutham",@" Pawan",@" Honey",@" Bobby",@" Chanti",@"Pandu", nil];

    tableView1.separatorColor = [UIColor lightGrayColor];
    tableView1 = [[UITableView alloc] initWithFrame:CGRectMake(-140, 0, 140, self.view.frame.size.height)];
    tableView1.delegate = self;
    tableView1.dataSource = self;

    [tableView1 registerClass:[UITableViewCell class] forCellReuseIdentifier:@"Cell"];

    [self.view addSubview:tableView1];
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
    return 1;
}

-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return items.count;
}

-(CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section
{
    return 85.0;
}

-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
    UITableViewCell *headerCell = [tableView dequeueReusableCellWithIdentifier:@"Cell"];

    UILabel *headerLabel = [[UILabel alloc] initWithFrame:CGRectMake(45, 55, 100, 21)];
    headerLabel.font = [UIFont boldSystemFontOfSize:17.0];
    headerLabel.text = @"Apple";
    headerLabel.textColor = [UIColor blackColor];
    [headerCell addSubview:headerLabel];

    UIView *underLine = [[UIView alloc] initWithFrame:CGRectMake(0, 85, 140, 2)];
    underLine.backgroundColor = [UIColor lightGrayColor];
    [headerCell addSubview:underLine];

    UIImageView *imgView = [[UIImageView alloc] initWithFrame:CGRectMake(30, 2, 70, 55)];
    imgView.image = [UIImage imageNamed:@"0.jpg"];
    [headerCell addSubview:imgView];

    headerCell.backgroundColor = [UIColor clearColor];

    return headerCell;
}

-(void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
{
    if ([cell respondsToSelector:@selector(setSeparatorInset:)]) {

        [cell setSeparatorInset:UIEdgeInsetsZero];
    }

    // Prevent the cell from inheriting the Table View's margin settings
    if ([cell respondsToSelector:@selector(setPreservesSuperviewLayoutMargins:)]) {
        [cell setPreservesSuperviewLayoutMargins:NO];
    }

    // Explictly set your cell's layout margins
    if ([cell respondsToSelector:@selector(setLayoutMargins:)]) {
        [cell setLayoutMargins:UIEdgeInsetsZero];
    }
}

-(IBAction)menubtn:(id)sender
{
    if (tableView1.frame.origin.x == 0)
    {
        [UIView beginAnimations:nil context:Nil];
        [UIView setAnimationDuration:0.6];
        [UIView setAnimationDelegate:self];

        backgroundView.frame = CGRectMake(0, 0, backgroundView.frame.size.width, backgroundView.frame.size.height);
        [UIView commitAnimations];

        [UIView beginAnimations:nil context:Nil];
        [UIView setAnimationDuration:0.6];
        [UIView setAnimationDelegate:self];

        tableView1.frame = CGRectMake(-140, 0, 140, self.view.frame.size.height);
        [UIView commitAnimations];
    }

    else
    {
        [UIView beginAnimations:nil context:Nil];
        [UIView setAnimationDuration:0.6];
        [UIView setAnimationDelegate:self];

        backgroundView.frame = CGRectMake(140, 0, backgroundView.frame.size.width, backgroundView.frame.size.height);
        [UIView commitAnimations];

        [UIView beginAnimations:nil context:Nil];
        [UIView setAnimationDuration:0.6];
        [UIView setAnimationDelegate:self];

        tableView1.frame = CGRectMake(0, 0, 140, self.view.frame.size.height);
        [UIView commitAnimations];

    }
}

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString *CellIdentifier = @"cell";

    UITableViewCell *Cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (Cell == Nil)
    {
        Cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
    }

    Cell.textLabel.text = [items objectAtIndex:indexPath.row];
    Cell.textLabel.textAlignment = NSTextAlignmentCenter;
    Cell.textLabel.textColor = [UIColor blackColor];
    Cell.textLabel.font = [UIFont boldSystemFontOfSize:17.0];

    view1.backgroundColor = [UIColor orangeColor];
    Cell.selectedBackgroundView = view1;

    UIView* separatorLineView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 380, 2)];/// change size as you need.

    separatorLineView.backgroundColor = [UIColor lightGrayColor];
    // you can also put image here
    [Cell.contentView addSubview:separatorLineView];

    return Cell;
}

-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
    label1.text = [items objectAtIndex:indexPath.row];
    [tableView cellForRowAtIndexPath:indexPath].textLabel.textColor = [UIColor whiteColor];

    [UIView beginAnimations:nil context:Nil];
    [UIView setAnimationDuration:0.6];
    [UIView setAnimationDelegate:self];

    backgroundView.frame = CGRectMake(0, 0, backgroundView.frame.size.width, backgroundView.frame.size.height);
    [UIView commitAnimations];

    [UIView beginAnimations:nil context:Nil];
    [UIView setAnimationDuration:0.6];
    [UIView setAnimationDelegate:self];

    tableView.frame = CGRectMake(-140, 0, 140, self.view.frame.size.height);
    [UIView commitAnimations];
}

-(void)tableView:(UITableView *)tableView didDeselectRowAtIndexPath:(NSIndexPath *)indexPath
{
    [tableView cellForRowAtIndexPath:indexPath].textLabel.textColor = [UIColor blackColor];
}

@end

First screen:

Second screen:

When I click the first on slider menu, I want to expand the cells like below second screen. Please help me.


Use the following code to drop Expandable Cells into a UITableView:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString *CellIdentifier = @"Cell";
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil) {
        cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
    }
    cell.textLabel.text=[[self.arForTable objectAtIndex:indexPath.row] valueForKey:@"name"];
    [cell setIndentationLevel:[[[self.arForTable objectAtIndex:indexPath.row] valueForKey:@"level"] intValue]];
    return cell;
}

Code for expanding & collapsing rows goes in your TableView's DidSelectRow method:

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
    [tableView deselectRowAtIndexPath:indexPath animated:YES];
    NSDictionary *d=[self.arForTable objectAtIndex:indexPath.row];
    if([d valueForKey:@"Objects"]) {
        NSArray *ar=[d valueForKey:@"Objects"];
        BOOL isAlreadyInserted=NO;
        for(NSDictionary *dInner in ar ){
            NSInteger index=[self.arForTable indexOfObjectIdenticalTo:dInner];
            isAlreadyInserted=(index>0 && index!=NSIntegerMax);
            if(isAlreadyInserted) break;
        }
        if(isAlreadyInserted) {
            [self miniMizeThisRows:ar];
        } else {
            NSUInteger count=indexPath.row+1;
            NSMutableArray *arCells=[NSMutableArray array];
            for(NSDictionary *dInner in ar ) {
                [arCells addObject:[NSIndexPath indexPathForRow:count inSection:0]];
                [self.arForTable insertObject:dInner atIndex:count++];
            }
            [tableView insertRowsAtIndexPaths:arCells withRowAnimation:UITableViewRowAnimationLeft];
        }
    }
}

Finally, a method to help minimize-maximize/expand-collapse rows:

-(void)miniMizeThisRows:(NSArray*)ar{
    for(NSDictionary *dInner in ar ) {
        NSUInteger indexToRemove=[self.arForTable indexOfObjectIdenticalTo:dInner];
        NSArray *arInner=[dInner valueForKey:@"Objects"];
        if(arInner && [arInner count]>0){
            [self miniMizeThisRows:arInner];
        }
        if([self.arForTable indexOfObjectIdenticalTo:dInner]!=NSNotFound) {
            [self.arForTable removeObjectIdenticalTo:dInner];
            [self.tableView deleteRowsAtIndexPaths:
              [NSArray arrayWithObject:[NSIndexPath indexPathForRow:indexToRemove inSection:0]]
                      withRowAnimation:UITableViewRowAnimationRight];
        }
    }
}

Download code from here