码迷,mamicode.com
首页 > 移动开发 > 详细

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

时间:2016-04-16 00:47:50      阅读:463      评论:0      收藏:0      [点我收藏+]

标签:

现在很多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;
    }
}

效果如下:

技术分享 技术分享

 

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

标签:

原文地址:http://www.cnblogs.com/XYQ-208910/p/5397333.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!