UIBezierPath和CAShapeLayer 简单画圆

来源:互联网 发布:mysql mac安装包 编辑:程序博客网 时间:2024/05/21 21:02

//

//  WSQCustomProgressView.h

//  Demo

//

//  Created by webapps on 17/3/6.

//  Copyright © 2017 Passion. All rights reserved.

//



#import <UIKit/UIKit.h>



@interface WSQCustomProgressView :UIView


@property(nonatomic,assign) CGFloat circleWidth;//圆宽

@property(nonatomic,strongUIColor * backCircleClor;//背景圆环的颜色

@property(nonatomic,strongUIColor * progresCircleClor;//进度条圆环的颜色

@property(nonatomic,assignBOOL hidePercentL;//是否隐藏百分比Lable

@property(nonatomic,strongUIColor * percentLClor;//百分比Lable的颜色


// 开始创建Circle

- (void)createCricle;

//开始绘制

-(void)stareAnimationWithPercentage:(CGFloat )percent;

@end











//

//  WSQCustomProgressView.m

//  Demo

//

//  Created by webapps on 17/3/6.

//  Copyright © 2017 Passion. All rights reserved.

//


/*    思路

 

   View加两个Layer一个为底部的灰色,一个为深色,控制只有绘制图的时间

 

 

 */







#import "WSQCustomProgressView.h"

#define RGB(r,g,b,a) [UIColor colorWithRed:r/255.0 green:g/255.0 blue:b/255.0 alpha:a]


@interface WSQCustomProgressView()


@property (nonatomic,strong) CAShapeLayer *backgroundLayer;//背景圆

@property (nonatomic,strong) CAShapeLayer *progressLayer;//进度圆

@property (nonatomic,strong) UILabel      *percentLable;//百分比按钮


@end



@implementation WSQCustomProgressView


- (instancetype)initWithFrame:(CGRect)frame{

    self = [superinitWithFrame:frame];

    if (self) {

        

        //初始化view

        self.backgroundColor = [UIColorclearColor];

        

        //默认圆宽度4

        _circleWidth =4;

        //默认背景圆环为淡淡灰色

        _backCircleClor =RGB(240,240, 240,1);

        //默认进度圆环为橙色

        _progresCircleClor = [UIColororangeColor];

        //默认显示百分比Lable

        _hidePercentL =NO;

        //默认显示百分比字体颜色我淡黑色

        _percentLClor =RGB(212,212, 213,1);

        

    }

 

    returnself;

}



//开始创建圆环

- (void)createCricle{

    

    

    CGFloat radius = (CGRectGetWidth(self.bounds) - _circleWidth)/2;

    

    //灰色背景圆环

    _backgroundLayer = [selfcreateLayerWithFillColor:[UIColorclearColor]StrokeColor:_backCircleClorlineWidth:_circleWidthradius:radius];

    //显示进度的圆环

    _progressLayer = [selfcreateLayerWithFillColor:[UIColorclearColor]StrokeColor:_progresCircleClorlineWidth:_circleWidthradius:radius];

    _progressLayer.strokeEnd =0;

    

  

    [self.layeraddSublayer:_backgroundLayer];

    [self.layeraddSublayer:_progressLayer];

    

    [selfcreatePercentLable];


    

  

    

}




//创建百分比Lable

- (void)createPercentLable{


    CGFloat w =self.bounds.size.width;

    CGFloat H =self.bounds.size.height/2;

    

    _percentLable = [[UILabelalloc]initWithFrame:CGRectMake(0, H - 15, w,30)];

    _percentLable.hidden =_hidePercentL;

    _percentLable.textColor =_percentLClor;

    _percentLable.textAlignment =NSTextAlignmentCenter;

    _percentLable.backgroundColor = [UIColorclearColor];

    [selfaddSubview:_percentLable];

}


/**

 对圆环做处理


 @param fillColor 圆环的内部填充颜色

 @param strokeColor 圆环圆填充的颜色

 @param linewidth 圆环宽度

 @param radius 角度

 @return 返回layer

 */

- (CAShapeLayer *)createLayerWithFillColor:(UIColor *)fillColor StrokeColor:(UIColor *)strokeColor lineWidth:(CGFloat)linewidth radius:(CGFloat)radius{

        

    CAShapeLayer *layer = [CAShapeLayerlayer];

    layer.bounds =self.bounds;

    layer.anchorPoint =CGPointMake(0,0);

    layer.lineWidth = linewidth;

    layer.fillColor = fillColor.CGColor;

    layer.strokeColor = strokeColor.CGColor;

    

    // 1/4 pi处起绘制

    UIBezierPath *bPath = [UIBezierPathbezierPathWithArcCenter:CGPointMake(CGRectGetMidX(self.bounds),CGRectGetMidY(self.bounds))radius:radius startAngle:M_PI_2endAngle:M_PI*2 +M_PI_2 clockwise:YES];

    

    layer.path = bPath.CGPath;

    

    return layer;

        

    }



/**

  开始执行绘制


 @param percent 百分比

 */

- (void)stareAnimationWithPercentage:(CGFloat)percent{

    

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

    basic.timingFunction = [CAMediaTimingFunctionfunctionWithName:kCAMediaTimingFunctionLinear];

    basic.duration =5;//绘制时间

    basic.fromValue =@(0);//起始,

    basic.toValue =@(percent);//结束

    basic.removedOnCompletion =NO;//动画执行完成后不删除动画

    basic.fillMode =@"forwards";

    [_progressLayeraddAnimation:basic forKey:nil];

    

    int prer = (int)(percent *100);

    _percentLable.text = [NSStringstringWithFormat:@"%d%@",prer,@"%"];

    

}


@end



1 0
原创粉丝点击