2018-10-29

UITableView 是iOS日常开发中经常使用到的控件。tableView的普通展示效果比较生硬，为了提升APP的活力，提升体验，我们可以对根据tableView的特点，操作Cell实现一些动画效果。
我写了一个简单的动画集 TableViewAnimationKit，只需要一行代码就可以让tableView实现动画
目前有大概10个动画，后续会优化增加。
源码放到Github上： TableViewAnimationKit欢迎大家star、下载，交流沟通。

正文

一、效果展示：

1819750-5969d06fc5f0b1ad.gif

1819750-cf35bdb88e2233d3.gif

1819750-d15b7c658245dd00.gif

二、使用方法

TableViewAnimationKit调用各个动画的方法都为类方法，只需一行代码就可以调用。
eg:

[TableViewAnimationKit shakeAnimationWithTableView:tableView];

TableViewAnimationKit提供的动画类方法

+ (void)moveAnimationWithTableView:(UITableView *)tableView;
+ (void)alphaAnimationWithTableView:(UITableView *)tableView;
+ (void)fallAnimationWithTableView:(UITableView *)tableView;
+ (void)shakeAnimationWithTableView:(UITableView *)tableView;
+ (void)overTurnAnimationWithTableView:(UITableView *)tableView;
+ (void)toTopAnimationWithTableView:(UITableView *)tableView;
+ (void)springListAnimationWithTableView:(UITableView *)tableView;
+ (void)shrinkToTopAnimationWithTableView:(UITableView *)tableView;
+ (void)layDonwAnimationWithTableView:(UITableView *)tableView;
+ (void)roteAnimationWithTableView:(UITableView *)tableView;

三、源码讲解

先举其中一个动画效果为例子：

1819750-d15b7c658245dd00.gif

动画效果为Cell左右各自插入。
实现代码很简单如下：

• (void)shakeAnimationWithTableView:(UITableView *)tableView {

  NSArray *cells = tableView.visibleCells;
  for (int i = 0; i < cells.count; i++) {
  UITableViewCell cell = [cells objectAtIndex:i];
  if (i%2 == 0) {
  cell.transform = CGAffineTransformMakeTranslation(-XS_SCREEN_WIDTH,0);
  }else {
  cell.transform = CGAffineTransformMakeTranslation(XS_SCREEN_WIDTH,0);
  }
  [UIView animateWithDuration:0.4 delay:i0.03 usingSpringWithDamping:0.75 initialSpringVelocity:1/0.75 options:0 animations:^{
  cell.transform = CGAffineTransformIdentity;
  } completion:^(BOOL finished) {

    }];
  

  }
  }
  主要思路为：
  获得tableview的visibleCells数组，进行遍历，对每个执行动画，不同cell的执行时间、方向有所差异，一起构成整个动画。

四、其他一些动画效果

1819750-0afc78f10af2b2c7.gif

1819750-4d944aa53c9bd4c9.gif

1819750-eb4098312d48dd11.gif

1819750-ca7bd0c59dfd74dd.gif

1819750-ca78886a3e9b0cf0.gif

后语

源码放到Github上： TableViewAnimationKit有需要的同学可以下载、star，目前只算Demo级别，后面会继续优化、增加动画。如有什么想法，欢迎进行技术交流。