利用小技巧做动态headerView
玩微博的时候,看到个人主页有个随着拖拽可以动态变动的headerView,感觉用户体验挺不错的。于是就有了冲动。。。
这个是怎么实现的呢?可能办法有千万种。下面讲解我的个人看法哈,首先分析下View的结构:
一、View的构成
1、能拖拽的是UIScrollView(废话);
2、显示图片的是UIImageView(废话);
3、显示东西的是UIView(随便什么View了)
//创建背景
self.bgscrollView = [[UIScrollView alloc]init];
[self.view addSubview:self.bgscrollView];
//创建图片
self.headerImageView = [[UIImageView alloc]init];
self.headerImageView.image = [UIImage imageNamed:@"login_bg"];
//自定义View
self.customeView = [[UITableView alloc]init];
二、View的层次结构
UIImageView 和 UIScrollView的父控件是控制器的View
显示的东西的View的父控件是UIScrollView
//添加View -- >注意顺序
[self.view addSubview:self.headerImageView];
[self.view addSubview:self.bgscrollView];
[self.bgscrollView addSubview:self.customeView];
知道了这些那么下面就要动刀子了。
1、监听UIScrollView的滚动(随着scrollView的滚动让UIImageView发生变化)
//添加KVO观察者
[self.bgscrollView addObserver:self forKeyPath:@"contentOffset" options: NSKeyValueObservingOptionNew context:nil];
2、UIImageView 动态发生改变(看样子好难啊)
//利用UIView的一个属性
//设置headerImageView的内容模式
self.headerImageView.contentMode = UIViewContentModeScaleAspectFill;
其实这是一句神奇的代码
3.实现KVO监听方法
pragma mark - KVO监听
-(void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context
{
CGPoint point = [change[@"new"] CGPointValue];
//时刻设置图片的高度
self.headerImageView.height_ic = 400 - point.y ;//关键代码
}
这样就简单实现了动态headerView
627E08ABEDB81442DC87738E61F30956.png
怎么样挺神奇的吧
快把代码带回家吧
https://github.com/icoder20150719/ICDragViewController.git
ps:添加KVO监听方法之后记得移除不然在控制器销毁的适合就会报:
** Terminating app due to uncaught exception 'NSInternalInconsistencyException', reason: 'An instance 0x7fa188def800 of class UIScrollView was deallocated while key value observers were still registered with it. Current observation info: <NSKeyValueObservationInfo 0x7fa188e922b0> (
<NSKeyValueObservance 0x7fa188e925a0: Observer: 0x7fa188de2a10, Key path: contentOffset, Options: <New: YES, Old: NO, Prior: NO> Context: 0x0, Property: 0x7fa188e8cb50>
)'
移除方法 可以写在
-(void)viewWillDisappear:(BOOL)animated{
[super viewWillDisappear:animated];
[self.bgscrollView removeObserver:self forKeyPath:@"contentOffset"];
}
或者
-(void)dealloc{
//your code
}