Swift5学习之旅----UISlider(滑块控制)、UIStepper(步进控制)
- UISlider
相关功能代码
import UIKit
class MySlider: UISlider {
override init(frame: CGRect) {
super.init(frame: frame)
}
required init?(coder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
func slider(){
self.minimumValue = 0.0
self.maximumValue = 100.0
self.setValue(20, animated: true)
//两端的图标、滑动条的颜色
self.minimumValueImage = UIImage(systemName: "slider.horizontal.3")
self.maximumValueImage = UIImage(systemName: "slider.horizontal.below.rectangle")
self.minimumTrackTintColor = UIColor.black
self.maximumTrackTintColor = UIColor.gray
// self.minimumTrackImage(for: .highlighted)
// 滑块滑动停止后才触发ValueChanged事件
self.isContinuous = false
//滑块的设计
self.thumbTintColor = UIColor.green
self.setThumbImage(UIImage(systemName: "heart"), for: .normal)
self.setThumbImage(UIImage(systemName: "heart"), for: .highlighted)
}
}
- 根据Slider、Stepper自定义贝塞斯达曲线
import UIKit
class CircleProgressView: UIView {
let circleLayer = CAShapeLayer()
let progressLayer = CAShapeLayer()
// var progress: CGFloat = 0.0
override init(frame: CGRect){
super.init(frame: frame)
draw(frame)
}
required init?(coder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
override func draw(_ rect: CGRect) {
super.draw(rect)
//画出一个环形的layer
circleLayer.frame = self.bounds
self.layer.addSublayer(circleLayer)
circleLayer.fillColor = UIColor.clear.cgColor
circleLayer.strokeColor = UIColor.gray.cgColor
circleLayer.opacity = 0.2
circleLayer.lineWidth = 5
//勾勒layer的轨迹,贝塞斯达曲线
let path: UIBezierPath = UIBezierPath(arcCenter: CGPoint(x: frame.size.width / 2.0, y: frame.size.height / 2.0), radius: 90, startAngle: CGFloat(Double.pi * -210) / 180.0, endAngle: CGFloat(Double.pi * 30) / 180.0, clockwise: true)
circleLayer.path = path.cgPath
//设置进度layer
progressLayer.frame = bounds
progressLayer.fillColor = UIColor.clear.cgColor
progressLayer.strokeColor = UIColor.red.cgColor
progressLayer.lineCap = .round
progressLayer.lineWidth = 9
progressLayer.path = path.cgPath
progressLayer.strokeEnd = 0.2
self.layer.addSublayer(progressLayer)
}
}
- UIStepper
相关代码
import UIKit
class MyStepper: UIStepper {
override init(frame: CGRect) {
super.init(frame: frame)
self.maximumValue = 100
self.minimumValue = 0
self.value = 20
self.stepValue = 1
//设置stepper可以按住不放连续更改值
self.isContinuous = true
}
required init?(coder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
}
- 三者之间的联系实现
class ViewController: UIViewController {
// let frame:CGRect = CGRect(x: 100, y: 400, width: 300, height: 300)
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
let slider = MySlider(frame: CGRect(x: 40, y: 100, width: self.view.bounds.width - 100, height: 40))
slider.tag = 997
slider.slider()
self.view.addSubview(slider)
let label = Mylabel(frame: CGRect(x: 80, y: 200, width: 200, height: 40))
label.tag = 1000
self.view.addSubview(label)
// 响应事件
slider.addTarget(self, action: #selector(sliderValueChange(slider:)), for: UIControl.Event.valueChanged)
let activityIndicator = MyActivity(frame: CGRect(x: 50, y: 300, width: 50, height: 50))
self.view.addSubview(activityIndicator)
let circle = CircleProgressView(frame: CGRect(x: 100, y: 400, width: 300, height: 300))
circle.tag = 999
self.view.addSubview(circle)
let stepper = MyStepper(frame: CGRect(x: 100, y: 700, width: 100, height: 100))
stepper.addTarget(self, action: #selector(stepperValueChange(stepper:)), for: .valueChanged)
stepper.tag = 998
self.view.addSubview(stepper)
}
@objc func sliderValueChange(slider: UISlider){
let value = slider.value
let stepper = self.view.viewWithTag(998) as! UIStepper
stepper.value = Double(value)
let lab: UILabel = self.view.viewWithTag(1000) as! UILabel
lab.text = String(format: "slider当前值为:%.2f", arguments: [value])
let circleView: CircleProgressView = self.view.viewWithTag(999) as! CircleProgressView
circleView.progressLayer.strokeEnd = CGFloat(value/100)
print("slider当前值是\(value)")
}
@objc func stepperValueChange(stepper: UIStepper){
let value = stepper.value
let slider = self.view.viewWithTag(997) as! UISlider
slider.value = Float(value)
stepper.value = Double(value)
let lab: UILabel = self.view.viewWithTag(1000) as! UILabel
lab.text = String(format: "slider当前值为:%.2f", arguments: [value])
let circleView: CircleProgressView = self.view.viewWithTag(999) as! CircleProgressView
circleView.progressLayer.strokeEnd = CGFloat(value/100)
print("slider当前值是\(value)")
}
}
- 整体代码
Github还没上传,先用着Dropbox吧,看完有收获的感谢点个赞👍
Dropbox连接
https://www.dropbox.com/sh/g1l8cqg5jp5j5a9/AAAli9UDDtDls00DfZWISc-Ha?dl=0
Dropbox Slider