知乎状态栏滚动效果
2017-08-17 本文已影响1人
zgsddzwj
项目中要实现知乎三个状态栏类似的效果,网上搜了一片并没有找到合适的,只能自己写了。
主要思想是利用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的滑动来实现,回头有时间了整理下。