在很多应用中都会发现首页顶部图片有下拉放大的效果。其实实现很简单。关键是scrollview的offset
与contentinset
设置;
1. offset设置
固定图片的顶部位置y与增大height。
#pragma mark -- UIScrollViewDelegate
- (void)scrollViewDidScroll:(UIScrollView *)scrollView{
CGFloat y = scrollView.contentOffset.y;
if (y < 0) {
//获得原有需要放大的frame
CGRect frame = self.marqueeScrollView.frame;
//保持y不变
frame.origin.y = y;
//高度随增加而增加 (offsetY本身是负数,设置高度 负负得正嘛)
frame.size.height = -y;
self.marqueeScrollView.frame = frame;
}
}
2. contentinet设置
放大视图的高度设置
contentinet 设置是插入一段padding
在scrollview中,你会发现,停止下拉后,offset的变动不在为0 ,而是你插入的padding值大小。
(因为放大视图的的高度由offset决定,offset会归零。)
核心代码
#define marqueeHeight 150
self.scrollView.delegate = self;
//插入高度值
self.scrollView.contentInset = UIEdgeInsetsMake(marqueeHeight, 0, 0, 0);
[self.scrollView addSubview:self.marqueeScrollView];
//修复在scrollViewDidScroll下拉时的问题,注释运行可见bug
[self.scrollView setContentOffset:CGPointMake(0, -marqueeHeight) animated:YES];
-(UIScrollView *)marqueeScrollView{
if (!_marqueeScrollView) {
_marqueeScrollView = [[UIScrollView alloc]init];
//AutoFrame是我自己尺寸适配的代码。SCREEN_WIDTH为屏幕宽度宏定义
_marqueeScrollView.frame = AutoFrame(0, -marqueeHeight, SCREEN_WIDTH, marqueeHeight);
_marqueeScrollView.backgroundColor = [UIColor orangeColor];
}
return _marqueeScrollView;
}
抱歉,没demo.....上面都是核心的代码。marqueeScrollView 是我懒加载的视图层,你可以替换成ImgView试试。
网友评论