iOS开发-UITableView顶部图片下拉放大

关于顶部图片下拉放大，在用户展示的个人中心显示用户个人头像信息，设置UITableView的headerView实现，UITableView继承自UIScrollView，同样的设置UIScrollView的顶部图片也可以实现同样的效果，简单看一下实现的效果:

控制器中设置需要的属性变量:

?

1 2 3 4

@property  (strong,nonatomic)  UITableView  *tableView; @property  (strong,nonatomic)  NSArray      *data; @property   (strong,nonatomic) UIView       *tableHeaderView; @property  (strong,nonatomic)  UIImageView  *imageView;

初始化属性:

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28

-(UITableView *)tableView{     if (!_tableView) {         _tableView=[[UITableView alloc]initWithFrame:CGRectMake(0, 0,SCREENWIDTH, SCREENHEIGHT)];         _tableView.delegate=self;         _tableView.dataSource=self;         _tableView.showsVerticalScrollIndicator=NO;          _tableView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;         [_tableView registerClass:[UITableViewCell class] forCellReuseIdentifier:CellIdetifier];     }     return _tableView; }   -(UIView *)tableHeaderView{     if (!_tableHeaderView) {         _tableHeaderView=[[UIImageView alloc]initWithFrame:CGRectMake(0, 0,SCREENWIDTH, 100)];     }     return _tableHeaderView; }   -(UIImageView *)imageView{     if (!_imageView) {         _imageView=[[UIImageView alloc]initWithFrame:CGRectMake(0, 0, SCREENWIDTH, 100)];         _imageView.autoresizingMask=UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;         _imageView.clipsToBounds=YES;         _imageView.contentMode=UIViewContentModeScaleAspectFill;     }     return _imageView; }

UITableViewDelegate实现:

?

1 2 3 4 5 6 7 8 9 10 11 12 13

-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{     return 1; }   -(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{     return [self.data count]; }   -(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{     UITableViewCell  *cell=[tableView dequeueReusableCellWithIdentifier:CellIdetifier];     [cell.textLabel setText:self.data[indexPath.row]];     return cell; }

　ViewDidLoad中初始化imageView:

?

1 2 3 4 5 6

self.data=@[@"FlyElephant",@"博客园",@"UITableView图片放大",@"http://www.cnblogs.com/xiaofeixiang/"]; self.imageView.image=[UIImage imageNamed:@"Girl"]; self.imageView.contentMode=UIViewContentModeScaleAspectFill; [self.tableHeaderView addSubview:self.imageView]; self.tableView.tableHeaderView=self.tableHeaderView; [self.view addSubview:self.tableView];

在UITableViewView向下拉动的过程中，改变imageView的位置:

?

1 2 3 4 5 6 7 8 9 10

-(void)scrollViewDidScroll:(UIScrollView *)scrollView{     CGPoint offset = scrollView.contentOffset;     if (offset.y < 0) {         CGRect rect =self.tableHeaderView.frame;         rect.origin.y = offset.y;         rect.size.height =CGRectGetHeight(rect)-offset.y;         self.imageView.frame = rect;         self.tableHeaderView.clipsToBounds=NO;     } }

　实现起来比较简单，希望对有需要的人有所帮助~