iOS 利用CoreGraphics绘制一个卸货的状态进度

效果图：

卸货流程图.gif

接触了一点CoreGraphics，项目中的卸货状态图，不想用view，就画一个 ，做个记录。

调用方法：

#import "ViewController.h"
#import "FTProgressView.h"

#define Device_Height [[UIScreen mainScreen] bounds].size.height
#define Device_Width  [[UIScreen mainScreen] bounds].size.width//获取屏幕宽高
@interface ViewController ()
@property(nonatomic,strong)FTProgressView *progressView;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    self.progressView =[[FTProgressView alloc]initWithFrame:CGRectMake(0, 100, Device_Width, 62) titleArray:@[@"已接单",@"已装货",@"运输中",@"已卸货",@"已完成"]];
    self.progressView.backgroundColor =[UIColor whiteColor];
    [self.view addSubview:self.progressView];
    
    self.progressView.index = 2;
}

-(void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
    self.progressView.index = arc4random()%5;
    NSLog(@"%ld",self.progressView.index);
}

#####实现：
#import <UIKit/UIKit.h>

@interface FTProgressView : UIView
@property(nonatomic,assign)NSInteger index; //确定哪个状态
-(instancetype)initWithFrame:(CGRect)frame titleArray:(NSArray *)titleArray;

@end

#import "FTProgressView.h"
#import "UIColor+Expanded.h"
#define leftSpace 25
#define lineH 4
#define smallH 15
#define smallneiH 13
#define bigH 20
#define CGRect(f)  CGRectMake(leftSpace- f/2 + i * avaWidth, (height -f)/2, f, f)

@interface FTProgressView()
@property(nonatomic,assign)NSInteger statusNum;
@property(nonatomic,strong)NSArray *titleArray;
@property(nonatomic,strong)UIColor *color1;
@property(nonatomic,strong)UIColor *color2;

@end
@implementation FTProgressView

-(instancetype)initWithFrame:(CGRect)frame titleArray:(NSArray *)titleArray{
    self = [super initWithFrame:frame];
    if (self) {
        self.titleArray = titleArray;
    }
    return self;
}
-(void)setIndex:(NSInteger)index{
    _index = index;
    [self setNeedsDisplay];
}
- (void)drawRect:(CGRect)rect {
    CGFloat height = rect.size.height;
    CGFloat width = rect.size.width;

    CGContextRef context = UIGraphicsGetCurrentContext();
    
    CGContextSetFillColorWithColor(context, self.color1.CGColor);
    
    
    CGContextFillRect(context, CGRectMake(leftSpace, (height - lineH)/2, width-2 *leftSpace , lineH));
    [self drawCircle];
    
    [self drawLabel];
}
-(void)drawCircle
{
    CGFloat height = self.frame.size.height;
    CGFloat width = self.frame.size.width;
 
    CGFloat circleWidth = width - 2* leftSpace;
    CGFloat avaWidth = circleWidth /(self.titleArray.count -1);

    for (int i =0; i< self.titleArray.count; i++) {
        
        if (i == self.index) {

            [self FillPathWithRect:CGRect(bigH) fillColor:self.color1]; //绘制大圆
        }else{

            [self FillPathWithRect:CGRect(smallH) fillColor:self.color1];
            [self FillPathWithRect:CGRect(smallneiH) fillColor:self.color2];
        }
        
    }
    
}
-(void)FillPathWithRect:(CGRect) rect fillColor:(UIColor *)fillColor{
    
    CGContextRef context = UIGraphicsGetCurrentContext();

    
    CGContextSetFillColorWithColor(context, fillColor.CGColor);
    
    
    CGContextAddEllipseInRect(context, rect);
    
    CGContextFillPath(context);
    
    
}
-(void)drawLabel
{
    
    CGFloat height = self.frame.size.height;
    CGFloat width = self.frame.size.width;
    
     CGFloat circleWidth = width - 2* leftSpace;
    
    CGFloat avaWidth = circleWidth /(self.titleArray.count -1);
    
    for (int i = 0; i<self.titleArray.count; i++) {
        
        NSAttributedString *attStr =[[NSAttributedString alloc]initWithString:self.titleArray[i] attributes:@{NSFontAttributeName:[UIFont systemFontOfSize:12],NSForegroundColorAttributeName:[UIColor hexStringToColor:@"3c3c3c"]}];
        
        if (i < self.index) {
            CGPoint point = CGPointMake(leftSpace +avaWidth *i-attStr.size.width/2, height/2 -bigH/2-1 -attStr.size.height);
            [attStr drawAtPoint:point];
        }else{
            CGPoint point = CGPointMake(leftSpace +avaWidth *i-attStr.size.width/2, height/2 +bigH/2+1);
            [attStr drawAtPoint:point];

        }
        
    }
}

-(UIColor *)color1{
    if (!_color1) {
        _color1 =[UIColor hexStringToColor:@"393d63"];
    }
    return _color1;
}
-(UIColor *)color2{
    if (!_color2) {
        _color2 =[UIColor hexStringToColor:@"ffffff"];
    }
    return _color2;
}
@end

demo地址：卸货流程进度