iOS中下载指示剂,一个点转圈圈

1.在下载过程中,对于文件比较的下载,在还没有开始下载前,我们一般需要来一个指示图像,下载过程中我们就显示下载的进度,这里我们来使用UIBezierPath和CAKeyframeAnimation做一个简单的动画转圈圈效果


1.gif

2.上代码.由于代码功能主要是实现在下载过程的进度,针对只要转圈圈可能有几句代码不需要,请自己酌情处理

#import "loopView.h"
#import "UIView+HHAddition.h"
@interface loopView()
@property (nonatomic,strong)CALayer *animationCircle;
@end
@implementation loopView

-(void)drawRect:(CGRect)rect{
    [super drawRect:rect];
    CGPoint center = CGPointMake(self.width * 0.5, self.height * 0.5);
    
    UIBezierPath *backPath = [UIBezierPath bezierPathWithArcCenter:center radius:self.width * 0.25 startAngle:0 endAngle:2 * M_PI clockwise:YES];
    backPath.lineWidth = 2;
    [[UIColor whiteColor] set];
    [backPath stroke];
    
    [self.layer addSublayer:self.animationCircle];
    CAKeyframeAnimation *pathAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    pathAnimation.calculationMode = kCAAnimationPaced;
    pathAnimation.fillMode = kCAFillModeForwards;
    pathAnimation.removedOnCompletion = NO;
    pathAnimation.duration = 4.0;
    pathAnimation.repeatCount = 10000;
    pathAnimation.path = backPath.CGPath;
    [self.animationCircle addAnimation:pathAnimation forKey:nil];
    
}
- (CALayer *)animationCircle{
    if (!_animationCircle) {
        _animationCircle = [CALayer layer];
        _animationCircle.frame = CGRectMake(0, 0, 4, 4);
        _animationCircle.cornerRadius = 2;
        _animationCircle.backgroundColor = [UIColor blueColor].CGColor;
    }
    return _animationCircle;
}
@end
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 最近需要写个进度条动画,之前在github上看到JSDownloadView时就想也自己实现一个,于是就去网上找了...
    karthus阅读 11,366评论 17 171
  • 前言 本文只要描述了iOS中的Core Animation(核心动画:隐式动画、显示动画)、贝塞尔曲线、UIVie...
    GitHubPorter阅读 3,659评论 7 11
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,198评论 4 61
  • 我是一个对爱情渴望而又对此害怕的胆小鬼。因此,我爱的人从未察觉到,爱我的人也会受伤。我很想谈一次恋爱,尝尝除了暗恋...
    冷鸟阅读 327评论 0 1
  • 14:00嫉妒和幸灾乐祸的坏种子 +帮同事拿抽纸,供同事使用 -客户迟迟不给钱,拿不到工资 正面对治:随喜他人,为...
    雅子12345阅读 119评论 0 0