实现类似于Vowch的头像移动的动画效果。

      今天,有位网友求助如何实现Vowch的头像移动的动画效果。因为,手上暂时没有设备,只能简单的模拟实现一下。等以后有了设备后再进行完善。


自定义HeaderView

      通过继承 UITableViewHeaderFooterView 自定义一个HeaderView。在 HeaderView.h中把下面这个属性添加进去

@property (nonatomic) UIImageView *imageView;

      然后在HeaderView.m中实现下面这个方法。

- (void)setImageView:(UIImageView *)imageView {
	for (UIView *view in self.contentView.subviews) {
		[view removeFromSuperview];
	}
	_imageView = imageView;
	[self.contentView addSubview:imageView];
}


显示HeaderView

      先声明一个静态字符串实例。

static NSString *headerFooterViewReuseIdentifier = @"HeaderFooterViewReuseIdentifier";

      在tableview初始化后,添加下面的代码。

[self.tableView registerClass:[HeaderView class]
	       forHeaderFooterViewReuseIdentifier:headerFooterViewReuseIdentifier];

      在.m文件中实现下面的方法。

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
  //初始化imageView.
	UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(10, 5, 30, 30)];
	imageView.image = [UIImage imageNamed:@"头像"];
	imageView.backgroundColor = [UIColor redColor];

  //重用headerView
	HeaderView *headerView = [self.tableView dequeueReusableHeaderFooterViewWithIdentifier:headerFooterViewReuseIdentifier];

  //把imageView赋值给HeaderView的属性。
	headerView.imageView = imageView;

	return headerView;
}

实现动画效果

为了判断滚动方向,在 类扩展中添加下面这个属性
@property CGPoint lastPoint;

// 为了每次滚动后,都可以更改头像的位置,我们需要继承并实现UIScrollViewDelegate中的一个方法。每当UIScrollView的offset改变时,这个方法都会被调用。
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
	// UITableView从UIScrollView继承了一个属性contentOffset,通过它,我们可以知道UITableView显示的左上角的偏移量。
	CGPoint point = scrollView.contentOffset;

	//根据contentOffset获得顶部indexPath。
	NSIndexPath *path = [self.tableView indexPathForRowAtPoint:point];

	//通过UITableView在ios6新增的方法,我们就可以通过indexPath.section获得顶部的headerView。
	HeaderView *headerView = (HeaderView *)[self.tableView headerViewForSection:path.section];

	UIImageView *imageView = headerView.imageView;

	//根据滚动方向的不同,头像的移动方向也不同。所以,我们要添加一个属性,来帮助我们判断滚动方向。
	if ((point.y > self.lastPoint.y) && (imageView.frame.origin.x == 10)) {
		[UIView animateWithDuration:toRightDuration animations: ^{
		    imageView.frame = CGRectMake(290, 5, 30, 30);
		}];
	}
	else if ((point.y < self.lastPoint.y) && (imageView.frame.origin.x == 290)) {
		[UIView animateWithDuration:toLeftDuration animations: ^{
		    imageView.frame = CGRectMake(10, 5, 30, 30);
		}];
	}

  //把当前的point赋给self.lastPoint
	self.lastPoint = point;
}



      注意:虽然苹果没有明确说明,但这个方法只有在使用下面的方法注册后才可以正常返回View.

- (void)registerNib:(UINib *)nib forHeaderFooterViewReuseIdentifier:(NSString *)identifier NS_AVAILABLE_IOS(6_0);
- (void)registerClass:(Class)aClass forHeaderFooterViewReuseIdentifier:(NSString *)identifier NS_AVAILABLE_IOS(6_0);


      注意:根据苹果的文档,当table的样式是plain时,section会一直返回空。但是,根据我的测试结果,在样式为UITableViewStylePlain时,可以正常获得section。

section
    An index number that identifies a section of the table. Table views in a plain style have a section index of zero.
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值