码迷,mamicode.com
首页 > 其他好文 > 详细

模拟下载进度动画 (动画监听)

时间:2015-10-29 14:43:11      阅读:215      评论:0      收藏:0      [点我收藏+]

标签:

//监听事件
-(void)setUpSomething{
    UITapGestureRecognizer *tapGes = [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(tapped:)];
    [
self addGestureRecognizer:tapGes];
}

//点击动画
#pragma mark -- UITapGesture
-(void)tapped:(UITapGestureRecognizer *)tapped{
   
originframe = self.frame;
   
   
if (animating == YES) {
       
return;
    }
   
   
for (CALayer *subLayer in self.layer.sublayers) {
        [subLayer
removeFromSuperlayer];
    }
   
    self.backgroundColor = [UIColor colorWithRed:0.0 green:122/255.0 blue:255/255.0 alpha:1.0];
    animating = YES;
    self.layer.cornerRadius = self.progressBarHeight/2;
   
   
//注意:[UIView animate]的方法里只能对UIView的属性进行动画,对于layer的属性是无效的。比如你在这里想让self.AnimateView.layer.cornerRadius = 50.0; 是没有意义的。必须使用CoreAnimation
   
CABasicAnimation *radiusAnimation = [CABasicAnimation animationWithKeyPath:@"cornerRadius"];
    radiusAnimation.
duration = 0.2f;
    radiusAnimation.
timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
    radiusAnimation.
fromValue = @(originframe.size.height/2);
   
   
//不需要设置toValue
    radiusAnimation.
delegate = self;
    [
self.layer addAnimation:radiusAnimation forKey:@"cornerRadiusShrinkAnim"];

}

-(void)animationDidStart:(CAAnimation *)anim{
   
   
//这里介绍两种方式区分不同的anim 1、对于加在一个全局变量上的anima,比如例子里的self.AnimateView ,这是一个全局变量,所以我们在这里可以通过[self.AnimateView.layer animationForKey:]根据动画不同的key来区分
   
//2、然而对于一个非全局的变量,比如demo中的progressLayer,可以用KVO:[pathAnimation setValue:@"strokeEndAnimation" forKey:@"animationName"];注意这个animationName是我们自己设定的。
   
   
if ([anim isEqual:[self.layer animationForKey:@"cornerRadiusShrinkAnim"]]) {
       
        [
UIView animateWithDuration:0.6f delay:0.0f usingSpringWithDamping:0.6 initialSpringVelocity:0.0 options:UIViewAnimationOptionCurveEaseOut animations:^{
           
self.bounds = CGRectMake(0, 0, _progressBarWidth, _progressBarHeight);
        }
completion:^(BOOL finished) {
            [
self.layer removeAllAnimations];
            [
self progressBarAnimation];
        }];
       
    }
else if ([anim isEqual:[self.layer animationForKey:@"cornerRadiusExpandAnim"]]){
       
        [
UIView animateWithDuration:0.6f delay:0.0f usingSpringWithDamping:0.6 initialSpringVelocity:0.0 options:UIViewAnimationOptionCurveEaseOut animations:^{
           
self.bounds = CGRectMake(0, 0, originframe.size.width, originframe.size.height);
           
self.backgroundColor = [UIColor colorWithRed:0.1803921568627451 green:0.8 blue:0.44313725490196076 alpha:1.0];
        }
completion:^(BOOL finished) {
            [
self.layer removeAllAnimations];
            [
self checkAnimation];
           
//-----
           
animating = NO;
        }];
       
    }
}


