ProgressBar

Progress…

效果图

• ViewController

#import "ViewController.h"
#import "ProgressCell.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    
    ProgressCell *cell = [[ProgressCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"cell"];
    cell.totalProgress = 30;
    cell.curProgress = 12;
    cell.frame = CGRectMake(0, 100, CGRectGetWidth(self.view.frame), 80);
    cell.backgroundColor = [UIColor systemGroupedBackgroundColor];
    [self.view addSubview:cell];
}
@end

• ProgressCell

@interface ProgressCell : UITableViewCell

@property (nonatomic) CGFloat totalProgress;
@property (nonatomic) CGFloat curProgress;

@end

#import "ProgressCell.h"

#define kProgressBarHeight 10
#define kProgressBarWidth 20

@interface ProgressBar : UILabel

@end

@implementation ProgressBar

@end


@interface ProgressCell ()

@property (nonatomic, strong) UIView *progressBarView;
@property (nonatomic, strong) UILabel *progressLable;
@property (nonatomic, strong) NSMutableArray *barArray;

@end

@implementation ProgressCell

- (NSMutableArray *)barArray {
    if (!_barArray) {
        _barArray = [[NSMutableArray alloc] init];
    }
    return _barArray;
}

- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
    if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]) {
        
        self.progressLable = [[UILabel alloc] init];
        [self addSubview:self.progressLable];
    }
    return self;
}


- (void)layoutSubviews {
    [super layoutSubviews];
    
    self.progressBarView.frame = CGRectMake(0, 0, CGRectGetWidth(self.frame)*0.5, CGRectGetHeight(self.frame));
    self.progressLable.frame = CGRectMake(CGRectGetMidX(self.frame), 0, CGRectGetWidth(self.frame)*0.5, CGRectGetHeight(self.frame));
    
    NSUInteger totalCount = self.barArray.count; // 总个数
    NSUInteger columnMaxCount = CGRectGetWidth(self.progressBarView.frame) / (kProgressBarWidth + 5); // 总列数
    for (int i = 0; i < totalCount; i++)
    {
        NSUInteger j = i % columnMaxCount; // 第j列
        NSUInteger k = i / columnMaxCount; // 第k列

        ProgressBar *bar = self.barArray[i];
        bar.frame = CGRectMake(5 + j * (kProgressBarWidth + 5), 5 + k * (5 + kProgressBarHeight)  , kProgressBarWidth, kProgressBarHeight);
    }

    self.progressLable.backgroundColor = [UIColor blueColor];
    self.progressBarView.backgroundColor = [UIColor brownColor];
}

- (void)setTotalProgress:(CGFloat)totalProgress
{
    _totalProgress = totalProgress;
    [self reloadProgressView];
}

- (void)setCurProgress:(CGFloat)curProgress
{
    _curProgress = curProgress;
    self.progressLable.text = [NSString stringWithFormat:@"%.1f/%.1f",self.curProgress,self.totalProgress];
    int index = 0;
    for (ProgressBar *bar in self.barArray) {
        if (index <= curProgress) {
            bar.backgroundColor = [UIColor lightGrayColor];
        }
        else {
            bar.backgroundColor = [UIColor whiteColor];
        }
        index++;
    }
}


- (void)reloadProgressView
{
    [self.progressBarView removeFromSuperview];
    self.progressBarView = nil;
    
    self.progressBarView = [[UIView alloc] init];
    [self addSubview:self.progressBarView];
    
    [self.barArray removeAllObjects];
    
    NSUInteger totalCount = ceill(self.totalProgress); // 总个数
    for (int i = 0; i < totalCount; i++)
    {
        ProgressBar *bar = [[ProgressBar alloc] init];
        [self.progressBarView addSubview:bar];
        
        if (i < self.curProgress) {
            bar.backgroundColor = [UIColor lightGrayColor];
        }
        else {
            bar.backgroundColor = [UIColor whiteColor];
        }
        
        [self.barArray addObject:bar];
    }
    
    [self layoutIfNeeded];
}

@end

这是比较笨的实现办法，没有之一，不支持小数进度显示。有更好的办法，电影评分，星级打分这种UI的实现办法会更好。

本文地址：https://blog.csdn.net/Morris_/article/details/109379132