1.声明控件
进度条有两种样式
- bar
- default
两种样式使用效果如下:
self.view.backgroundColor = UIColor.red
progressView = UIProgressView(progressViewStyle: .default)
progressView.frame = CGRect(x: 0, y: 0, width: 200, height: 10)
progressView.layer.position = CGPoint(x: self.view.frame.width/2, y: 90)
progressView.progress = 0.5
self.view.addSubview(progressView)
progressView2 = UIProgressView(progressViewStyle: .bar)
progressView2.frame = CGRect(x: 0, y: 0, width: 200, height: 20)
progressView2.layer.position = CGPoint(x: self.view.frame.width/2, y: 110)
progressView2.progress = 0.5
self.view.addSubview(progressView2)
运行效果:

2.启用进度条加载动画
progressView.setProgress(0.5, animated: true)
3.改变进度条颜色
progressView.progressTintColor = UIColor.green //进度颜色
progressView.trackTintColor = UIColor.yellow //剩余进度颜色

4.设置progressView的高度
其实细心的小伙伴应该已经发现,在声明控件的时候,第一个height:10,第二个heigth:20,从截图上来看两个的高度并没有差异,所以通过设置progressView的高度并不能达到目的,不过我们可以通过改变 progressView 的 scale(缩放比例)来实现高度的变化
progressView = UIProgressView(progressViewStyle: .default)
progressView.frame = CGRect(x: 0, y: 0, width: 200, height: 10)
progressView.layer.position = CGPoint(x: self.view.frame.width/2, y: 90)
progressView.setProgress(0.5, animated: true)
progressView.progressTintColor = UIColor.green //进度颜色
progressView.trackTintColor = UIColor.yellow //剩余进度颜色
//通过改变进度条高度(宽度不变,高度变为默认的2倍)
progressView.transform = CGAffineTransform(scaleX: 1.0, y: 2.0)
self.view.addSubview(progressView)
progressView2 = UIProgressView(progressViewStyle: .bar)
progressView2.frame = CGRect(x: 0, y: 0, width: 200, height: 20)
progressView2.layer.position = CGPoint(x: self.view.frame.width/2, y: 110)
progressView2.progress = 0.5
self.view.addSubview(progressView2)

5.其它
推荐一个自定义的进度条样式:http://www.code4app.com/thread-6304-1-1.html 是用OC实现的,在使用的过程中可能大伙还得先熟悉一下swift中使用oc控件

网友评论