前言：上篇文章寫了一個(gè)簡書中心效果，增加了下拉刷新功能筝尾。如有需要可移步捡需。 到這里來
本片文章 Demo地址
本篇文章主要是在原有的基礎(chǔ)效果上增加下拉可以使頭部視圖放大效果，廢話不多說筹淫，先上效果圖
簡書個(gè)人中心效果.gif
看過上個(gè)例子的童鞋應(yīng)該可以看出站辉，在原有的基礎(chǔ)上增加下拉放大頭部視圖功能。
核心代碼
- (NXTableView *)mainTableView{
if (!_mainTableView) {
_mainTableView = [[NXTableView alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, SCREEN_HEIGHT) style:UITableViewStylePlain];
_mainTableView.delegate = self;
_mainTableView.dataSource = self;
_mainTableView.backgroundColor = [UIColor whiteColor];
_mainTableView.showsHorizontalScrollIndicator = NO;
_mainTableView.separatorStyle = UITableViewCellSeparatorStyleNone;
_mainTableView.showsVerticalScrollIndicator = NO;
//table 預(yù)留出需要做放大效果視圖的高度
_mainTableView.contentInset = UIEdgeInsetsMake(200, 0, 0, 0);
// 需要注意的是 創(chuàng)建的頭部視圖的坐標(biāo)损姜，這里以200為高度舉例饰剥。
UIImageView * imageV = [[UIImageView alloc]initWithFrame:CGRectMake(0, -200, SCREEN_WIDTH, 200)];
imageV.image = [UIImage imageNamed:@"m8.jpg"];
//為了達(dá)到我們等比例的放大效果，使用系統(tǒng)的方法UIViewContentModeScaleAspectFill 即可
imageV.contentMode = UIViewContentModeScaleAspectFill;
imageV.tag = 10000;
imageV.backgroundColor = [UIColor redColor];
[_mainTableView addSubview:imageV];
}
return _mainTableView;
}
創(chuàng)建好我們的頭部視圖之后摧阅，這里需要考慮的就是放大的效果了
在scroll的代理方法scrollViewDidScroll:(UIScrollView *)scrollView 里邊進(jìn)行判斷就可以了汰蓉，這里視圖向下偏移了64像素，所以
- (void)scrollViewDidScroll:(UIScrollView *)scrollView{
CGFloat headerOffsetY = -264;預(yù)留高度+偏移的距離
if (tempContentOffsetY < headerOffsetY) {
CGRect rect = [self.mainTableView viewWithTag:10000].frame;
rect.origin.y = tempContentOffsetY+64;
rect.size.height = -(tempContentOffsetY+64);
[self.mainTableView viewWithTag:10000].frame = rect;
}
}
到此效果圖就基本出來了棒卷。感興趣的小伙伴可以移步到我的GitHub里顾孽。 傳送門
