iOS开发-CABasicAnimation实现小球左右摆动动画效果

iOS开发-CABasicAnimation实现小球左右摆动动画效果

之前开发中遇到需要实现小球左右摆动动画效果,这里作下记录。

一、效果图

在这里插入图片描述

二、实现代码

2.1 CABasicAnimation

CABasicAnimation基础动画,包括duration、repeatCount、repeatDuration、beginTime、timingFunction、autoreverses、fromValue、toValue、byValue、byValue等属性。

具体可以查看

https://blog.csdn.net/gloryFlow/article/details/131991202

2.2 实现小球摆动动画

小球摆动动画主要实现

CABasicAnimation *animation = [CABasicAnimation animation];
    //动画运动的方式,现在指定的是围绕Z轴旋转
    animation.keyPath = @"transform.rotation.z";

完整代码如下

#import "INBallSwingView.h"
#import "UIColor+Addition.h"

static CGFloat rollSize = 50.0;

@implementation INBallSwingView

- (id)initWithFrame:(CGRect)frame {
    
    
    self = [super initWithFrame:frame];
    if (self) {
    
    
        self.backgroundColor = [UIColor colorWithHexString:@"efeff4"];
        
        _animationImageView = [[UIImageView alloc] initWithFrame:CGRectZero];
        _animationImageView.backgroundColor = [UIColor clearColor];
        [self addSubview:_animationImageView];
        
        _lineImageView = [[UIImageView alloc] initWithFrame:CGRectZero];
        _lineImageView.backgroundColor = [UIColor blueColor];
        [_animationImageView addSubview:_lineImageView];
        
        _rollImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0.0, 0.0, rollSize, rollSize)];
        _rollImageView.backgroundColor = [UIColor redColor];
        _rollImageView.layer.cornerRadius = rollSize/2;
        _rollImageView.layer.masksToBounds = YES;
        [_animationImageView addSubview:_rollImageView];
        
        // 锚点(0 - 1)
        self.animationImageView.layer.anchorPoint = CGPointMake(0.5, 0);
    }
    return self;
}

- (id)init {
    
    
    return [self initWithFrame:CGRectZero];
}

- (void)layoutSubviews {
    
    
    [super layoutSubviews];    
    self.animationImageView.frame = CGRectMake((CGRectGetWidth(self.bounds) - 200)/2, 200, 200, 200);
    
    self.rollImageView.frame = CGRectMake((CGRectGetWidth(self.animationImageView.frame) - rollSize)/2, CGRectGetHeight(self.animationImageView.frame) - rollSize, rollSize, rollSize);
    
    self.lineImageView.frame = CGRectMake((CGRectGetWidth(self.animationImageView.frame) - 1.0)/2, 5.0, 1.0, CGRectGetMinY(self.rollImageView.frame) - 10.0);
}

- (void)startAnimation {
    
    
    //初始化一个动画
    CABasicAnimation *animation = [CABasicAnimation animation];
    //动画运动的方式,现在指定的是围绕Z轴旋转
    animation.keyPath = @"transform.rotation.z";
    //动画持续时间
    animation.duration = 1.0;
    //开始的角度
    animation.fromValue = [NSNumber numberWithFloat:-M_PI/4];
    //结束的角度
    animation.toValue = [NSNumber numberWithFloat:M_PI/4];
    //动画的运动方式
    animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
    //是否反向移动动画
    animation.autoreverses = YES;
    
    animation.repeatCount = MAXFLOAT;
    //动画的代理
//    baseAnimation2.delegate = self;
    //动画结束后的状态
    animation.fillMode = kCAFillModeBoth;
    
    [animation setValue:@"roll" forKey:@"roll"];
    
    [self.animationImageView.layer addAnimation:animation forKey:@"roll"];
}

@end

三、小结

iOS开发-CABasicAnimation实现小球左右摆动动画效果。

学习记录,每天不停进步。

猜你喜欢

转载自blog.csdn.net/gloryFlow/article/details/131992354