iOS实现步骤进度条功能实例代码

#import 

@interface HQLStepView : UIView

// 指定初始化方法
- (instancetype)initWithFrame:(CGRect)frame titlesArray:(NSArray *)titlesArray stepIndex:(NSUInteger)stepIndex;

// 设置当前步骤
- (void)setStepIndex:(NSUInteger)stepIndex animation:(BOOL)animation;

@end

#import "HQLStepView.h"

// 步骤条主题色
#define TINT_COLOR [UIColor colorWithRed:35/255.f green:135/255.f blue:255/255.f alpha:1]

@interface HQLStepView ()

@property (nonatomic, copy) NSArray *titlesArray;
@property (nonatomic, assign) NSUInteger stepIndex;

@property (nonatomic, strong) UIProgressView *progressView;
@property (nonatomic, strong) NSMutableArray *circleViewArray;
@property (nonatomic, strong) NSMutableArray *titleLabelArray;
@property (nonatomic, strong) UILabel *indicatorLabel;

@end

@implementation HQLStepView

#pragma mark - Init

- (instancetype)initWithFrame:(CGRect)frame titlesArray:(NSArray *)titlesArray stepIndex:(NSUInteger)stepIndex {
 self = [super initWithFrame:frame];
 if (self) {
 _titlesArray = [titlesArray copy];
 _stepIndex = stepIndex;

 // 进度条
 [self addSubview:self.progressView];
 
 for (NSString *title in _titlesArray) {
  
  // 圆圈
  UIView *circle = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 13, 13)];
  circle.backgroundColor = [UIColor lightGrayColor];
  circle.layer.cornerRadius = 13.0f / 2;
  [self addSubview:circle];
  [self.circleViewArray addObject:circle];
  
  // 标题
  UILabel *label = [[UILabel alloc] init];
  label.text = title;
  label.fOnt= [UIFont systemFontOfSize:14];
  label.textAlignment = NSTextAlignmentCenter;
  [self addSubview:label];
  [self.titleLabelArray addObject:label];
 }
 
 // 当前索引数字
 [self addSubview:self.indicatorLabel];
 }
 return self;
}

// 布局更新页面元素
- (void)layoutSubviews {
 NSInteger perWidth = self.frame.size.width / self.titlesArray.count;
 
 // 进度条
 self.progressView.frame = CGRectMake(0, 0, self.frame.size.width - perWidth, 1);
 self.progressView.center = CGPointMake(self.frame.size.width / 2, self.frame.size.height / 4);
 
 CGFloat startX = self.progressView.frame.origin.x;
 for (int i = 0; i = i) {
  cycle.backgroundColor = TINT_COLOR;
  label.textColor = TINT_COLOR;
 } else {
  cycle.backgroundColor = [UIColor lightGrayColor];
  label.textColor = [UIColor lightGrayColor];
 }
 }
}

#pragma mark - Public

- (void)setStepIndex:(NSUInteger)stepIndex animation:(BOOL)animation {
 if (stepIndex 

- (void)viewDidLoad {
 [super viewDidLoad];
 
 // 初始化
 _hqlStepView = [[HQLStepView alloc] initWithFrame:CGRectMake(0, 200, self.view.frame.size.width, 60) titlesArray:@[@"第一步", @"第二步", @"第三步"] stepIndex:0];
 [self.view addSubview:_hqlStepView];
}

- (void)viewDidAppear:(BOOL)animated {
 [super viewDidAppear:animated];
 
 // 设置当前步骤，步骤索引=数组索引
 [_hqlStepView setStepIndex:0 animation:YES];
}