• Stars
    star
    115
  • Rank 305,916 (Top 7 %)
  • Language
    Objective-C
  • License
    MIT License
  • Created over 10 years ago
  • Updated over 10 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Example of how to create a UITableView HeaderView which sticks to the top and stretches.

License MIT Build Platform Build Version

StickyHeaderView

Example of how to create a UITableView HeaderView which sticks to the top and stretches when you pull down. Kind of like the app Tinder does.

alt text

Install

If you want to use the header view with the integrated scrollview like in the code simply copy HeaderView.h and HeaderView.m into your project and use it accordingly.

Getting Started

Basically you set up a header view for your UITableView:

- (void)createHeaderView
{
    _headerView = [[HeaderView alloc]initWithFrame:HEADER_INIT_FRAME];
    _headerView.delegate = self;
    [_tableView setTableHeaderView:_headerView];
}

And then tell the header view to react accordingly depending on the table views content offset:

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    float delta = 0.0f;
    CGRect rect = HEADER_INIT_FRAME;
    
    // Only allow the header to stretch if pulled down
    if (_tableView.contentOffset.y < 0.0f)
    {
        // Scroll down
        delta = fabs(MIN(0.0f, _tableView.contentOffset.y));
    }

    rect.origin.y -= delta;
    rect.size.height += delta;

    [_headerView updateFrame:rect];
}

The header view can be tapped and will expand to full screen and vice versa.

This is really simple. Check out the code for more.