Animate `UITableView` headers when animating `tableHeaderView` in

Question

For an answer for "How to resize a tableHeaderView of a UITableView?" I created a small project on github, which adds a header view to a UITableView and animates both the newly added header view and the cells underneath it.

However, as soon as I add header cells I get a nasty UI glitch because the headers don't animate along with the cells of the UITableView:

When I add the header the following steps happen:

Problem: The topmost header jumps to the original position
The tableHeaderView and the UITableViewCells animate together to their final position.

So my question is, how I can make sure that the headers also animate.

You can see the effect here, where the Section-1 is at the final position, while the cells and the header view are still animating:

header glitch

This is the method, where I do the animation:

- (void) showHeader:(BOOL)show animated:(BOOL)animated{

    CGRect closedFrame = CGRectMake(0, 0, self.view.frame.size.width, 0);
    CGRect newFrame = show?self.initialFrame:closedFrame;

    if(animated){
        // The UIView animation block handles the animation of our header view
        [UIView beginAnimations:nil context:nil];
        [UIView setAnimationDuration:0.3];
        [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];

        // beginUpdates and endUpdates trigger the animation of our cells
        [self.tableView beginUpdates];
    }

    self.headerView.frame = newFrame;
    [self.tableView setTableHeaderView:self.headerView];

    if(animated){
        [self.tableView endUpdates];
        [UIView commitAnimations];
    }
}

Change the tableview style to grouped and verify. It may solve the issue. — Dee
– Dee, Commented Mar 15, 2013 at 12:55
@Dee This does not solve the issue for me, since I need the floating table view headers — Besi
– Besi, Commented Mar 15, 2013 at 13:20
Found this question, by implementing your animating header and then running into the exact same issue. I'm looking to fix as well, but dont have too much of an idea. — hatunike
– hatunike, Commented Apr 11, 2013 at 22:09

user207616 · Accepted Answer · 2013-04-11 22:50:56Z

6

+50

this will fix it, but I'm not sure if you need the beginUpdates and endUpdates in another part of this class. Because your dataSource don't really change in this example.

- (void)showHeader:(BOOL)show animated:(BOOL)animated {

    CGRect closedFrame = CGRectMake(0, 0, self.view.frame.size.width, 0);
    CGRect newFrame = show?self.initialFrame:closedFrame;

    if(animated){
        // The UIView animation block handles the animation of our header view
        [UIView beginAnimations:nil context:nil];
        [UIView setAnimationDuration:0.3];
        [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];

        // beginUpdates and endUpdates trigger the animation of our cells
        //[self.tableView beginUpdates];
    }

    self.headerView.frame = newFrame;
    [self.tableView setTableHeaderView:self.headerView];

    if(animated){
        //[self.tableView endUpdates];
        [UIView commitAnimations];
    }
}

answered Apr 11, 2013 at 22:50

user207616

Sign up to request clarification or add additional context in comments.

6 Comments

hatunike Over a year ago

This does indeed fix the issue for adding a tableview.tableheader, but when you remove the tableview header the original issue persists.

hatunike Over a year ago

Ok I verified on original project and this does indeed fix the issue entirely. I'm now looking into why my implemented solution only works while showing the header and not while hiding.

user207616 Over a year ago

if you're doing more stuff like updating/adding cells you can try to move the beginUpdates/endUpdates out of this viewAnimation. Either entirely without animation or a different animation block. Maybe this helps ;)

hatunike Over a year ago

Weird. I'm not doing anything else that I can see. Only difference I see between the tableviews is that mine has a custom section header view. That and, the projects tableview is a static tableview and mine's a dynamic one.

LightningStryk Over a year ago

This does not work for me.... It animates the table view but the header just appears over on top. I am using layout constraints on my custom table header view, if that might affect anything.

|

Collectives™ on Stack Overflow

Animate `UITableView` headers when animating `tableHeaderView` in

1 Answer 1

6 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related