支付倒计时与圆环波纹动画效果

最新推荐文章于 2021-06-03 17:43:28 发布

末日山脉的日记

最新推荐文章于 2021-06-03 17:43:28 发布

阅读量512

点赞数

本文链接：https://blog.csdn.net/sunnysu99/article/details/76691267

版权

1.圆环的主要代码

NSArray * colors = [self graintFromColor:fromColor ToColor:toColor Count:4.0];
        for (int i = 0; i < colors.count -1; i++) {
            CAGradientLayer * graint = [CAGradientLayer layer];
            graint.bounds = CGRectMake(0,0,CGRectGetWidth(bounds)/2,CGRectGetHeight(bounds)/2);
            NSValue * valuePoint = [[self positionArrayWithMainBounds:self.bounds] objectAtIndex:i];
            graint.position = valuePoint.CGPointValue;
            UIColor * fromColor = colors[i];
            UIColor * toColor = colors[i+1];
            NSArray *colors = [NSArray arrayWithObjects:(id)fromColor.CGColor, toColor.CGColor, nil];
            NSNumber *stopOne = [NSNumber numberWithFloat:0.0];
            NSNumber *stopTwo = [NSNumber numberWithFloat:1.0];
            NSArray *locations = [NSArray arrayWithObjects:stopOne, stopTwo, nil];
            graint.colors = colors;
            graint.locations = locations;
            graint.startPoint = ((NSValue *)[[self startPoints] objectAtIndex:i]).CGPointValue;
            graint.endPoint = ((NSValue *)[[self endPoints] objectAtIndex:i]).CGPointValue;
            [self addSublayer:graint];
            //Set mask
            CAShapeLayer * shapelayer = [CAShapeLayer layer];
            CGRect rect = CGRectMake(0,0,CGRectGetWidth(self.bounds) - 2 * linewidth, CGRectGetHeight(self.bounds) - 2 * linewidth);
            shapelayer.bounds = rect;
            shapelayer.position = CGPointMake(CGRectGetWidth(self.bounds)/2, CGRectGetHeight(self.bounds)/2);
            shapelayer.strokeColor = [UIColor blueColor].CGColor;
            shapelayer.fillColor = [UIColor clearColor].CGColor;
            shapelayer.path = [UIBezierPath bezierPathWithRoundedRect:rect cornerRadius:CGRectGetWidth(rect)/2].CGPath;
            shapelayer.lineWidth = linewidth;
            shapelayer.lineCap = kCALineCapRound;
            shapelayer.lineJoin =kCALineCapRound;
            shapelayer.strokeStart = 0.01;
            shapelayer.strokeEnd = 0.99;
            [self setMask:shapelayer];
           
        }

2.波纹

-(void)drawRect:(CGRect)rect {
    [super drawRect:rect];
    
    UIColor  * color = [UIColor clearColor];
    [color setFill];
    UIRectFill(rect);
    
    
    NSInteger pulsingCount = 2;
    double animationDuration = 6;
    CALayer * animationLayer = [CALayer layer];
    for (int i = 0; i < pulsingCount; i++) {
        CALayer * pulsingLayer = [CALayer layer];
        pulsingLayer.frame = CGRectMake(0, 0, rect.size.width, rect.size.height);
        pulsingLayer.borderColor = [UIColor blackColor].CGColor;
        pulsingLayer.borderWidth = 1;
        pulsingLayer.cornerRadius = rect.size.height / 2;
        
        CAMediaTimingFunction * defaultCurve = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionDefault];
        
        CAAnimationGroup * animationGroup = [CAAnimationGroup animation];
        animationGroup.fillMode = kCAFillModeBackwards;
        animationGroup.beginTime = CACurrentMediaTime() + (double)i * animationDuration / (double)pulsingCount;
        animationGroup.duration = animationDuration;
        animationGroup.repeatCount = HUGE;
        animationGroup.timingFunction = defaultCurve;
        
        CABasicAnimation * scaleAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
        scaleAnimation.fromValue = @1.4;
        scaleAnimation.toValue = @2.2;
        
        CAKeyframeAnimation * opacityAnimation = [CAKeyframeAnimation animationWithKeyPath:@"opacity"];
        opacityAnimation.values = @[@1, @0.9, @0.8, @0.7, @0.6, @0.5, @0.4, @0.3, @0.2, @0.1, @0];
        opacityAnimation.keyTimes = @[@0, @0.1, @0.2, @0.3, @0.4, @0.5, @0.6, @0.7, @0.8, @0.9, @1];
        
        animationGroup.animations = @[scaleAnimation, opacityAnimation];
        [pulsingLayer addAnimation:animationGroup forKey:@"plulsing"];
        [animationLayer addSublayer:pulsingLayer];
    }
    [self.layer addSublayer:animationLayer];
}

3.倒计时

- (void)secondsCountDown:(UILabel *)label

{
    
    __block int timeout = 1800;
    
    dispatch_queue_t queue = dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0);
    
    dispatch_source_t _timer = dispatch_source_create(DISPATCH_SOURCE_TYPE_TIMER, 0, 0, queue);
    
    dispatch_source_set_timer(_timer, dispatch_walltime(NULL, 0), 1.0*NSEC_PER_SEC, 0);//每秒执行
    
    dispatch_source_set_event_handler(_timer, ^{
        
        if (timeout<=0) {
            
            dispatch_source_cancel(_timer);
            
            dispatch_async(dispatch_get_main_queue(), ^{
                
                NSLog(@"计时结束");
            });
            
        }else {
            int minutes = timeout/60;
            
            int seconds = timeout%60;
            NSString *strTime = [NSString stringWithFormat:@"%02d : %02d ", minutes, seconds];
            dispatch_async(dispatch_get_main_queue(), ^{
                label.text = [NSString stringWithFormat:@"%@",strTime];//支付剩余时间
            });
            timeout--;
        }
        
    });
    dispatch_resume(_timer);
}

4.注意点

倒计时时，如果用的是xib，要把type类型从system改成custom

5.demo下载连接

http://download.csdn.net/detail/sunnysu99/9921611