簡(jiǎn)介

最近公司項(xiàng)目要求 寫(xiě)一個(gè)個(gè)人主頁(yè) 效果類(lèi)似QQ空間效果

效果圖如下

Untitled.gif

原理

利用 -(void)scrollViewDidScroll:(UIScrollView *)scrollView 這一方法 改變tableviewHeaderView上控件的frame
代碼如下

 CGFloat contentY = scrollView.contentOffset.y;
    CGFloat alpha = contentY / 200.0f;
    _backView.backgroundColor = RGB(255, 217, 70, alpha);
    
    if (contentY < -kBarHeight) {
        //增加的高度
        CGFloat addHeight = - (contentY + kBarHeight);
        //改變系數(shù)
        CGFloat scale = (HeaderHeight + addHeight) / HeaderHeight;
        //改變frame
        CGRect headerFrame = CGRectMake(0, -addHeight, kWidth, HeaderHeight + addHeight);
        self.headerView.frame = headerFrame;
        
        
        CGRect headerImgFrame = CGRectMake(-(kWidth * scale - kWidth)/2.0f, 0, kWidth * scale, HeaderHeight + addHeight);
        
        self.headerBackImg.frame = headerImgFrame;
        
        
        CGRect avatarFrame = CGRectMake(15, self.headerView.bounds.size.height - 80 - 15, 80 , 80);
        self.avatarImg.frame = avatarFrame;
        
        
    }

這樣實(shí)現(xiàn)了頭部的拉伸

github地址: https://github.com/321zhangyang/tableViewHeaderAnimationLikeQQ.git