形状层的动画路径

用户名

我为自己认为的简单问题感到困惑。

我想绘制由线连接的视图,为视图的位置设置动画,并使连接线也为动画。我创建视图,并在它们之间创建一条线,如下所示:

- (UIBezierPath *)pathFrom:(CGPoint)pointA to:(CGPoint)pointB {
    CGFloat halfY = pointA.y + 0.5*(pointB.y - pointA.y);
    UIBezierPath *linePath=[UIBezierPath bezierPath];
    [linePath moveToPoint: pointA];
    [linePath addLineToPoint:CGPointMake(pointA.x, halfY)];
    [linePath addLineToPoint:CGPointMake(pointB.x, halfY)];
    [linePath addLineToPoint:pointB];
    return linePath;
}

-(void)makeTheLine {
    CGPoint pointA = self.viewA.center;
    CGPoint pointB = self.viewB.center;

    CAShapeLayer *lineShape = [CAShapeLayer layer];
    UIBezierPath *linePath=[self pathFrom:pointA to:pointB];
    lineShape.path=linePath.CGPath;

    lineShape.fillColor = nil;
    lineShape.opacity = 1.0;
    lineShape.strokeColor = [UIColor blackColor].CGColor;
    [self.view.layer addSublayer:lineShape];
    self.lineShape = lineShape;
}

它画出了我想要的样子。我从文档中了解到,可以通过在动画块中更改形状来对形状的路径进行动画处理,如下所示:

- (void)moveViewATo:(CGPoint)dest {
    UIBezierPath *destPath=[self pathFrom:dest to:self.viewB.center];
    [UIView animateWithDuration:1 animations:^{
        self.viewA.center = dest;
        self.lineShape.path = destPath.CGPath;
    }];
}

但是没有骰子。视图位置会按预期进行动画处理,但是连接到另一个视图的线会“跳转”到目标路径。

这个答案意味着我在做什么应该起作用。这个答案意味着一个CABasic动画,因为这似乎更糟糕,我(一个),那么我需要做同向视图冷得多块动画协调,和(b)当我试图这样,线没”根本没有改变...

// worse way
- (void)moveViewATo:(CGPoint)dest {
    UIBezierPath *linePath=[self pathFrom:dest to:self.viewB.center];
    [UIView animateWithDuration:1 animations:^{
        self.viewA.center = dest;
        //self.lineShape.path = linePath.CGPath;
    }];

    CABasicAnimation *morph = [CABasicAnimation animationWithKeyPath:@"path"];
    morph.duration = 1;
    morph.toValue = (id)linePath.CGPath;
    [self.view.layer addAnimation:morph forKey:nil];
}

提前致谢。

用户名

谢谢大家的帮助。在问这之后,我发现我正在为错误的属性设置动画。事实证明,您可以在动画中替换图层的形状,如下所示:

CABasicAnimation *morph = [CABasicAnimation animationWithKeyPath:@"path"];
morph.duration  = 1;
morph.fromValue = (__bridge id)oldPath.path;
morph.toValue   = (__bridge id)newPath.CGPath;
[line addAnimation:morph forKey:@"change line path"];
line.path=linePath.CGPath;

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章