经常看到一些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,地址见上。