iOS: Table reload altering layout

Question

I have UI that has a UITableView and another View. The UITableView has collapsible sections as shown in this sample code. Upon loading it looks like this:

The user can use a swipe gesture to expand the gray view on the right. I'm just changing origin of the gray view and using an animation to achieve this. So then it looks like this:

However, when I close a section of the UITableView, the UI seems to "reset" and snap back to it's original layout:

I would like to for the gray view to remain where it is when I open or close a section of my UITableView. How can I achieve this?

The code for my ViewController is below:

#import "BooklistMaster.h"
#import "BooklistDetailViewController.h"
#import "Booklist.h"
#import "BooklistTitleCell.h"
#import "BooklistTitle.h"
#import "BooklistDetailHeaderView.h"
#import "BooklistDetailSectionInfo.h"
#import "BooklistDetailHandler.h"

static NSString *SectionHeaderViewIdentifier = @"SectionHeaderViewIdentifier";

@interface BooklistDetailViewController ()

@property (nonatomic) NSMutableArray *sectionInfoArray;
@property (nonatomic) NSIndexPath *pinchedIndexPath;
@property (nonatomic) NSInteger openSectionIndex;
@property (nonatomic) CGFloat initialPinchHeight;

@property (nonatomic) IBOutlet BooklistDetailHeaderView *sectionHeaderView;

// use the uniformRowHeight property if the pinch gesture should change all row heights simultaneously
@property (nonatomic) NSInteger uniformRowHeight;


@end

//#define DEFAULT_ROW_HEIGHT 88
#define HEADER_HEIGHT 48

@implementation BooklistDetailViewController

@synthesize listTitleLabel;
@synthesize backButton;
@synthesize booklistMaster;
@synthesize titleBarView;
@synthesize searchBar;
@synthesize tap;
@synthesize booklistId;
@synthesize booklistName;
@synthesize spinner;
@synthesize detailPaneFocused;
@synthesize detailView;
@synthesize swipeLeft;
@synthesize swipeRight;
@synthesize tableView;

- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
{
    self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
    if (self) {
        // Custom initialization
    }
    return self;
}

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    [self.view sendSubviewToBack:tableView];
    detailPaneFocused=NO;
    listTitleLabel.text = booklistName;
    [spinner startAnimating];
    [spinner setHidden:NO];
     [titleBarView setBackgroundColor:[UIColor colorWithRed:.77647 green:.77647 blue:.79607 alpha:1]];

    tap = [[UITapGestureRecognizer alloc]
           initWithTarget:self
           action:@selector(dismissKeyboard)];
    [tap setCancelsTouchesInView:YES];

    swipeLeft = [[UISwipeGestureRecognizer alloc]initWithTarget:self action:@selector(didSwipeLeft:)];
    [swipeLeft setDirection:UISwipeGestureRecognizerDirectionLeft];
    [detailView addGestureRecognizer:swipeLeft];

    swipeRight = [[UISwipeGestureRecognizer alloc]initWithTarget:self action:@selector(didSwipeRight:)];
    [swipeRight setDirection:UISwipeGestureRecognizerDirectionRight];
    [detailView addGestureRecognizer:swipeRight];


    // Set up default values.
    self.tableView.sectionHeaderHeight = HEADER_HEIGHT;
    /*
     The section info array is thrown away in viewWillUnload, so it's OK to set the default values here. If you keep the section information etc. then set the default values in the designated initializer.
     */
   // self.uniformRowHeight = DEFAULT_ROW_HEIGHT;
    self.openSectionIndex = NSNotFound;

    UINib *sectionHeaderNib = [UINib nibWithNibName:@"BooklistDetailSectionHeaderView" bundle:nil];
    [self.tableView registerNib:sectionHeaderNib forHeaderFooterViewReuseIdentifier:SectionHeaderViewIdentifier];

    self.tableView.tableFooterView = [[UIView alloc] initWithFrame:CGRectZero];

    BooklistDetailHandler *handler = [[BooklistDetailHandler alloc] initForController:self];
    [handler getBooklistForId:booklistId];
}


-(void)didSwipeRight:(UISwipeGestureRecognizer *)recognizer{
    if (detailPaneFocused==YES) {
        detailPaneFocused=NO;
        [UIView animateWithDuration:.3
                         animations:^ {
                             CGRect newBounds = self.detailView.frame;
                             newBounds.origin.x += 200;
                             self.detailView.frame = newBounds;
                             [self.detailView layoutSubviews];


                         }];
    }
}

-(void)didSwipeLeft:(UISwipeGestureRecognizer *)recognizer{
    if (detailPaneFocused==NO) {
        detailPaneFocused=YES;
        [UIView animateWithDuration:.3
                         animations:^ {
                             CGRect newBounds = self.detailView.frame;
                             newBounds.origin.x -= 200;
                             self.detailView.frame = newBounds;
                             [self.detailView layoutSubviews];


                         }];
    }
}

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

