现在很多电商类的软件Table顶部上面的图片都可以下拉放大例如口袋购物、微店
下面是自己写的一个小demo，效果图如下
为了方便直接用storyboard拖界面了，在navigationController的右边添加了个按钮跳转到下拉放大图片的那个界面
实现原理很简单，就是在UITableview上边添加一个子视图，在TableView拖动的时候动态的改变图片的Y和高，就可以实现这个效果。
步骤如下：
1. 布置UITableview
UITableview的设置和正常一样，没有什么需要注意的地方，代码如下：
2. 准备顶部视图
这里我们的图片高度暂定为200 所以我创建了一个宏
#define kHeaderHeight 200
然后我创建了一个View，View的高度直接使用宏，然后在View上面添加一个ImageView 代码如下：
需要注意的是，图片的contentMode必须设置为UIViewContentModeScaleAspectFill， 这样才能保证图片在放大的过程中高和宽是同时放大的，设置了UIViewContentModeScaleAspectFill发现在侧滑放回上一个界面的时候图片的多余的部分还在影响美观
加上_headerImageView.clipsToBounds=YES;就好了
3. 拖动事件的处理
在TableView滑动的时候，一旦判定是下拉状态并且是从大于图片高度的地方下拉的，那么我们就要动态的改变图片的纵向位置和图片的高度（由于设置了contentMode，所以宽度自己会变化），最终实现所需要的效果。在scrollViewDidScroll方法里实现 代码如下：
最后剩下的就是navigationController了
大致就是这样
网友评论