公司设计问我这样效果好不好做，正好赶上公司断网了，我就研究了下，感觉CAGroupAnimation加上CAShapeLayer可以实现，就写了下。最后也实现了。
先来拆分小动画，1.背景框收缩2，placeholder组动画。
①shapeLayer
CGRect roundRect = CGRectInset(self.bounds, 0, 10);
self.backgroundLayer = [CAShapeLayer layer];
self.backgroundLayer.frame = roundRect;
self.backgroundLayer.path = [self bezierPathWithRect:roundRect].CGPath;
self.backgroundLayer.lineWidth = 2.f;
self.backgroundLayer.strokeColor = [UIColor orangeColor].CGColor;
self.backgroundLayer.fillColor = [UIColor clearColor].CGColor;
self.backgroundLayer.strokeEnd = 1;
[self.layer addSublayer:self.backgroundLayer];
路劲：
-(UIBezierPath*)bezierPathWithRect:(CGRect)rect{
UIBezierPath* path = [UIBezierPath bezierPath];
[path moveToPoint:CGPointMake(CGRectGetHeight(rect)/2., 0)];
CGPoint centerL = CGPointMake(CGRectGetHeight(rect)/2., CGRectGetHeight(rect)/2.);
[path addArcWithCenter:centerL radius:CGRectGetHeight(rect)/2. startAngle:-M_PI_2 endAngle:M_PI_2 clockwise:0];
[path addLineToPoint:CGPointMake(CGRectGetWidth(rect) - CGRectGetHeight(rect)/2.,CGRectGetHeight(rect) )];
CGPoint centerR = CGPointMake(CGRectGetWidth(rect) - CGRectGetHeight(rect)/2., CGRectGetHeight(rect)/2.);
[path addArcWithCenter:centerR radius:CGRectGetHeight(rect)/2. startAngle:M_PI_2 endAngle:-M_PI_2 clockwise:0];
[path addLineToPoint:CGPointMake(CGRectGetHeight(rect)/2., 0)];
[path closePath];
return path;
}
收缩动画：
-(CAAnimation*)shapeLayerStrokeEndAnimationWithStroke:(CGFloat)strokeEnd fromValue:(CGFloat)fm{
CABasicAnimation* animation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
animation.toValue = [NSNumber numberWithFloat:strokeEnd];
animation.fromValue = [NSNumber numberWithFloat:fm];
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
animation.duration = .3f;
animation.removedOnCompletion = YES;
animation.autoreverses = NO;
return animation;
}
周长计算：
self.contentWidth = [self widthWithHeight:CGRectGetHeight(self.placeholdLabel.frame) text:self.placeholdLabel.text label:self.placeholdLabel]+ 4; //文本宽度多四个像素
//获取周长
self.perimeter = M_PI*CGRectGetHeight(roundRect) + (CGRectGetWidth(roundRect) - CGRectGetHeight(roundRect))*2;
②文本动画组：
UILabel*label = [[UILabel alloc] initWithFrame:CGRectMake(CGRectGetHeight(roundRect)/2. + 2, (CGRectGetHeight(self.bounds) / 2. - 20/2.), 35, 20)];
label.backgroundColor = [UIColor clearColor];
label.text = @"wmi";
label.textAlignment = NSTextAlignmentLeft;
label.textColor = [UIColor grayColor];
[self addSubview:label];
self.placeholdLabel = label;
动画：
-(CAAnimation*)placeholdLabelGroupFromCenter:(CGPoint)fmCt center:(CGPoint)center{
CABasicAnimation* tfAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation"];
tfAnimation.removedOnCompletion = NO;
tfAnimation.fillMode = kCAFillModeForwards;
tfAnimation.toValue = [NSNumber numberWithFloat: M_PI_2/3.];
tfAnimation.fromValue = [NSNumber numberWithFloat: 0];
tfAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
tfAnimation.duration = .2f;
tfAnimation.beginTime = 0.0f;
CABasicAnimation* psAnimation = [CABasicAnimation animationWithKeyPath:@"position"];
psAnimation.toValue = [NSValue valueWithCGPoint:center];
psAnimation.fromValue = [NSValue valueWithCGPoint:fmCt];
psAnimation.removedOnCompletion = NO;
psAnimation.fillMode = kCAFillModeForwards;
psAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
psAnimation.duration = .2f;
psAnimation.beginTime = 0.0f;
CABasicAnimation* tfAnimation1 = [CABasicAnimation animationWithKeyPath:@"transform.rotation"];
tfAnimation1.toValue = [NSNumber numberWithFloat:0];
tfAnimation1.removedOnCompletion = NO;
tfAnimation1.fillMode = kCAFillModeForwards;
tfAnimation1.fromValue = [NSNumber numberWithFloat:M_PI_2/3.];
tfAnimation1.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
tfAnimation1.duration = .2f;
tfAnimation1.beginTime = .2f;
CAAnimationGroup* group = [CAAnimationGroup animation];
group.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
group.duration = .4f;
group.animations = @[tfAnimation,psAnimation,tfAnimation1];
group.removedOnCompletion = NO;
group.fillMode = kCAFillModeForwards;
return group;
}
获取文本宽度
#pragma mark - 获取字符串的长度
-(CGFloat)widthWithHeight:(CGFloat)height text:(NSString*)text label:(UILabel*)label{
CGSize size = [text boundingRectWithSize:CGSizeMake(CGFLOAT_MAX, height)
options:NSStringDrawingTruncatesLastVisibleLine | NSStringDrawingUsesLineFragmentOrigin attributes:@{NSFontAttributeName:label.font,
NSForegroundColorAttributeName:label.textColor
} context:nil].size;
return size.width;
}
基本ok了，哈哈
原文地址：http://blog.csdn.net/growinggiant/article/details/43228107