- (void)viewWillAppear:(BOOL)animated {

    [super viewWillAppear:animated];


}
- (IBAction)buttonPressed:(id)sender {

    [[self navigationController]  popViewControllerAnimated:YES];
}

-(void)dismissKeyboard {
    [searchBar resignFirstResponder];
}

- (void)searchBarSearchButtonClicked:(UISearchBar *)searchBar
{
    [self dismissKeyboard];

}
-(void)searchBarTextDidBeginEditing:(UISearchBar *)searchBar{
    [self.view addGestureRecognizer:tap];

    [UIView animateWithDuration:.3
                     animations:^ {
                         CGRect newBounds = self.searchBar.frame;
                         newBounds.size.width += 200; //newBounds.size.width -= 215; to contract
                         newBounds.origin.x -= 200;
                         self.searchBar.frame = newBounds;
                         [self.searchBar layoutSubviews];
                     }];


}
-(void)searchBarTextDidEndEditing:(UISearchBar *)searchBar{
    [self.view removeGestureRecognizer:tap];
    [UIView animateWithDuration:.3
                     animations:^ {
                         CGRect newBounds = self.searchBar.frame;
                         newBounds.size.width -= 200; //newBounds.size.width -= 215; to contract
                         newBounds.origin.x += 200;
                         self.searchBar.frame = newBounds;
                         [self.searchBar layoutSubviews];
                     }];
}

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
    return booklistMaster.subLists.count;
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
//    Booklist *list = [booklistMaster.subLists objectAtIndex:section];
//    return list.booklistTitles.count;

    BooklistDetailSectionInfo *sectionInfo = (self.sectionInfoArray)[section];
    NSInteger numStoriesInSection = sectionInfo.booklist.booklistTitles.count;

    return sectionInfo.open ? numStoriesInSection : 0;
}

//- (NSArray *)sectionIndexTitlesForTableView:(UITableView *)tableView{
//    
//    NSMutableArray *array = [[NSMutableArray alloc] init];
//    for (Booklist *list in booklistMaster.subLists) {
//        [array addObject:@"a"];
//    }
//    
//    return array;
//    
//}
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{
    BooklistDetailHeaderView *sectionHeaderView = [self.tableView dequeueReusableHeaderFooterViewWithIdentifier:SectionHeaderViewIdentifier];

    BooklistDetailSectionInfo *sectionInfo = (self.sectionInfoArray)[section];
    sectionInfo.headerView = sectionHeaderView;

    sectionHeaderView.titleLabel.text = sectionInfo.booklist.listName;
    sectionHeaderView.section = section;
    sectionHeaderView.delegate = self;

    return sectionHeaderView;

}

//- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section{
//    
//}
//- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
//    
//  BooklistDetailSectionInfo *sectionInfo = (self.sectionInfoArray)[indexPath.section];
//    return [[sectionInfo objectInRowHeightsAtIndex:indexPath.row] floatValue];
//    // Alternatively, return rowHeight.
//}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{



    BooklistTitleCell *cell = [tableView dequeueReusableCellWithIdentifier:@"BooklistTitleCell" forIndexPath:indexPath];

    Booklist *booklist = [booklistMaster.subLists objectAtIndex:indexPath.section];
    BooklistTitle *booklistTitle = [booklist.booklistTitles objectAtIndex:indexPath.row];
    cell.titleLabel.text=booklistTitle.title;

    return cell;
}

