我试图在每个createCircle()
函数中使用相同的按钮,但当我按下一个按钮并且它运行handleTap()
函数时,它只应用于最近添加的圆。我想使用相同的按钮,但当我点击一个单独的按钮,它应该运行我按下的一个动画。
import UIKit
class SecondViewController: UIViewController {
let shapeLayer = CAShapeLayer()
let percentageLabel: UILabel = {
let label = UILabel()
label.text = ""
label.textAlignment = .center
label.font = UIFont.boldSystemFont(ofSize: 28)
label.textColor = UIColor(red: 0.59, green: 0.42, blue: 0.23, alpha: 1.00)
return label
}()
override func viewDidLoad() {
super.viewDidLoad()
_ = createCircle(positionX: 100, positionY: 200)
_ = createCircle(positionX: 100, positionY: 375)
_ = createCircle(positionX: 100, positionY: 550)
_ = createCircle(positionX: 100, positionY: 725)
_ = createCircle(positionX: 300, positionY: 200)
_ = createCircle(positionX: 300, positionY: 375)
_ = createCircle(positionX: 300, positionY: 550)
_ = createCircle(positionX: 300, positionY: 725)
}
//MARK: - Create Circle
func createCircle(positionX: Int, positionY: Int) -> (CGPoint) {
let trackLayer = CAShapeLayer()
let button = UIButton(type: .custom)
button.frame = CGRect(x: 0, y: 0, width: 100, height: 100)
button.layer.cornerRadius = 0.5 * button.bounds.size.width
button.clipsToBounds = true
button.center = view.center
button.addTarget(self, action: #selector(handleTap), for: .touchUpInside)
view.addSubview(button)
let circularPath = UIBezierPath(arcCenter: .zero, radius: 50, startAngle: 0, endAngle: 2 * CGFloat.pi, clockwise: true)
trackLayer.path = circularPath.cgPath
trackLayer.strokeColor = UIColor(red: 0.82, green: 0.69, blue: 0.52, alpha: 1.00).cgColor
trackLayer.fillColor = UIColor.clear.cgColor
trackLayer.lineWidth = 10
trackLayer.position = CGPoint(x: positionX, y: positionY)
view.layer.addSublayer(trackLayer)
shapeLayer.path = circularPath.cgPath
shapeLayer.strokeColor = UIColor(red: 0.59, green: 0.42, blue: 0.23, alpha: 1.00).cgColor
shapeLayer.fillColor = UIColor.clear.cgColor
shapeLayer.lineWidth = 10
shapeLayer.lineCap = CAShapeLayerLineCap.round
shapeLayer.position = CGPoint(x: positionX, y: positionY)
shapeLayer.transform = CATransform3DMakeRotation(-CGFloat.pi / 2, 0, 0, 1)
view.addSubview(percentageLabel)
percentageLabel.frame = CGRect(x: 0, y: 0, width: 150, height: 150)
percentageLabel.center = CGPoint(x: positionX, y: positionY)
return CGPoint(x: positionX, y: positionY)
}
//MARK: - Tap function
var done = 0
var toDo = 0
@objc func handleTap(sender: UIButton) {
toDo = 5
if done < toDo {
done += 1
} else {
done -= toDo
}
let percentage = CGFloat(done) / CGFloat(toDo)
percentageLabel.text = "\(Int(percentage * 100))%"
DispatchQueue.main.async {
self.shapeLayer.strokeEnd = percentage
}
view.layer.addSublayer(shapeLayer)
}
}
这是运行代码时发生的情况的图片。当我单击任何图片按钮时,它不是在我按下的任何按钮上运行进度条动画,而是只在最后添加到视图控制器的按钮上运行它。
不要在视图控制器中使用createcircle()
,而是为它创建一个新文件,并在内部像这样初始化函数。
import UIKit
class Button: UIButton {
override init(frame: CGRect) {
super.init(frame: frame)
createCircle()
}
required init?(coder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
let percentageLabel: UILabel = {
let label = UILabel()
label.text = ""
label.textAlignment = .center
label.font = UIFont.boldSystemFont(ofSize: 28)
label.textColor = UIColor(red: 0.59, green: 0.42, blue: 0.23, alpha: 1.00)
return label
}()
let shapeLayer = CAShapeLayer()
func createCircle() {
let trackLayer = CAShapeLayer()
let button = UIButton(type: .custom)
button.frame = CGRect(x: 0, y: 0, width: 100, height: 100)
button.layer.cornerRadius = 0.5 * button.bounds.size.width
button.clipsToBounds = true
button.center = center
button.addTarget(self, action: #selector(handleTap), for: .touchUpInside)
addSubview(button)
let circularPath = UIBezierPath(arcCenter: .zero, radius: 50, startAngle: 0, endAngle: 2 * CGFloat.pi, clockwise: true)
trackLayer.path = circularPath.cgPath
trackLayer.strokeColor = UIColor(red: 0.82, green: 0.69, blue: 0.52, alpha: 1.00).cgColor
trackLayer.fillColor = UIColor.clear.cgColor
trackLayer.lineWidth = 10
trackLayer.position = center
layer.addSublayer(trackLayer)
shapeLayer.path = circularPath.cgPath
shapeLayer.strokeColor = UIColor(red: 0.59, green: 0.42, blue: 0.23, alpha: 1.00).cgColor
shapeLayer.fillColor = UIColor.clear.cgColor
shapeLayer.lineWidth = 10
shapeLayer.lineCap = CAShapeLayerLineCap.round
shapeLayer.position = center
shapeLayer.transform = CATransform3DMakeRotation(-CGFloat.pi / 2, 0, 0, 1)
addSubview(percentageLabel)
percentageLabel.frame = CGRect(x: 0, y: 0, width: 150, height: 150)
// percentageLabel.center = CGPoint(x: positionX, y: positionY)
// return CGPoint(x: positionX, y: positionY)
}
var done = 0
var toDo = 0
@objc func handleTap(sender: UIButton) {
toDo = 5
if done < toDo {
done += 1
} else {
done -= toDo
}
let percentage = CGFloat(done) / CGFloat(toDo)
percentageLabel.text = "\(Int(percentage * 100))%"
DispatchQueue.main.async {
self.shapeLayer.strokeEnd = percentage
}
layer.addSublayer(shapeLayer)
}
}
您可以从与按钮有关的SecondViewController
中删除代码,并调用ViewDidLoad()
中的circle函数。问题是,您的动画影响了您的视图(而不是单个圆圈),通过为circle按钮创建一个类,您可以在SecondViewController
中调用它,它将只影响按下按钮的圆圈。