Question

我是使用CABasicAnimation实例绘制到CAShapeLayer的一行的stokeColor。我希望使用这个动画的曲线“动画”＃39;不可动产的财产。我想控制一个样本的体积，它取一个浮点值与stokeColor的演变同步。因此，我的基本动画在两个strokeColors之间设置动画，持续时间为0.2f。我怎样才能制作动画片？带有此信息的样本量，这样当动画发生时，音量会发生变化吗？

Answer 1

这会动画颜色，笔触，位置和旋转，完整示例：

这是一个相当强大的示例，只需将其用作模板：

视频展示示例：https://www.youtube.com/watch?v=ucYqb0Gs1_8&feature=youtu.be

只需调用第二个方法，第二个方法将调用第一个方法，然后就可以了。将它放入视图控制器视图中，您将看到魔术发生，随意根据您的需要操作代码：

#define   DEGREES_TO_RADIANS(degrees)  ((M_PI * degrees)/ 180)


-(void)this {
    [CATransaction begin];
    [CATransaction setAnimationDuration:3.5];
    [CATransaction setAnimationTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
    CABasicAnimation * drawAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
    drawAnimation.removedOnCompletion = YES;
    drawAnimation.autoreverses  = YES;
    drawAnimation.repeatCount = INFINITY;
    drawAnimation.fromValue = [NSNumber numberWithFloat:0.0f];
    drawAnimation.toValue   = [NSNumber numberWithFloat:1.f];
    drawAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];
    [arc addAnimation:drawAnimation forKey:@"thisone"];
    [CATransaction commit];

    [CATransaction begin];
    [CATransaction setAnimationDuration:3.5];
    [CATransaction setAnimationTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
    CABasicAnimation *drawAnimation1 = [CABasicAnimation animationWithKeyPath:@"strokeStart"];
    drawAnimation1.removedOnCompletion = YES;
    drawAnimation1.autoreverses = YES;
    drawAnimation1.repeatCount = INFINITY;
    drawAnimation1.fromValue = [NSNumber numberWithFloat:0.0];
    drawAnimation1.toValue   = [NSNumber numberWithFloat:-1.0];
    [arc addAnimation:drawAnimation1 forKey:@"myKey"];
    [CATransaction commit];
}


-(void)doGradientoutline {

    float th = 50.00;
    UIView * hellowkitt = [UIView new];
    [hellowkitt setFrame:CGRectMake(SCREEN_WIDTH/2-(30+th)*2/2-th, SCREEN_HEIGHT/4-th, (30+th)*2+th*2, (30+th)*2+th*2)];
    [self.view addSubview: hellowkitt];

    UIView * imageView = [UIView new];
    [imageView setFrame:CGRectMake(th, th, hellowkitt.frame.size.width-th*2, hellowkitt.frame.size.height-th*2)];
    [imageView setClipsToBounds:true];
    [imageView.layer setCornerRadius:(hellowkitt.frame.size.width-th*2)/2];
    [hellowkitt addSubview:imageView];

    UIImageView * imageView1 = [UIImageView new];
    [imageView1 setImage:[UIImage imageNamed:@"df"]];
    [imageView1 setFrame:CGRectMake(hellowkitt.frame.origin.x+th, hellowkitt.frame.origin.y+th, hellowkitt.frame.size.width-th*2, hellowkitt.frame.size.height-th*2)];
    [imageView1 setClipsToBounds:true];
    [imageView1.layer setCornerRadius:imageView1.frame.size.height/2];
    [self.view addSubview:imageView1];

    int radius = imageView.frame.size.width/2+7;
    arc = [CAShapeLayer layer];
    [arc setFrame:imageView.frame];

    UIBezierPath * aa =[UIBezierPath bezierPathWithArcCenter:CGPointMake(imageView.center.x, imageView.center.y) radius:radius startAngle:DEGREES_TO_RADIANS(0) endAngle:DEGREES_TO_RADIANS(360) clockwise:YES];
    arc.path = aa.CGPath;

    arc.bounds = CGPathGetBoundingBox(aa.CGPath);
    arc.frame = arc.bounds;
    arc.fillColor = [UIColor clearColor].CGColor;
    arc.strokeColor = [UIColor purpleColor].CGColor;
    arc.lineWidth = 40;
    [arc setLineCap:@"round"];

    CAGradientLayer *gradientLayer = [CAGradientLayer layer];
    gradientLayer.frame = CGRectMake(0, 0, hellowkitt.frame.size.width, hellowkitt.frame.size.height);

    gradientLayer.colors = @[(__bridge id)[UIColor paperColorRedA700].CGColor, (__bridge id)[UIColor paperColorBlueA700].CGColor];
    gradientLayer.backgroundColor = (__bridge CGColorRef)((__bridge id)[UIColor blackBean].CGColor);

    gradientLayer.startPoint = CGPointMake(0.0,0.5);
    gradientLayer.endPoint = CGPointMake(1.0,0.51);

    CABasicAnimation *drawAnimation11 = [CABasicAnimation animationWithKeyPath:@"colors"];
    drawAnimation11.duration            = 2.00;
    drawAnimation11.repeatCount         = HUGE_VAL;
    drawAnimation11.removedOnCompletion = NO;
    drawAnimation11.fillMode = kCAFillModeForwards;
    drawAnimation11.autoreverses = true;
    drawAnimation11.fromValue = @[(__bridge id)[UIColor paperColorRedA700].CGColor, (__bridge id)[UIColor paperColorBlueA700].CGColor];

    drawAnimation11.toValue =  @[(__bridge id)[UIColor redColor].CGColor, (__bridge id)[UIColor blueColor].CGColor];

    drawAnimation11.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];

    CABasicAnimation* animation = [CABasicAnimation animationWithKeyPath:@"transform.rotation"];
    animation.byValue = @(4 * M_PI);
    animation.duration = 1.5f;
    animation.repeatCount = INFINITY;
    animation.removedOnCompletion = NO;

    [self this];

    gradientLayer.mask = arc;

    [hellowkitt.layer addSublayer:gradientLayer];
    [hellowkitt.layer addAnimation:animation forKey:@"fasdfaasdf"];
    [gradientLayer addAnimation:drawAnimation11 forKey:@"thatone"];
}

哦是的，还有一件事，苹果在2014年谈到了其中一些，他们建议使用笔画来激活各种类型的动画：

http://asciiwwdc.com/2014/sessions/419

从CABasicAnimation获取原始曲线

1 个答案: