iOS开发实现拖动列表时，放大列表顶部的图片

原文地址：http://jingyan.baidu.com/article/fdffd1f85a3a4af3e98ca13c.html

在很多的APP中，我们可以看到一个列表顶部的图片会随着下拉会放大，上拉会被推至顶端消失的效果。这样的效果没能给定一个固有名词，我们要实现这样的效果可以使用第三方类库，也可以自己写代码实现。第三方使用的类库不算是个人经验，这里就不介绍了。现在介绍使用代码实现这样的效果，代码量很少，容易理解。当然实现效果是很好的。

工具/原料

Mac OS X操作系统
Xcode编译器

方法/步骤

1

创建工程项目和视图控制器

1、创建工程项目，新建一个UIViewController；

2、选中工程，右键-New File…选择“Cocoa Touch Class”-Next，给个合理的名称ViewController，再Next完成；

3、在AppDelegate.m文件包含#import "ViewController.h"；

4、初始化创建ViewController的视图控制器，并用导航栏控制器包含。将之设置为根视图控制器。
2

添加宏定义

1.添加导航条高度宏定义NavigationBarHight，iOS6为44，iOS7以后为64，且要看自己的页面有没有导航栏，如若没有可以去掉；

2.添加列表顶部图片固定高度宏定义ImageHight，高度根据切图设定（这里使用@2x的640*400图片，设定ImageHight为200）。
3

创建所需列表UITableView及添加代理

1、在ViewController.h添加事件代理和数据源代理<UITableViewDelegate,UITableViewDataSource>；

2、在ViewController.h创建UITableView；

3、在ViewController.m初始化self.tableView；

4、设置UITableView的contentInset属性（重点）；

5、代理授权并添加至视图。
4

创建列表顶部图片

1、在ViewController.h创建UIImageView；

2、在ViewController.m初始化UIImageView；

3、设置UIImageView的contentMode属性（重点）；

4、将UIImageView添加至列表self.tableView。
5

实现拖动列表时图片放大的效果方法

1、在ViewController.m添加UIScrollView的代理scrollViewDidScroll方法；

2、在scrollViewDidScroll内获取当前滚动坐标的y值；

3、当坐标y小于宏定义图片高度时就进行放大；

4、放大原理是改变UIImageView的y坐标和高度，同时由于设置了contentMode属性，图片高度改变会使得宽度跟着改变，达到放大效果。
6

附加：类似头像和用户名称在背景图上

END