美文网首页
简单的圆圈动画,自己看的

简单的圆圈动画,自己看的

作者: 与世倾听X游定终生 | 来源:发表于2016-01-17 23:23 被阅读110次

圆圈动画

-(UIView*)circleViewWithColor:(UIColor*)color Title:(NSString*)title titleValue:(NSString*)titleValue{

UIView*circleView = [[UIViewalloc]init];

circleView.layer.cornerRadius=30;

circleView.layer.masksToBounds=YES;

//底部的灰色圆圈

CAShapeLayer*bottomShapeLayer = [CAShapeLayerlayer];

bottomShapeLayer.strokeColor=XKColor(229,229,229).CGColor;

bottomShapeLayer.fillColor= [UIColorclearColor].CGColor;

bottomShapeLayer.lineWidth=3;

bottomShapeLayer.path= [UIBezierPathbezierPathWithRoundedRect:CGRectMake(0,0,60,60)cornerRadius:30].CGPath;

[circleView.layeraddSublayer:bottomShapeLayer];

///橘黄色的layer

CAShapeLayer*ovalShapeLayer = [CAShapeLayerlayer];

ovalShapeLayer.strokeColor= color.CGColor;

ovalShapeLayer.fillColor= [UIColorclearColor].CGColor;

ovalShapeLayer.lineWidth=3;

ovalShapeLayer.path= [UIBezierPathbezierPathWithRoundedRect:CGRectMake(0,0,60,60)cornerRadius:30].CGPath;

[circleView.layerinsertSublayer:ovalShapeLayerabove:bottomShapeLayer];

///起点动画

//CABasicAnimation * strokeStartAnimation = [CABasicAnimation animationWithKeyPath:@"strokeStart"];

//strokeStartAnimation.fromValue = @(1.0);

//strokeStartAnimation.toValue = @(0.2);

///终点动画

CABasicAnimation* strokeEndAnimation = [CABasicAnimationanimationWithKeyPath:@"strokeEnd"];

strokeEndAnimation.fromValue=@(0.0);

NSString*tempStr;

if([titleValuerangeOfString:@"%"].length) {

tempStr = [titleValuesubstringToIndex:titleValue.length-1];

}else{

tempStr = titleValue;

}

CGFloatscale = [tempStrfloatValue] /100.0;

strokeEndAnimation.toValue=@(scale >1?1:scale);

///组合动画

CAAnimationGroup*animationGroup = [CAAnimationGroupanimation];

animationGroup.animations=@[strokeEndAnimation];

animationGroup.duration=1.0;

animationGroup.timingFunction= [CAMediaTimingFunctionfunctionWithName:kCAMediaTimingFunctionEaseOut];

animationGroup.repeatCount=1;

animationGroup.fillMode=kCAFillModeForwards;

animationGroup.removedOnCompletion=NO;

[ovalShapeLayeraddAnimation:animationGroupforKey:nil];

UILabel*circleTitle = [[UILabelalloc]init];

circleTitle.text= title;

circleTitle.textColor=XKSubTitleOrContentColor;

circleTitle.font= [UIFontsystemFontOfSize:10];

[circleViewaddSubview:circleTitle];

UILabel*circleValue = [[UILabelalloc]init];

circleValue.text= titleValue;

circleValue.textColor= color;

circleValue.font= [UIFontsystemFontOfSize:16];

[circleViewaddSubview:circleValue];

//[_circleView mas_makeConstraints:^(MASConstraintMaker *make) {

//make.top.equalTo(_workPosition.mas_bottom).offset(10);

//make.centerX.equalTo(weakself.mas_centerX);

//make.size.mas_equalTo(CGSizeMake(60, 60));

//}];

[circleTitlemas_makeConstraints:^(MASConstraintMaker*make) {

make.centerY.equalTo(circleView.mas_centerY).offset(-10);

make.centerX.equalTo(circleView.mas_centerX);

}];

[circleValuemas_makeConstraints:^(MASConstraintMaker*make) {

make.centerY.equalTo(circleView.mas_centerY).offset(10);

make.centerX.equalTo(circleTitle.mas_centerX);

}];

returncircleView;

}

宽度限制伸缩

NSLog(@"%f----%f",CGRectGetMinX(_DistanceLabel.frame),CGRectGetMaxX(_userHeadImageView.frame));

CGFloatwidth = (CGRectGetMinX(_DistanceLabel.frame) -20) - (CGRectGetMaxX(_userHeadImageView.frame) +8);

[_userNamemas_makeConstraints:^(MASConstraintMaker*make) {

make.left.equalTo(_userHeadImageView.mas_right).offset(8);

make.width.mas_equalTo(width);

}];

NSLog(@"----%@",NSStringFromCGRect(_userName.frame));

相关文章

  • 简单的圆圈动画,自己看的

    圆圈动画-(UIView*)circleViewWithColor:(UIColor*)color Title:(...

  • SwiftUI-圆圈进度条

    实现圆圈进度条动画

  • 脉冲动画的使用

    脉冲动画, 就是类似一个圆圈向外扩散的效果,多用于搜索场景 一: 实现思路:脉冲动画,实质上可以把扩散的圆圈看成一...

  • 贝塞尔曲线加载动画 | BesselLoadingView

    BesselLoadingView是一个利用贝塞尔曲线绘制的圆圈加载动画,原理是在画布上画三个圆圈,中间有个小圆圈...

  • ios 转场动画的制作

    直接看转场动画的协议时有点迷糊,做了一个简单的demo记录下理解过程 一、如何更改动画方式 站在自己的角度,最简单...

  • layer动画总结

    layer的属性 条形 波浪 波纹 翻转 画圆圈 动的三角形 网格动画 转圈动画

  • CALayer旋转动画

    需求是绘制一个缺口的圆圈,然后自转。 1.绘制缺口的圆圈 2.对圆圈加旋转动画 如果按上述代码运行起来,你会发现这...

  • App彩色连连看

    简单好玩的彩色连连看。可以连接相同颜色的圆圈,直连斜连都可以,连接的圆圈越多分越高,过关也就越快,难度也会相应的提...

  • iOS 广告倒计时的转圈动画

    一个小而简单的动画,项目中是用来广告倒计时的,简单封装了一下,圆圈的大小、颜色以及倒计时时间等都可以自行设定。 先...

  • 一个水波涟漪/声波动画的实现

    思考 类似上图中的水波效果怎样实现? 首先需要几个圆圈; 需要做放大动画(radius); 需要做Alpha的动画...

网友评论

      本文标题:简单的圆圈动画,自己看的

      本文链接:https://www.haomeiwen.com/subject/drbckttx.html