封装了一个iOS环形加载动画和成功对号效果

请添加图片描述

这里要注意一个地方,如果我们这里不设置
_checkLayer.fillColor = [UIColor clearColor].CGColor;
的话,就会造成一个后果,就是,从七点到终点和走过的line中间的地方会有黑色,所以这里要特别注意,fillColor 设置成clearcolor
如果不设置的话,效果就是下面的样子
请添加图片描述

代码在这里

//
//  LBLoadingCheckView.m
//  TEXT
//
//  Created by mac on 2024/5/22.
//  Copyright © 2024 刘博. All rights reserved.
//

#import "LBLoadingCheckView.h"

@interface LBLoadingCheckView ()

@property (nonatomic, strong) CAShapeLayer *progressLayer;

@property (nonatomic, strong) UIView *checkView;

@property (nonatomic, strong) CAShapeLayer *checkLayer;

@property (nonatomic, strong) CABasicAnimation *animation;

@end


@implementation LBLoadingCheckView

- (instancetype)initWithFrame:(CGRect)frame
{
    if (self = [super initWithFrame:frame]) {
        [self setUpUI];
    }
    return self;
}

- (void)setUpUI
{
    self.frame = CGRectMake(0, 0, 37, 47);
    self.layer.masksToBounds = YES;
    self.layer.cornerRadius = 4;
    self.backgroundColor = [UIColor blackColor];
    [self.layer addSublayer:self.progressLayer];
    [self addSubview:self.checkView];
    [self.checkView.layer addSublayer:self.checkLayer];
}

- (void)showProgress:(CGFloat)progress
{
    self.progressLayer.strokeEnd = progress;
    if (progress >= 0.99) {
        self.progressLayer.hidden = YES;
        self.checkView.hidden = NO;
        [self.checkLayer addAnimation:self.animation forKey:@"strokeEnd"];
    }
}

#pragma mark - lazy load

- (CAShapeLayer *)progressLayer
{
    if (!_progressLayer) {
        UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(18.25, 30) radius:11 startAngle:-M_PI_2 endAngle:-M_PI_2 + M_PI * 2 clockwise:YES];
        _progressLayer = [[CAShapeLayer alloc] init];
        _progressLayer.strokeColor = [UIColor whiteColor].CGColor;
        _progressLayer.fillColor = [UIColor clearColor].CGColor;
        _progressLayer.lineWidth = 2;
        _progressLayer.frame = CGRectMake(0, 0, 32.5, 43);
        _progressLayer.path = path.CGPath;
        _progressLayer.strokeStart = 0;
        _progressLayer.strokeEnd = 1;
    }
    return _progressLayer;
}

- (UIView *)checkView
{
    if (!_checkView) {
        _checkView = [[UIView alloc] initWithFrame:CGRectMake(10, 20, 20, 20)];
        _checkView.backgroundColor = [UIColor whiteColor];
        _checkView.layer.masksToBounds = YES;
        _checkView.layer.cornerRadius = 10;
        _checkView.hidden = YES;
        _checkView.backgroundColor = [UIColor greenColor];
    }
    return _checkView;
}

- (CAShapeLayer *)checkLayer
{
    if (!_checkLayer) {
        UIBezierPath *path = [[UIBezierPath alloc] init];
        path.lineCapStyle = kCGLineCapRound;
        path.lineJoinStyle = kCGLineJoinRound;
        [path moveToPoint:CGPointMake(5, 11)];
        CGPoint pl = CGPointMake(9, 14);
        [path addLineToPoint:pl];
        
        CGPoint p2 = CGPointMake(15, 6);
        [path addLineToPoint:p2];
        _checkLayer = [[CAShapeLayer alloc] init];
        _checkLayer.fillColor = [UIColor clearColor].CGColor;
        _checkLayer.strokeColor = [UIColor blackColor].CGColor;
        _checkLayer.lineWidth = 2;
        _checkLayer.path = path.CGPath;
    }
    return _checkLayer;
}

- (CABasicAnimation *)animation
{
    if (!_animation) {
        _animation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
        _animation.fromValue = @(0);
        _animation.toValue = @(1);
        _animation.duration = 0.5;
    }
    return _animation;
}

@end

  • 3
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值