将CABasicAnimation与CGAffineTransform动画混合使用

时间:2015-12-01 14:53:25

标签: ios objective-c animation transform

我需要连续旋转UIImageView。为此,我找到了这段代码:

if ([self.image.layer animationForKey:@"SpinAnimation"] == nil) {

        CABasicAnimation* animation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];
        animation.fromValue = [NSNumber numberWithFloat:0.0f];
        animation.toValue = [NSNumber numberWithFloat: 2 * M_PI];
        animation.duration = 90.0f;
        animation.repeatCount = INFINITY;
        [self.image.layer addAnimation:animation forKey:@"SpinAnimation"];
    }

然后,我需要在图像视图上进行变换转换,使其动画化。如果我这样做:

CGAffineTransform transform = self.image.transform;
transform = CGAffineTransformTranslate(transform, 0, 350);
[UIView animateWithDuration:1.0f animations:^{

        [self.view layoutIfNeeded];
        self.image.transform = transform;
    } completion:^(BOOL finished) {

        self.isMiddleViewOpened = YES;
    }];

执行动画时,图像会在到达转换结束点之前在视图周围浮动。 谢谢☺️

修改 我有问题,因为在我的第二个变换中,我只编辑y值,但图像不会仅在y轴上移动。如果您尝试使用此代码,则会看到问题

1 个答案:

答案 0 :(得分:2)

无法混合两种动画,您可以使用Core动画来完成所有动画。

我在启动画面中使用它来旋转四个图像块并最终将它们合并为一个。

动画会这样:

enter image description here

一个图像块的代码: 左上方的块,我称之为00块

- (void)addSplashScreenAnimationWithCompletion:(void (^)(BOOL finished))completionBlock
{
    [self addSplashScreenAnimationWithBeginTime:0 andFillMode:kCAFillModeBoth andRemoveOnCompletion:NO completion:completionBlock];
}

- (void)addSplashScreenAnimationWithBeginTime:(CFTimeInterval)beginTime andFillMode:(NSString *)fillMode andRemoveOnCompletion:(BOOL)removedOnCompletion completion:(void (^)(BOOL finished))completionBlock
{
    CAMediaTimingFunction *linearTiming = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];

    if (completionBlock)
    {
        CABasicAnimation *representativeAnimation = [CABasicAnimation animationWithKeyPath:@"not.a.real.key"];
        representativeAnimation.duration = 8.500; //your duration
        representativeAnimation.delegate = self;
        [self.layer addAnimation:representativeAnimation forKey:@"SplashScreen"];

    }

    CAKeyframeAnimation *_00RotationAnimation = [CAKeyframeAnimation animationWithKeyPath:@"transform.rotation.z"];
    _00RotationAnimation.duration = 8.500;
    _00RotationAnimation.values = @[@(0.000), @(18.829), @(18.829)];
    _00RotationAnimation.keyTimes = @[@(0.000), @(0.353), @(1.000)];
    _00RotationAnimation.timingFunctions = @[linearTiming, linearTiming];
    _00RotationAnimation.beginTime = beginTime;
    _00RotationAnimation.fillMode = fillMode;
    _00RotationAnimation.removedOnCompletion = removedOnCompletion;


    CAKeyframeAnimation *_00OpacityAnimation = [CAKeyframeAnimation animationWithKeyPath:@"opacity"];
    _00OpacityAnimation.duration = 8.500;
    _00OpacityAnimation.values = @[@(0.000), @(0.497), @(0.553), @(0.759), @(0.921), @(1.000), @(0.642), @(0.341), @(0.000), @(0.000)];
    _00OpacityAnimation.keyTimes = @[@(0.000), @(0.059), @(0.118), @(0.176), @(0.235), @(0.353), @(0.471), @(0.647), @(0.765), @(1.000)];
    _00OpacityAnimation.timingFunctions = @[linearTiming, linearTiming, linearTiming, linearTiming, linearTiming, linearTiming, linearTiming, linearTiming, linearTiming];
    _00OpacityAnimation.beginTime = beginTime;
    _00OpacityAnimation.fillMode = fillMode;
    _00OpacityAnimation.removedOnCompletion = removedOnCompletion;


    CAKeyframeAnimation *_00ScaleXAnimation = [CAKeyframeAnimation animationWithKeyPath:@"transform.scale.x"];
    _00ScaleXAnimation.duration = 8.500;
    _00ScaleXAnimation.values = @[@(0.600), @(0.600), @(1.187), @(1.187)];
    _00ScaleXAnimation.keyTimes = @[@(0.000), @(0.353), @(0.765), @(1.000)];
    _00ScaleXAnimation.timingFunctions = @[linearTiming, linearTiming, linearTiming];
    _00ScaleXAnimation.beginTime = beginTime;
    _00ScaleXAnimation.fillMode = fillMode;
    _00ScaleXAnimation.removedOnCompletion = removedOnCompletion;

    CAKeyframeAnimation *_00ScaleYAnimation = [CAKeyframeAnimation animationWithKeyPath:@"transform.scale.y"];
    _00ScaleYAnimation.duration = 8.500;
    _00ScaleYAnimation.values = @[@(0.688), @(0.688), @(1.359), @(1.359)];
    _00ScaleYAnimation.keyTimes = @[@(0.000), @(0.353), @(0.765), @(1.000)];
    _00ScaleYAnimation.timingFunctions = @[linearTiming, linearTiming, linearTiming];
    _00ScaleYAnimation.beginTime = beginTime;
    _00ScaleYAnimation.fillMode = fillMode;
    _00ScaleYAnimation.removedOnCompletion = removedOnCompletion;


    CAKeyframeAnimation *_00TranslationXAnimation = [CAKeyframeAnimation animationWithKeyPath:@"transform.translation.x"];
    _00TranslationXAnimation.duration = 8.500;
    _00TranslationXAnimation.values = @[@(0.000), @(107.423), @(211.936), @(211.936)];
    _00TranslationXAnimation.keyTimes = @[@(0.000), @(0.353), @(0.765), @(1.000)];
    _00TranslationXAnimation.timingFunctions = @[linearTiming, linearTiming, linearTiming];
    _00TranslationXAnimation.beginTime = beginTime;
    _00TranslationXAnimation.fillMode = fillMode;
    _00TranslationXAnimation.removedOnCompletion = removedOnCompletion;


    CAKeyframeAnimation *_00TranslationYAnimation = [CAKeyframeAnimation animationWithKeyPath:@"transform.translation.y"];
    _00TranslationYAnimation.duration = 8.500;
    _00TranslationYAnimation.values = @[@(0.000), @(390.498), @(476.237), @(476.237)];
    _00TranslationYAnimation.keyTimes = @[@(0.000), @(0.353), @(0.765), @(1.000)];
    _00TranslationYAnimation.timingFunctions = @[linearTiming, linearTiming, linearTiming];
    _00TranslationYAnimation.beginTime = beginTime;
    _00TranslationYAnimation.fillMode = fillMode;
    _00TranslationYAnimation.removedOnCompletion = removedOnCompletion;


}

上述方法包含一系列动画,如旋转,不透明度变换,沿x和y轴缩放,沿x和y轴平移。 您需要继承UIImageViewUIView并将动画放在那里。

你可以调用上面的方法:

 //Here _splashView can be UIView or UIImageView

[_splashView addSplashScreenAnimationWithCompletion:^(BOOL finished) {

      //Do your stuff after animation is completed
}];

您也可以repeatCount使用CAKeyFrameAnimation,并且应该HUGE_VALF让无限时间轮换。