最近加班加的比較多旨袒，再加上這個(gè)真的比較考驗(yàn)邏輯瓣铣，所以一段時(shí)間都沒(méi)寫(xiě)東西了炮叶。來(lái)說(shuō)說(shuō)這次的功能碗旅，網(wǎng)上有很多類(lèi)似的demo，但都是分開(kāi)實(shí)現(xiàn)的镜悉，我把這兩個(gè)功能放到了一起扛芽，并且沒(méi)有使用AutoLayout,沒(méi)有用KVO,沒(méi)有用storyboard/xib.除了邏輯有點(diǎn)繞(現(xiàn)在不是流行玩算法么,那就搞的難理解點(diǎn)吧。积瞒。川尖。),其他的還是簡(jiǎn)單易懂的,而且我將重點(diǎn)數(shù)字使用的宏定義，擴(kuò)展性很強(qiáng)茫孔。
先來(lái)看看效果吧叮喳。
講講大概的實(shí)現(xiàn)思路：
1?創(chuàng)建頭部的視圖和tableview,需要注意的是tableview要設(shè)置contentInset,contentInsent 的頂部要和頭部視圖的背景圖的高度一樣，否則會(huì)有空隙(或是有遮擋)缰贝。
myTableView.contentInset = UIEdgeInsetsMake(headRect.size.height-navHeight-navHeight, 0, 0, 0);
2?對(duì)頭部視圖的背景圖片的尺寸進(jìn)行處理,當(dāng)然,你也可以直接找一個(gè)適合尺寸的圖片,就不用處理圖片了,為了增加程序的擴(kuò)展性,我就隨便選了張圖馍悟，并進(jìn)行圖片尺寸處理。
UIImage * image = [UIImage imageNamed:name];
UIImage * newImg = [self image:image byScalingToSize:self.bounds.size];
backgroundView.image = newImg;
backgroundView.clipsToBounds = YES;//切掉圖片多余的部分
//處理圖片方法
- (UIImage *)image:(UIImage*)image byScalingToSize:(CGSize)targetSize {
UIImage *sourceImage = image;
UIImage *newImage = nil;
UIGraphicsBeginImageContext(targetSize);
CGRect thumbnailRect = CGRectZero;
thumbnailRect.origin = CGPointZero;
thumbnailRect.size.width = targetSize.width;
thumbnailRect.size.height = targetSize.height;
[sourceImage drawInRect:thumbnailRect];
newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return newImage ;
}
3.搞定了這些剩晴，準(zhǔn)備工作就完成了锣咒，接下來(lái)，一個(gè)方法實(shí)現(xiàn)我們的下拉放大赞弥、上推縮小的功能毅整，當(dāng)然，重點(diǎn)和難點(diǎn)是邏輯绽左，技術(shù)很easy悼嫉。大家都知道UITableView是繼承UIScrollView的，利用UIScrollView的代理方法- (void)scrollViewDidScroll:(UIScrollView *)scrollView;來(lái)實(shí)現(xiàn)拼窥。
下拉放大
在這個(gè)方法中戏蔑，我們將功能分為兩部分蹋凝，一個(gè)是下拉放大，這個(gè)是比較容易的总棵，就是對(duì)頭部視圖的背景圖進(jìn)行放大鳍寂，調(diào)整frame，需要注意的是在此需要調(diào)整圖片的顯示方式情龄，因?yàn)橄吕蜕贤浦袌D片顯示的方式是不同的伐割，否則即使你調(diào)整了frame，也不會(huì)按frame來(lái)顯示的刃唤。
_myView.backgroundView.contentMode = UIViewContentModeScaleToFill;
_myView.backgroundView.frame = CGRectMake(offset_Y*0.5 , -navHeight, VCWidth - offset_Y, headRect.size.height - offset_Y);
上推移動(dòng)縮小
這個(gè)就比較難理解了隔心，當(dāng)然，我說(shuō)的是中間對(duì)frame的算法尚胞，我們將三個(gè)視圖分開(kāi)說(shuō)硬霍。
- 背景圖:先切換顯示模式,然后將y隨著tableview偏移移動(dòng)到0,高度也是隨著tableview偏移,最終移動(dòng)到需要的高度（Demo留的是44）
_myView.backgroundView.contentMode = UIViewContentModeTop;
_myView.backgroundView.frame = CGRectMake(0 ,navHeight* offset_Y/(headRect.size.height-navHeight-navHeight)-navHeight; , VCWidth , headRect.size.height -(navHeight + navHeight* offset_Y/(headRect.size.height-navHeight-navHeight)-navHeight;) - offset_Y);
- 頭像:頭像需要隨著tableview的偏移而移動(dòng)自身的位置,并且還要進(jìn)行縮小。這里面就是一個(gè)線性方程的關(guān)系,和上面的的背景圖是一樣的笼裳。
CGFloat width = offset_Y*(40-(VCWidth / 4))/(headRect.size.height-navHeight-navHeight)+(VCWidth / 4);
_myView.headView.frame =CGRectMake(0, 0, width,width);
_myView.headView.layer.cornerRadius =width*0.5;
_myView.headView.center = _myView.backgroundView.center;
- 簽名:簽名比較簡(jiǎn)單,只要跟著頭像動(dòng)就行,然后再根據(jù)偏移調(diào)整自己的透明度就行了唯卖。
_myView.signLabel.frame =CGRectMake(0, CGRectGetMaxY(_myView.headView.frame), VCWidth, 40);
_myView.signLabel.alpha = 1 - (offset_Y*3 / (headRect.size.height-navHeight-navHeight) /2);
然后就大功告成了,里的的邏輯挺麻煩的,但有初中的數(shù)學(xué)水平就夠了,因?yàn)槎贾皇呛?jiǎn)單的線性關(guān)系。最后是Demo,歡迎大家Star.
