[动画学习]简单的组动画（抖音关注动画）

简单实现下核心动画的组动画。

通过控制beginTime（动画开始时间）duration （动画市场）将几种动画效果组合在一起。

防止核心动画回到起始状态：

group.fillMode = kCAFillModeForwards; group.removedOnCompletion =NO;

看下效果：

.gif

代码：

初始化

@implementation ViewController{

    UIButton *starView;

    UIButton *headBtn;

    UIButton *followBtn;

}

- (void)viewDidLoad {

    [super viewDidLoad];

    self.view.backgroundColor = [UIColor whiteColor];

    starView = [[UIButton alloc]initWithFrame:CGRectMake(135, 100, 80, 20)];

    [starView setBackgroundColor:[UIColor brownColor]];

    [starView setTitle:@"重置" forState:UIControlStateNormal];

    [starView setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];

    [starView addTarget:self action:@selector(startAgain:) forControlEvents:UIControlEventTouchUpInside];

    [self.view addSubview:starView];

    headBtn = [[UIButton alloc]initWithFrame:CGRectMake(150, 150, 50, 50)];

    headBtn.layer.cornerRadius = 25;

    headBtn.layer.borderWidth =1.0;

    headBtn.layer.borderColor = [UIColor whiteColor].CGColor;

    headBtn.clipsToBounds = YES;

    [headBtn setImage:[UIImage imageNamed:@"timg"] forState:UIControlStateNormal];

    [self.view addSubview:headBtn];

    followBtn = [[UIButton alloc]init];

    followBtn.frame = CGRectMake(160, 185, 30, 30);

    [followBtn setImage:[UIImage imageNamed:@"video_follow"] forState:UIControlStateNormal];

    [followBtn addTarget:self action:@selector(videofollowBtnClick:) forControlEvents:UIControlEventTouchUpInside];

    [self.view addSubview:followBtn];

}

点击动画：

//关注动画

-(void)videofollowBtnClick:(UIButton*)btn{

    //延时更改图片

    [self performSelector:@selector(changeImage:) withObject:btn afterDelay:0.5f];

    [self performSelector:@selector(hiddenBtn:) withObject:btn afterDelay:1.5f];

    //组动画

    CAAnimationGroup *group = [CAAnimationGroup animation];

    group.repeatCount = 1;

    //透明度1-》0。  0.5秒

    CABasicAnimation *anim = [self getAnimationKeyPath:@"opacity" toValue:@(0.0) beginTime:0.0 duration:0.5];

    //延时操作会在0.5秒换图片

    //透明度0——》1

    CABasicAnimation *anim2 = [self getAnimationKeyPath:@"opacity" toValue:@(1.0) beginTime:0.5 duration:0.3];

    //旋转

    CABasicAnimation *anim3 = [self getAnimationKeyPath:@"transform.rotation.z" toValue:[NSNumber numberWithFloat: M_PI *2] beginTime:0.3 duration:0.5];

    //缩小

    CABasicAnimation *anim4 = [self getAnimationKeyPath:@"transform.scale" toValue:@(0.0) beginTime:1.0 duration:0.3];

    group.animations = @[anim,anim2,anim3,anim4];

    group.duration = 1.3;//时长

    group.autoreverses = NO;

    group.fillMode = kCAFillModeForwards;

    group.removedOnCompletion =NO;

    [btn.layer addAnimation:group forKey:nil];

}

-(void)hiddenBtn:(UIButton*)btn{

    btn.hidden = YES;

    [btn setImage:[UIImage imageNamed:@"video_follow"] forState:UIControlStateNormal];

    CABasicAnimation *animi = [self getAnimationKeyPath:@"transform.scale" toValue:@(1) beginTime:0.0 duration:0.0];

    [btn.layer addAnimation:animi forKey:nil];

}

-(void)changeImage:(UIButton*)btn{

    [btn setImage:[UIImage imageNamed:@"关注成功"] forState:UIControlStateNormal];

}

//动画

-(CABasicAnimation *)getAnimationKeyPath:(NSString *)keyPath toValue:(id)value beginTime:(CFTimeInterval)beginTime duration:(CFTimeInterval)duration{

    CABasicAnimation *anim = [CABasicAnimation animation];

    anim.keyPath =keyPath;

    anim.toValue = value;

    anim.beginTime = beginTime;

    anim.duration =duration;

    anim.fillMode = kCAFillModeForwards;

    anim.removedOnCompletion = NO;

    return anim;

}

//重置

-(void)startAgain:(UIButton*)sender{

    followBtn.hidden = NO;

    [followBtn setImage:[UIImage imageNamed:@"video_follow"] forState:UIControlStateNormal];

    CABasicAnimation *animi = [self getAnimationKeyPath:@"transform.scale" toValue:@(1) beginTime:0.0 duration:0.0];

    [followBtn.layer addAnimation:animi forKey:nil];

}

简单实现移动旋转缩放等的组合。

——end——