-
效果展示
點贊按鈕變大和縮小以及附帶爆炸效果
-
效果分析
- 圖片變了
- 大小變了
- 爆炸效果(CAEmitterLayer)
-
屬性創(chuàng)建
@property (weak, nonatomic) IBOutlet UIButton *likeBtn;
@property (nonatomic, strong) CAEmitterLayer *emitterLayer;
-
粒子動畫初始化以及屬性之間的配置
- (void)explosion{
_emitterLayer = [CAEmitterLayer layer];
CAEmitterCell *cell = [[CAEmitterCell alloc] init];
cell.name = @"explosionCell";
cell.lifetime = .7;
cell.birthRate = 4000;
cell.velocity = 50;
cell.velocityRange = 15;
cell.scale = .03;
cell.scaleRange = .02;
cell.contents = (id)[UIImage imageNamed:@"sparkle"].CGImage;
_emitterLayer.name = @"explosionLayer";
_emitterLayer.emitterShape = kCAEmitterLayerCircle;
_emitterLayer.emitterMode = kCAEmitterLayerOutline;
_emitterLayer.emitterSize = CGSizeMake(25, 0);
_emitterLayer.emitterCells = @[cell];
_emitterLayer.renderMode = kCAEmitterLayerOldestFirst;
_emitterLayer.masksToBounds = NO;
_emitterLayer.birthRate = 0;
_emitterLayer.zPosition = 0;
_emitterLayer.position = CGPointMake(CGRectGetWidth(_likeBtn.bounds)/2, CGRectGetHeight(_likeBtn.bounds)/2);
[_likeBtn.layer addSublayer:_emitterLayer];
}
-
說明
- CAEmitterLayer 相當于煙花筒柳畔，容器
- CAEmitterCell 相當于煙花，我們看到的效果
-
關(guān)鍵幀動畫
- (IBAction)clickAction:(UIButton *)sender {
sender.selected = !sender.selected;
//關(guān)鍵幀動畫
CAKeyframeAnimation *anim = [CAKeyframeAnimation animationWithKeyPath:@"transform.scale"];
if (sender.selected) {
anim.values = @[@1.5, @.8, @1, @1.2, @1];
anim.duration = .6;
[self addExplosionAnim];
}else{
anim.values = @[@.8, @1.0];
anim.duration = .4;
}
[_likeBtn.layer addAnimation:anim forKey:nil];
}
- (void)addExplosionAnim{
_emitterLayer.beginTime = CACurrentMediaTime();
_emitterLayer.birthRate = 1;
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(.15 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
_emitterLayer.birthRate = 0;
});
}
-
特別說明
如果想要動畫做完消失的話就需要把birthRate設(shè)置為0
