Bug演示
bug现场.gif
从gif中可以看到我们是想实现这样的效果:
tableViewCell上有图片，有文字、价格等，但是我们现在关心的是图片加载出现时的效果,就是那个图片渐现的动画。
我们先来实现这个动画效果，当然我这里用的是SDWebImage框架来加载网络图片，然后在SD框架中的UIImageView+WebCache.m这个分类的源码里面的这个方法中进行修改：
image.png
image.png
image.png
wself.image = image;
wself.alpha =0.0f;
[UIView transitionWithView:wself duration:0.5 options:UIViewAnimationOptionCurveEaseIn animations:^{
wself.alpha =1.0f;
}];
[wself setNeedsLayout];
或者
wself.image = image;
wself.alpha =0.0f;
[UIView animateWithDuration:0.5 animations:^{
wself.alpha = 1.0f;
}];
[wself setNeedsLayout];
于是这样就会出现如上gif所示的bug了，主线程卡顿，造成tableView滑动不流畅，不跟手，如果不注意的话也许不会发现，但是app使用久了，一定会有注意到这样的问题，十分影响用户的体验，有强迫症的更是分分钟想要卸载😂。
作为一个注重用户体验的码农来说，这种问题怎么能忍呢？所以我经过分析终于找到解决方案。
先来说说造成问题的原因吧。
问题分析
- UIView的动画属于transition动画，transition动画会另开一个动画线程，然后在主线程中执行，如果此时进行UI操作，会打断动画的执行，比如tableView的reloadData，会让动画卡顿。详见这篇文章；
- 而Core Animation系列是单独开辟的线程执行动画，所以并不会影响主线程的UI响应。
解决方案
既然问题找到了，那么解决起来就简单了。
贴上修改后的代码：
CABasicAnimation *alphaAnimation = [CABasicAnimation animationWithKeyPath:@"opacity"];
alphaAnimation.fromValue = @0.0f;
alphaAnimation.toValue = @1.0f;
alphaAnimation.duration = 0.5f;
alphaAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];
[wself.layer addAnimation:alphaAnimation forKey:@""];
[wself setNeedsLayout];
解决后效果
解决效果.gif
是不是顺畅多了呢？当然本人也可能有很多写错的地方，只是为出现遇到同样问题的iOS开发者提供一种解决方案，欢迎指正和知识点纠正！
