UIProgressView顾名思义用来显示进度的,如音乐,视频的播放进度,和文件的上传下载进度等。UIProgressView也是常用的控件。本文只介绍最简单的布局使用。
<pre>
初始化方法
-(instancetype)initWithFrame:(CGRect)frame ;
- (nullable instancetype)initWithCoder:(NSCoder *)aDecoder ;
- (instancetype)initWithProgressViewStyle:(UIProgressViewStyle)style; 这个最常用
@property(nonatomic) UIProgressViewStyle progressViewStyle;
@property(nonatomic) float progress;
进度条颜色
@property(nonatomic, strong, nullable) UIColor* progressTintColor;
设置背景颜色
@property(nonatomic, strong, nullable) UIColor* trackTintColor;
设置进度条
@property(nonatomic, strong, nullable) UIImage* progressImage;
设置背景图片
@property(nonatomic, strong, nullable) UIImage* trackImage;
是否使用动画更改进度条的值
— (void)setProgress:(float)progress animated:(BOOL)animated);
@property(nonatomic, strong, nullable) NSProgress *observedProgress;
</pre>
本Demo并没有使用navigationBar所以,全部使用了自定义View。界面拆分如下
界面拆分
一、今天的主角:UIProgressView
我们可以从图中看中,这个页面中需要使用3个一样progressView。所以我们将这个可以抽取成ProgressView类。
ProgressView类需求:
1.1 具有两个Lable,一个ProgressView
1.2 需要对外提供赋值的方法。
直接上代码
ProgressView.h
#import <UIKit/UIKit.h>
#import "Masonry.h"
@interface ProgressView : UIView
@property (nonatomic, strong) UILabel * progressTitleLabel;
@property (nonatomic, strong) UILabel * progressAccountLabel;
@property (nonatomic, strong) UIProgressView * rateProgressView;
+ (ProgressView *)progressTitle:(NSString *)title progressAccount:(int)account rateProgress:(CGFloat)rate rateProgressColor:(UIColor *)progressColor;
@end
ProgressView.m
#import "ProgressView.h"
@implementation ProgressView
- (instancetype)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
[self p_setupViews];
}
return self;
}
- (void)p_setupViews
{
self.progressTitleLabel = [[UILabel alloc] init];
self.progressTitleLabel.textAlignment = NSTextAlignmentLeft;
self.progressTitleLabel.textColor = [UIColor colorWithRed:166/255.0 green:166/255.0 blue:166/255.0 alpha:1];
[self addSubview:self.progressTitleLabel];
self.progressAccountLabel = [[UILabel alloc] init];
self.progressAccountLabel.textColor = [UIColor colorWithRed:166/255.0 green:166/255.0 blue:166/255.0 alpha:1];
self.progressAccountLabel.textAlignment = NSTextAlignmentRight;
[self addSubview:self.progressAccountLabel];
// 进度条初始化
self.rateProgressView = [[UIProgressView alloc] initWithProgressViewStyle:UIProgressViewStyleDefault];
// 进度条的底色
self.rateProgressView.trackTintColor = [UIColor colorWithRed:199/255.0 green:198/255.0 blue:198/255.0 alpha:1];
self.rateProgressView.layer.masksToBounds = YES;
self.rateProgressView.layer.cornerRadius = 1;
[self addSubview:self.rateProgressView];
}
- (void)layoutSubviews
{
[super layoutSubviews];
[self.progressTitleLabel mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.left.equalTo(self);
make.width.mas_equalTo(200);
make.height.mas_equalTo(30);
}];
[self.progressAccountLabel mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.right.equalTo(self);
make.width.mas_equalTo(100);
make.height.mas_equalTo(30);
}];
[self.rateProgressView mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.right.equalTo(self);
make.top.equalTo(self.progressTitleLabel.mas_bottom).offset(5);
make.height.mas_equalTo(5);
}];
}
+ (ProgressView *)progressTitle:(NSString *)title progressAccount:(int)account rateProgress:(CGFloat)rate rateProgressColor:(UIColor *)progressColor
{
ProgressView * progressView = [[ProgressView alloc] init];
progressView.progressTitleLabel.text = title;
progressView.progressAccountLabel.text = [NSString stringWithFormat:@"%d",account];
// 进度条的进度
progressView.rateProgressView.progress = rate;
// 进度条的颜色
progressView.rateProgressView.progressTintColor = progressColor;
return progressView;
}
具体使用
github地址:https://github.com/zhangyanxiao/IDCameraDemo----demo
在这个末尾纪念一下,一只傻子!
在之前使用简书、贴代码的时候,好像是7个月还是10个月里,一直在每行代码前tab+tab,按了不知道多少的tab和复制粘贴。刚刚,用来一下"pre",好嘛!😢!知识就是力量。
好吧,我承认,我就是那只傻子!
网友评论