路径动画

@interface HJHPullDownView : UIView
- (void)startAnim;

@end
@interface HJHPullDownView ()

@property (nonatomic ,retain) UIBezierPath *path;
@property (nonatomic ,retain) CAShapeLayer * shapeLayer ;
@end

@implementation HJHPullDownView

- (UIBezierPath *)path
{
    if (!_path)
    {
        _path = [UIBezierPath bezierPath];
    }
    return _path;
}
- (CAShapeLayer *)shapeLayer
{
    if (!_shapeLayer)
    {
        _shapeLayer = [CAShapeLayer layer];
    }
    return _shapeLayer;
}
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
    // 清空画线
    [_shapeLayer removeFromSuperlayer];
    
    UITouch *touch = [touches anyObject];
    // 获取手指的触摸点
    CGPoint curP = [touch locationInView:self];
    
    [self.path moveToPoint:curP];
}
- (void)touchesMoved:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
    UITouch *touch = [touches anyObject];
    
    // 获取手指的触摸点
    CGPoint curP = [touch locationInView:self];
    
    [self.path addLineToPoint:curP];
    [self setNeedsDisplay];
    
}
- (void)drawRect:(CGRect)rect
{
    [self.path stroke];
}
// 跟随路径而动画
- (void)startAnim
{    
    self.shapeLayer.path = self.path.CGPath;
    
    _shapeLayer.fillColor = [UIColor whiteColor].CGColor;
    
    _shapeLayer.strokeColor = [UIColor redColor].CGColor;
    
    _shapeLayer.strokeEnd = 1; //图层画百分之多少
    
    [self.layer addSublayer:_shapeLayer];
    
    CABasicAnimation *anim = [CABasicAnimation animation];
    
    anim.keyPath = @"strokeEnd";
    
    anim.fromValue = @0;
    
    anim.toValue = @1;
    
    anim.duration = 2;
    
    [_shapeLayer addAnimation:anim forKey:nil];
    
    
    // 清空画线
    [self.path removeAllPoints];
    
    [self setNeedsDisplay];
}
@end

621EF14B-F26B-4B5E-B746-8FBB0191861F.png

点击按钮开始 描绘上面的路径动画

51AE4F8C-32D5-4CA3-82FB-7A603A8A412A.png
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容