封装了一个iOS自定义滚动进度指示视图

效果图
请添加图片描述
思路: 根据ScrollView滚动的进度,计算出内部的指示视图需要移动的距离。是根据一个比例计算,要先计算出指示视图可以在内部移动的最大距离,然后根据scrollView 可以滚动的最大距离和当前滚动的距离计算出当前滚动的比例,根据相同的比例计算出指示条滚动的偏移量
核心代码

@interface LBScrollProgressView ()

/// 整个进度条
@property (nonatomic, strong) UIView *totalProcessView;

/// 进度条指示器
@property (nonatomic, strong) UIView *indicateProcessView;

@end

@implementation LBScrollProgressView

- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        [self setUpUI];
        [self setUpConstraints];
    }
    return self;
}

- (void)setUpUI
{
    [self addSubview:self.totalProcessView];
    [self addSubview:self.indicateProcessView];
}

- (void)setUpConstraints
{
    [self.totalProcessView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.edges.mas_equalTo(0);
    }];
    
    [self.indicateProcessView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.leading.bottom.mas_equalTo(0);
        make.width.mas_equalTo(0);
    }];
}

- (void)updateWithModel:(LBScrollProgressViewConfig *)model
{
    if (![model isKindOfClass:LBScrollProgressViewConfig.class]) {
        return;
    }
    
    if (model.process < 0) {
        model.process = 0;
    } else if (model.process > 1) {
        model.process = 1;
    }
    
    self.totalProcessView.layer.cornerRadius = model.cornerRadius;
    self.indicateProcessView.layer.cornerRadius = model.cornerRadius;
    
    [self.indicateProcessView mas_updateConstraints:^(MASConstraintMaker *make) {
        make.leading.mas_equalTo((model.totalWidth - model.indicateWidth) * model.process);
        make.width.mas_equalTo(model.indicateWidth);
    }];
    
    self.totalProcessView.backgroundColor = model.bgColor;
    self.indicateProcessView.backgroundColor = model.indicateColor;
}

#pragma mark - 懒加载
- (UIView *)totalProcessView
{
    if (!_totalProcessView) {
        _totalProcessView = [[UIView alloc] init];
    }
    return _totalProcessView;
}

- (UIView *)indicateProcessView
{
    if (!_indicateProcessView) {
        _indicateProcessView = [[UIView alloc] init];
    }
    return _indicateProcessView;
}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值