- (void)sectionHeaderView:(BooklistDetailHeaderView *)sectionHeaderView sectionOpened:(NSInteger)sectionOpened {

    BooklistDetailSectionInfo *sectionInfo = (self.sectionInfoArray)[sectionOpened];

    sectionInfo.open = YES;

    /*
     Create an array containing the index paths of the rows to insert: These correspond to the rows for each quotation in the current section.
     */
    NSInteger countOfRowsToInsert = sectionInfo.booklist.booklistTitles.count;
    NSMutableArray *indexPathsToInsert = [[NSMutableArray alloc] init];
    for (NSInteger i = 0; i < countOfRowsToInsert; i++) {
        [indexPathsToInsert addObject:[NSIndexPath indexPathForRow:i inSection:sectionOpened]];
    }

    /*
     Create an array containing the index paths of the rows to delete: These correspond to the rows for each quotation in the previously-open section, if there was one.
     */
    NSMutableArray *indexPathsToDelete = [[NSMutableArray alloc] init];

    NSInteger previousOpenSectionIndex = self.openSectionIndex;
    if (previousOpenSectionIndex != NSNotFound) {

        BooklistDetailSectionInfo *previousOpenSection = (self.sectionInfoArray)[previousOpenSectionIndex];
        previousOpenSection.open = NO;
        [previousOpenSection.headerView toggleOpenWithUserAction:NO];
        NSInteger countOfRowsToDelete = previousOpenSection.booklist.booklistTitles.count;
        for (NSInteger i = 0; i < countOfRowsToDelete; i++) {
            [indexPathsToDelete addObject:[NSIndexPath indexPathForRow:i inSection:previousOpenSectionIndex]];
        }
    }

    // style the animation so that there's a smooth flow in either direction
    UITableViewRowAnimation insertAnimation;
    UITableViewRowAnimation deleteAnimation;
    if (previousOpenSectionIndex == NSNotFound || sectionOpened < previousOpenSectionIndex) {
        insertAnimation = UITableViewRowAnimationTop;
        deleteAnimation = UITableViewRowAnimationBottom;
    }
    else {
        insertAnimation = UITableViewRowAnimationBottom;
        deleteAnimation = UITableViewRowAnimationTop;
    }

    // apply the updates
    [self.tableView beginUpdates];
    [self.tableView insertRowsAtIndexPaths:indexPathsToInsert withRowAnimation:insertAnimation];
    [self.tableView deleteRowsAtIndexPaths:indexPathsToDelete withRowAnimation:deleteAnimation];
    [self.tableView endUpdates];

    self.openSectionIndex = sectionOpened;
}

- (void)sectionHeaderView:(BooklistDetailHeaderView *)sectionHeaderView sectionClosed:(NSInteger)sectionClosed {

    /*
     Create an array of the index paths of the rows in the section that was closed, then delete those rows from the table view.
     */
    BooklistDetailSectionInfo *sectionInfo = (self.sectionInfoArray)[sectionClosed];

    sectionInfo.open = NO;
    NSInteger countOfRowsToDelete = [self.tableView numberOfRowsInSection:sectionClosed];

    if (countOfRowsToDelete > 0) {
        NSMutableArray *indexPathsToDelete = [[NSMutableArray alloc] init];
        for (NSInteger i = 0; i < countOfRowsToDelete; i++) {
            [indexPathsToDelete addObject:[NSIndexPath indexPathForRow:i inSection:sectionClosed]];
        }
        [self.tableView deleteRowsAtIndexPaths:indexPathsToDelete withRowAnimation:UITableViewRowAnimationTop];
    }
    self.openSectionIndex = NSNotFound;
}

-(void)setMasterBooklist:(BooklistMaster *)list{
    booklistMaster=list;
    /*
     Check whether the section info array has been created, and if so whether the section count still matches the current section count. In general, you need to keep the section info synchronized with the rows and section. If you support editing in the table view, you need to appropriately update the section info during editing operations.
     */
    if ((self.sectionInfoArray == nil) ||
        ([self.sectionInfoArray count] != [self numberOfSectionsInTableView:self.tableView])) {

        // For each play, set up a corresponding SectionInfo object to contain the default height for each row.
        NSMutableArray *infoArray = [[NSMutableArray alloc] init];

        for (Booklist *list in self.booklistMaster.subLists) {

            BooklistDetailSectionInfo *sectionInfo = [[BooklistDetailSectionInfo alloc] init];
            sectionInfo.booklist = list;
            sectionInfo.open = NO;

            // NSNumber *defaultRowHeight = @(DEFAULT_ROW_HEIGHT);
            NSInteger countOfTitles = sectionInfo.booklist.booklistTitles.count;
            for (NSInteger i = 0; i < countOfTitles; i++) {
                //[sectionInfo insertObject:defaultRowHeight inRowHeightsAtIndex:i];
            }

            [infoArray addObject:sectionInfo];
        }

        self.sectionInfoArray = infoArray;
    }
    [spinner stopAnimating];
    [spinner setHidden:YES];
    [self.tableView reloadData];
}

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
//    if (detailPaneFocused==NO){
//        [self focusDetailPane];
//    }
}
- (NSIndexPath *)tableView:(UITableView *)tableView willSelectRowAtIndexPath:(NSIndexPath *)indexPath{
    if (detailPaneFocused==NO&&![indexPath isEqual:[tableView indexPathForSelectedRow]]){
        [self focusDetailPane];
    }
    return indexPath;
}

- (void)focusDetailPane{
    detailPaneFocused=YES;
    [UIView animateWithDuration:.3
                     animations:^ {
                         CGRect newBounds = self.detailView.frame;
                         newBounds.origin.x -= 200;
                         self.detailView.frame = newBounds;
                         [self.detailView layoutSubviews];

                     }];
}


@end

Answer 1

This is due to auto layout. If you change any frames directly with auto layout turned on, the views will revert to the positions defined by their constraints as soon as the view has to update itself. You should do your animation by making an IBOutlet to any constraints you want to change, and adjust their constant value in code (either that, or turn off auto layout).