美文网首页
tableview的headerView拉伸放大模糊

tableview的headerView拉伸放大模糊

作者: MarkDD | 来源:发表于2016-02-21 21:54 被阅读1474次

    经常看到一些app有headerView拉伸放大的效果,自己做了个,代码量很少,先上效果图

    拉伸效果图

          首先就是在-viewDidLoad-里初始化tableView,这里就不再一一阐述了。下面就开始往headerView里面添加要拉伸的图片。

           第一步就是初始化imageView,代码如下:

    self.imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, self.tableView.bounds.size.width, imageHeight)];

    self.imageView.contentMode = UIViewContentModeScaleAspectFit;

    self.imageView.image = [UIImage imageWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"Acme_Monogram_Colour.png" ofType:nil]];

          这里使用加载图片使用imageWithContentsOfFile,用到时再加载,相比imageNamed长期存储于内存中,要节省内存,不过加载时间相对来说会长一点,但不影响。

          第二步:初始化一个空白的view,frame和上步初始化的imageViewframe相同,并添加上步的imageView,

    UIView* view = [[UIView alloc] initWithFrame:self.imageView.frame];

    [view addSubview:self.imageView];

    self.tableView.tableHeaderView = view;

          现在整个demo的初始化已经完成,headerView拉伸放大,是tableView滑动时的效果,所以判断计算在-(void)scrollViewDidScroll:(UIScrollView*)scrollView这个方法中实现:

    CGFloat offsetY = scrollView.contentOffset.y;

    if (offsetY < 0) {

    CGRect rect = self.imageView.frame;

    rect.origin.y = offsetY;

    rect.size.height = imageHeight - offsetY;

    self.imageView.frame = rect;

    }

    首先获取tableView相对于屏幕的偏移量的y,当往下拉y<0时获取headerView中imageView的frame,使其y方向起点坐标一直=偏移y值,即imageView起点相对于屏幕不变,imageHeight 是imageView的高度,这是再根据偏移量动态拉伸高度即可。

    (仅为演示,如果不对之处还请指正,大神勿喷)

    demo地址:GitHub - wenwudong/headerStretch: tableview的headerView拉伸放大,代码很简单,只是个demo

    添加拉伸模糊的效果,

    拉伸变模糊

    具体代码见demo,地址见上。

    相关文章

      网友评论

          本文标题:tableview的headerView拉伸放大模糊

          本文链接:https://www.haomeiwen.com/subject/adxbkttx.html