-(
void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag{
   
   
if ([[anim valueForKey:@"animationName"]isEqualToString:@"progressBarAnimation"]){
       
        [
UIView animateWithDuration:0.3 animations:^{
           
for (CALayer *subLayer in self.layer.sublayers) {
                subLayer.
opacity = 0.0f;
            }
        }
completion:^(BOOL finished) {
           
if (finished) {
               
for (CALayer *subLayer in self.layer.sublayers) {
                    [subLayer
removeFromSuperlayer];
                }
               
               
self.layer.cornerRadius = originframe.size.height/2;
               
               
CABasicAnimation *radiusAnimation = [CABasicAnimation animationWithKeyPath:@"cornerRadius"];
                radiusAnimation.
duration = 0.2f;
                radiusAnimation.
timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
                radiusAnimation.
fromValue = @(_progressBarHeight/2);
               
                radiusAnimation.
delegate = self;
                [
self.layer addAnimation:radiusAnimation forKey:@"cornerRadiusExpandAnim"];
               
            }
        }];
       
    }

}

//开始进度动画
-(
void)progressBarAnimation{
   
   
CAShapeLayer *progressLayer = [CAShapeLayer layer];
   
UIBezierPath *path = [UIBezierPath bezierPath];
    [path
moveToPoint:CGPointMake(_progressBarHeight/2, self.bounds.size.height/2)];
    [path
addLineToPoint:CGPointMake(self.bounds.size.width-_progressBarHeight/2, self.bounds.size.height/2)];
   
    progressLayer.
path = path.CGPath;
    progressLayer.
strokeColor = [UIColor greenColor].CGColor;
    progressLayer.
lineWidth = _progressBarHeight-4;
    progressLayer.
lineCap = kCALineCapRound;
   
//设置了kCALineCapRound 那么圆角弧度自动被设为 lineWidth/2 .所以要想进度条距离外围的间距相等,起始点的 x 坐标应该等于满足公式 x=lineWidth/2+space; lineWidth _progressBarHeight-space*2 x = height/2. linewidth 是多少并没有关系
    [
self.layer addSublayer:progressLayer];
   
   
CABasicAnimation *pathAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
    pathAnimation.
duration = 1.0f;
    pathAnimation.
fromValue = @(0.0f);
    pathAnimation.
toValue = @(1.0f);
    pathAnimation.
delegate = self;
    [pathAnimation
setValue:@"progressBarAnimation" forKey:@"animationName"];
    [progressLayer
addAnimation:pathAnimation forKey:nil];
   
}


//完成后钩钩动画
-(
void)checkAnimation{
   
   
CAShapeLayer *checkLayer = [CAShapeLayer layer];
   
   
   
UIBezierPath *path = [UIBezierPath bezierPath];
   
CGRect rectInCircle = CGRectInset(self.bounds, self.bounds.size.width*(1-1/sqrt(2.0))/2, self.bounds.size.width*(1-1/sqrt(2.0))/2);
    [path
moveToPoint:CGPointMake(rectInCircle.origin.x + rectInCircle.size.width/9, rectInCircle.origin.y + rectInCircle.size.height*2/3)];
    [path
addLineToPoint:CGPointMake(rectInCircle.origin.x + rectInCircle.size.width/3,rectInCircle.origin.y + rectInCircle.size.height*9/10)];
    [path
addLineToPoint:CGPointMake(rectInCircle.origin.x + rectInCircle.size.width*8/10, rectInCircle.origin.y + rectInCircle.size.height*2/10)];
   
    checkLayer.
path = path.CGPath;
    checkLayer.
fillColor = [UIColor clearColor].CGColor;
    checkLayer.
strokeColor = [UIColor whiteColor].CGColor;
    checkLayer.
lineWidth = 5.0;
    checkLayer.
lineCap = kCALineCapRound;
    checkLayer.
lineJoin = kCALineJoinRound;
    [
self.layer addSublayer:checkLayer];
   
   
   
//增加画画的时间
   
CABasicAnimation *checkAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
    checkAnimation.
duration = 0.3f;
    checkAnimation.
fromValue = @(0.0f);
    checkAnimation.
toValue = @(1.0f);
    checkAnimation.
delegate = self;
    [checkAnimation
setValue:@"checkAnimation" forKey:@"animationName"];
    [checkLayer
addAnimation:checkAnimation forKey:nil];
   
   
   
}

模拟下载进度动画 (动画监听)

标签:

原文地址:http://www.cnblogs.com/qiugaoying/p/4920454.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!