Question

I’m using the following code to hide a view and the space taken by the view based on a condition in viewWillAppear:

- (void)viewWillAppear:(BOOL)animated {

    Data* data = [Data shared];

    if (data.something == 0) {

        CGRect frame = self.tableView.tableHeaderView.frame;
        frame.size.height = 0;
        self.tableView.tableHeaderView.frame = frame;

        self.tableView.tableHeaderView.hidden = YES;

    } else {

        CGRect frame = self.tableView.tableHeaderView.frame;
        frame.size.height = 44;
        self.tableView.tableHeaderView.frame = frame;

        self.tableView.tableHeaderView.hidden = NO;

    }

}

The above code works, but I’m pretty sure that is not the right way to do that. I tried to set the tableHeaderView to nil, but once the code is called, the headerView is gone until the UITableView is destroyed (I think I can fix it using a IBOutlet to the tableHeader, but doesn’t sounds right too.

UPDATE1: another try, but the code doesn’t work:

- (CGFloat)tableView:(UITableView*)tableView heightForHeaderInSection:(NSInteger)section {
   self.tableView.tableHeaderView.hidden = YES;
   return 0; 
}

Answer 1

The data source method tableView:heightForHeaderInSection: actually has nothing to do with the view that is associated with the table view’s tableViewHeader property. There are two different types of headers here, the one header at the top of the tableView, in which can be placed things like a search bar, and the multiple headers that can be made to occur one per section within the table view.

To my knowledge, the tableViewHeader view is typically configured in the nib file, and I don’t know that the table view calls any data source methods that allow any configuration for it, so you would have to do it manually. Frankly, if your code works, that would be a good way to do it. Hiding it would make the table view still act as if it’s there…removing it entirely makes it so you can’t get it back because it gets deallocated.

(However, as you said, you could use an IBOutlet pointing to the header view, as long as you make it a strong reference, and then you could somehow reinsert it into the table later. …Hm, although the mechanics of how you add a view into the table view’s scroll view, and position it correctly, is probably just annoying.)

My only suggestion would be animating the frame height to zero so you get a nice transition effect, something like animateWithDuration. But yeah, I would say you have the best method figured out already.

EDIT:

Code, you say? I take that as a challenge 🙂

- (void)setTableViewHeaderHidden:(BOOL)hide
{

    // Don't want to muck things up if we are mid an animation.
    if (self.isAnimatingHeader) {
        return;
    }

    // This is our IBOutlet property, I am just saving a bit of typing.
    UIView *theHeader = self.theHeaderView;

    if (hide) {

        // Save the original height into the tag, should only be done once.
        if (!theHeader.tag) {
            theHeader.tag = theHeader.frame.size.height;
        }

        // Transform and hide
        if (theHeader.frame.size.height > 0) {

            self.isAnimatingHeader = YES;

            // New frame...
            CGRect frame = theHeader.frame;
            frame.size.height = 0;

            // Figure out some offsets here so we prevent jumping...
            CGPoint originalOffset = self.tableView.contentOffset;

            CGPoint animOffset = originalOffset;
            animOffset.y += MAX(0, theHeader.tag - animOffset.y);

            CGPoint newOffset = originalOffset;
            newOffset.y = MAX(0, newOffset.y - theHeader.tag);

            // Perform the animation
            [UIView animateWithDuration:0.35
                                  delay:0.0
                                options: UIViewAnimationCurveEaseOut
                             animations:^{
                                 theHeader.frame = frame;
                                 self.tableView.contentOffset = animOffset;
                             }
                             completion:^(BOOL finished){
                                 if (finished) {

                                     // Hide the header
                                     self.tableView.tableHeaderView = nil;
                                     theHeader.hidden = YES;

                                     // Shift the content offset so we don't get a jump
                                     self.tableView.contentOffset = newOffset;

                                     // Done animating.
                                     self.isAnimatingHeader = NO;

                                 }
                             }
             ];

        }

    } else {

        // Show and transform
        if (theHeader.frame.size.height < theHeader.tag) {

            self.isAnimatingHeader = YES;

            // Set the frame to the original before we transform, so that the tableview corrects the cell positions when we re-add it.
            CGRect originalFrame = theHeader.frame;
            originalFrame.size.height = theHeader.tag;
            theHeader.frame = originalFrame;

            // Show before we transform so that you can see it happen
            self.tableView.tableHeaderView = theHeader;
            theHeader.hidden = NO;

            // Figure out some offsets so we don't get the table jumping...
            CGPoint originalOffset = self.tableView.contentOffset;

            CGPoint startOffset = originalOffset;
            startOffset.y += theHeader.tag;
            self.tableView.contentOffset = startOffset; // Correct for the view insertion right off the bat

            // Now, I don't know if you want the top header to animate in or not. If you think about it, you only *need* to animate the header *out* because the user might be looking at it. I figure only animate it in if the user is already scrolled to the top, but hey, this is open to customization and personal preference.

            if (self.animateInTopHeader && originalOffset.y == 0) {

                CGPoint animOffset = originalOffset;

                // Perform the animation
                [UIView animateWithDuration:0.35
                                      delay:0.0
                                    options: UIViewAnimationCurveEaseIn
                                 animations:^{
                                     self.tableView.contentOffset = animOffset;

                                 }
                                 completion:^(BOOL finished){
                                     // Done animating.
                                     self.isAnimatingHeader = NO;
                                 }
                 ];

            } else {
                self.isAnimatingHeader = NO;
            }

        }

    }
}

Built this in the table view template that comes with Xcode. Just to throw it together I used a UILongPressGestureRecognizer with the selector outlet pointing to this method:

- (IBAction)longPress:(UIGestureRecognizer *)sender
{
    if (sender.state != UIGestureRecognizerStateBegan) {
        return;
    }
    if (self.hidingHeader) {
        self.hidingHeader = NO;
        [self setTableViewHeaderHidden:NO];
    } else {
        self.hidingHeader = YES;
        [self setTableViewHeaderHidden:YES];
    }

}

And, I added these to my header:

@property (strong, nonatomic) IBOutlet UIView *theHeaderView;
@property (nonatomic)         BOOL                       hidingHeader;
@property (nonatomic)         BOOL                       isAnimatingHeader;
@property (nonatomic)         BOOL                       animateInTopHeader;

- (IBAction)longPress:(id)sender;

Anyway, it works great. What I did discover is that you definitely have to nil out the table view’s reference to the header view or it doesn’t go away, and the table view will shift the cells’ position based on the height of the frame of the header when it is assigned back into its header property. Additionally, you do have to maintain a strong reference via your IBOutlet to the header or it gets thrown away when you nil out the table view’s reference to it.

Cheers.