当前位置：文江博客话题详情

如何在iPhone中用动画画线

发布于 2024-12-11 18:07:38 字数 79 浏览 0 评论 0原文

我正在使用 CGContextRef 在 iphone 中画线。任何人都可以建议我如何在 iphone 中用动画画线。

请建议。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

你与清晨阳光 2024-12-18 18:07:38

这是答案（在这里找到：http://soulwithmobiletechnology.blogspot.fr/ 2012/07/how-to-animate-line-draw.html）

UIBezierPath *path = [UIBezierPath bezierPath];
[path moveToPoint:CGPointMake(50.0,0.0)];
[path addLineToPoint:CGPointMake(120.0, 600.0)];

CAShapeLayer *pathLayer = [CAShapeLayer layer];
pathLayer.frame = self.view.bounds;
pathLayer.path = path.CGPath;
pathLayer.strokeColor = [[UIColor redColor] CGColor];
pathLayer.fillColor = nil;
pathLayer.lineWidth = 2.0f;
pathLayer.lineJoin = kCALineJoinBevel;

[self.view.layer addSublayer:pathLayer];

CABasicAnimation *pathAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
pathAnimation.duration = 2.0;
pathAnimation.fromValue = [NSNumber numberWithFloat:0.0f];
pathAnimation.toValue = [NSNumber numberWithFloat:1.0f];
[pathLayer addAnimation:pathAnimation forKey:@"strokeEnd"];

不要忘记#import。

Here is the answer (found here : http://soulwithmobiletechnology.blogspot.fr/2012/07/how-to-animate-line-draw.html)

UIBezierPath *path = [UIBezierPath bezierPath];
[path moveToPoint:CGPointMake(50.0,0.0)];
[path addLineToPoint:CGPointMake(120.0, 600.0)];

CAShapeLayer *pathLayer = [CAShapeLayer layer];
pathLayer.frame = self.view.bounds;
pathLayer.path = path.CGPath;
pathLayer.strokeColor = [[UIColor redColor] CGColor];
pathLayer.fillColor = nil;
pathLayer.lineWidth = 2.0f;
pathLayer.lineJoin = kCALineJoinBevel;

[self.view.layer addSublayer:pathLayer];

CABasicAnimation *pathAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
pathAnimation.duration = 2.0;
pathAnimation.fromValue = [NSNumber numberWithFloat:0.0f];
pathAnimation.toValue = [NSNumber numberWithFloat:1.0f];
[pathLayer addAnimation:pathAnimation forKey:@"strokeEnd"];

Do not forget to #import <QuartzCore/QuartzCore.h>.

回复收藏 0 原文

心凉怎暖 2024-12-18 18:07:38

它是一条直线吗？...您可以使用 1 像素宽的 UIView 并为其框架属性设置动画。使用 [UIView beginAnimations] 和 [UIView commitAnimations]; 否则，查看这篇文章。

编辑响应

使用核心动画，您可以执行类似的操作（例如在按钮后面）

CABasicAnimation *theAnimation = [self pathAnimation];
theAnimation.duration=3.0;  
theAnimation.autoreverses=YES;
[[self layer] addAnimation:theAnimation forKey:@"animatePath"];

路径动画定义为：

- (CAAnimation*)pathAnimation;
{

    CGMutablePathRef path = CGPathCreateMutable();
    CGPathMoveToPoint(path,NULL,50.0,120.0);

    CGPathAddCurveToPoint(path,NULL,50.0,275.0,
                          150.0,275.0,
                          150.0,120.0);
    CGPathAddCurveToPoint(path,NULL,150.0,275.0,
                          250.0,275.0,
                          250.0,120.0);    
    CGPathAddCurveToPoint(path,NULL,250.0,275.0,
                          350.0,275.0,
                          350.0,120.0);    
    CGPathAddCurveToPoint(path,NULL,350.0,275.0,
                          450.0,275.0,
                          450.0,120.0);

    CAKeyframeAnimation *
        animation = [CAKeyframeAnimation 
                     animationWithKeyPath:@"position"];

    [animation setPath:path];
    [animation setDuration:3.0];

    [animation setAutoreverses:YES];

    CFRelease(path);

    return animation;

}

这只是指向您可以使用核心动画执行的操作的指针。有关详细信息，请参阅本文。

Is it a straight line?.. You can use a 1 pixel wide UIView and animate its frame property. Using [UIView beginAnimations] and [UIView commitAnimations]; Otherwise, see this post.

Edited response

Using core animation, you can do something like this (e.g. behind a button)

CABasicAnimation *theAnimation = [self pathAnimation];
theAnimation.duration=3.0;  
theAnimation.autoreverses=YES;
[[self layer] addAnimation:theAnimation forKey:@"animatePath"];

Path animation is defined as:

- (CAAnimation*)pathAnimation;
{

    CGMutablePathRef path = CGPathCreateMutable();
    CGPathMoveToPoint(path,NULL,50.0,120.0);

    CGPathAddCurveToPoint(path,NULL,50.0,275.0,
                          150.0,275.0,
                          150.0,120.0);
    CGPathAddCurveToPoint(path,NULL,150.0,275.0,
                          250.0,275.0,
                          250.0,120.0);    
    CGPathAddCurveToPoint(path,NULL,250.0,275.0,
                          350.0,275.0,
                          350.0,120.0);    
    CGPathAddCurveToPoint(path,NULL,350.0,275.0,
                          450.0,275.0,
                          450.0,120.0);

    CAKeyframeAnimation *
        animation = [CAKeyframeAnimation 
                     animationWithKeyPath:@"position"];

    [animation setPath:path];
    [animation setDuration:3.0];

    [animation setAutoreverses:YES];

    CFRelease(path);

    return animation;

}

This is only a pointer to what you can do with Core Animation. See this article for detail.

回复收藏 0 原文

时光无声 2024-12-18 18:07:38

Martin 答案的 Swift 3 版本（使用 Xcode 8.3.3 检查）

    let path = UIBezierPath()
    path.move(to: CGPoint(x: 50, y: 0))
    path.addLine(to: CGPoint(x: 120, y: 600))

    let pathLayer = CAShapeLayer()
    pathLayer.frame = view.bounds
    pathLayer.path = path.cgPath
    pathLayer.strokeColor = UIColor.red.cgColor
    pathLayer.fillColor = nil
    pathLayer.lineWidth = 2
    pathLayer.lineJoin = kCALineJoinBevel
    view.layer.addSublayer(pathLayer)

    let pathAnimation = CABasicAnimation(keyPath: "strokeEnd")
    pathAnimation.duration = 2.0
    pathAnimation.fromValue = 0
    pathAnimation.toValue = 1
    pathLayer.add(pathAnimation, forKey: "strokeEnd")

The Swift 3 version of Martin's answer (checked with Xcode 8.3.3)

    let path = UIBezierPath()
    path.move(to: CGPoint(x: 50, y: 0))
    path.addLine(to: CGPoint(x: 120, y: 600))

    let pathLayer = CAShapeLayer()
    pathLayer.frame = view.bounds
    pathLayer.path = path.cgPath
    pathLayer.strokeColor = UIColor.red.cgColor
    pathLayer.fillColor = nil
    pathLayer.lineWidth = 2
    pathLayer.lineJoin = kCALineJoinBevel
    view.layer.addSublayer(pathLayer)

    let pathAnimation = CABasicAnimation(keyPath: "strokeEnd")
    pathAnimation.duration = 2.0
    pathAnimation.fromValue = 0
    pathAnimation.toValue = 1
    pathLayer.add(pathAnimation, forKey: "strokeEnd")

回复收藏 0 原文

~没有更多了~