iOS:tableView表頭下拉放大的效果

現在很多app設置了這樣的效果,如何實現這一效果呢,其實只需要簡單的兩個方法,那么我們直接上代碼

首先我們在storyBoard里拖一個tableView並設置Navigation,接下來我們在tableView中設置圖片
我是自己寫了個方法然后在viewDidLoad中調用,也可以直接在viewDidLoad中設置

 UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, 200)]; [imageView sd_setImageWithURL:[NSURL URLWithString:self.goods.image_default] placeholderImage:[UIImage imageNamed:@"crazy"]]; self.tableView.tableHeaderView =  imageView;

方法一：

//scrollView的方法視圖滑動時 實時調用
- (void)scrollViewDidScroll:(UIScrollView *)scrollView { CGFloat width = self.view.frame.size.width; // 圖片寬度
    CGFloat yOffset = scrollView.contentOffset.y; // 偏移的y值
    if(yOffset < 0) {CGFloat totalOffset = 200 + ABS(yOffset); CGFloat f = totalOffset / 200; //拉伸后的圖片的frame應該是同比例縮放。
        self.tableView.tableHeaderView.frame =  CGRectMake(- (width *f-width) / 2, yOffset, width * f, totalOffset); } }

方法二：

-(void)scrollViewDidScroll:(UIScrollView *)scrollView{ //獲取偏移量
    CGPoint offset = scrollView.contentOffset; //判斷是否改變
    if (offset.y < 0) { CGRect rect = self.tableView.tableHeaderView.frame; //我們只需要改變圖片的y值和高度即可
        rect.origin.y = offset.y; rect.size.height = 200 - offset.y; self.tableView.tableHeaderView.frame = rect; } }

效果如下：