知乎状态栏滚动效果

项目中要实现知乎三个状态栏类似的效果,网上搜了一片并没有找到合适的,只能自己写了。
主要思想是利用tableView的contentInset和contentOffset,判断向上滑动时,headerview收起,tableview顶部至headerview,向下滑动时headerview展开,tableview顶部至headerView。
注意:tableView一定要在headerView的底层,不然就会盖住headerView,显示不出来。
粘代码:

- (void)viewDidLoad {
      [superviewDidLoad];
      // Do any additional setup after loading the view, typically from a nib.
      self.title=@"我是title";
    **//注意层级关系**
    **[self.viewinsertSubview:self.headerViewatIndex:1];**
    **[self.viewinsertSubview:self.mainTableViewatIndex:0];**
}
-(UIView*)headerView
{
    if(!_headerView)
    {
          _headerView=    [[UIViewalloc]initWithFrame:CGRectMake(0,kNavHeight,kWidth_Screen,kHeaderViewHeight)];
        _headerView.backgroundColor= [UIColororangeColor];
    }
    return_headerView;
}
-(UITableView*)mainTableView
{
    if(!_mainTableView)
    {
    _mainTableView=         [[UITableViewalloc]initWithFrame:CGRectMake(0,kNavHeight,kWidth_Screen,kHeight_Screen-    kHeaderViewHeight)style:UITableViewStylePlain];
    _mainTableView.delegate=self;
    _mainTableView.dataSource=self;
    //tableview默认向下滚动kkHeaderViewHeight
          _mainTableView.contentInset=UIEdgeInsetsMake(kHeaderViewHeight,0,0,0);
  _mainTableView.contentOffset=CGPointMake(0, -kHeaderViewHeight);
    }
    return_mainTableView;
}

#pragma mark - scroll view delegate
-(void)scrollViewWillBeginDragging:(UIScrollView*)scrollView
{
    lastScrollOffsetY= scrollView.contentOffset.y;
}
-(void)scrollViewDidScroll:(UIScrollView*)scrollView
{
    CGFloatoffsetY = scrollView.contentOffset.y;
    if(offsetY <0|| offsetY > scrollView.contentSize.height)
  {
      return;
  }
    if(offsetY >lastScrollOffsetY&& !headerViewHidden)//往上滑动
  {
    //向上滑动,headerview收起,tableview顶部至headerview
    [UIViewanimateWithDuration:.25animations:^{
  **[self.headerViewsetY:kNavHeight-kHeaderViewHeight];**
    **self.mainTableView.contentInset=UIEdgeInsetsMake(0,0,0,0);;**
    }];
    headerViewHidden=YES;
}
else if(offsetY
{
    //向下滑动,headerview展开,tableview顶部至headerView
    [UIViewanimateWithDuration:.25animations:^{
**[self.headerViewsetY:kNavHeight];**
**self.mainTableView.contentInset=UIEdgeInsetsMake(kHeaderView    Height,0,0,0);;**
    }];
    headerViewHidden=NO;
  }
}

git地址:github.com/zgsddzwj/WJScrollViewDemo/
TODO:其实还可以利用KVO监听TableView的滑动来实现,回头有时间了整理下。

推荐阅读更多精彩内容

  • 1.badgeVaule气泡提示 2.git终端命令方法> pwd查看全部 >cd>ls >之后桌面找到文件夹内容...
    i得深刻方得S阅读 2,750评论 0 5
  • 第一版 之前公司做了一个类似于知乎小圆桌的页面,但是写完一直感觉有些地方不够好,所以就拿Swift重新写了一遍,如...
    AppDeveSupport阅读 1,396评论 2 13
  • Day1 Spring 3.0 抛异常:java.lang.ClassNotFoundException: org...
    elon阅读 52评论 0 0
  • 夜色如水,一轮弯月挂在黑色的夜幕中,周边繁星闪烁,黑色的幕布犹如装饰了华丽饰品的衣裳般璀璨动人。皎洁的月光透过打开...
    袍耳阅读 263评论 1 3
  • 在夜里,天很阴沉 看见你躲着月亮 我躲着你,把自己 交给心虚的机缘 忐忑不安,高大的黑影 将你挡在镜子里面 四目相...
    ChocOne阅读 24评论 0 0