将 CAShapeLayer 添加到子视图
Adding a CAShapeLayer to a subView
我试图将 CAShapeLayer 添加到主视图(单视图应用程序)上的较小 UIView。我将形状图层设置为动画并对触摸手势做出反应以开始绘制它。但它是从主视图的中心绘制的,我需要能够移动它并出于布局目的对其进行约束。我看到另一个 post 似乎有同样的问题,但我想我自己更困惑了。我在主 ViewController.
的 viewDidLoad 函数中有以下代码
这是我正在玩的一个测试项目,可以在我现有的应用程序运行后向其添加新功能。
我尝试在项目的 MainStoryBoard 中添加一个 UIView 并将其添加到 ViewController.swift 文件(控制拖动)以创建一个出口,然后将 shapeLayer 和 trackLayer 添加到 UIView。
下面的代码
@IBOutlet weak var gaugeView: UIView!
override func viewDidLoad() {
super.viewDidLoad()
let centre = view.center
let circularPath = UIBezierPath(arcCenter: centre, radius: 100, startAngle: -CGFloat.pi / 2, endAngle: 2 * CGFloat.pi, clockwise: true)
// Track Layer Under Gauge
trackLayer.path = circularPath.cgPath
trackLayer.strokeColor = UIColor.lightGray.cgColor
trackLayer.lineWidth = 10
trackLayer.fillColor = UIColor.clear.cgColor
//view.layer.addSublayer(trackLayer)
gaugeView.layer.addSublayer(trackLayer)
// Animated Circular Guage
shapeLayer.path = circularPath.cgPath
shapeLayer.strokeColor = UIColor.green.cgColor
shapeLayer.lineWidth = 10
shapeLayer.lineCap = .round
shapeLayer.fillColor = UIColor.clear.cgColor
shapeLayer.strokeEnd = 0
//view.layer.addSublayer(shapeLayer)
gaugeView.layer.addSublayer(shapeLayer)
}
一旦我在模拟器中安装了该应用程序,它就会在 view.layer.addSubLayer 未被注释掉时绘制圆并为其设置动画,但不会将其添加到 UIView 容器中,其中包含 gaugeView.layer.addSubView。
您需要将 center
设置为 gaugeView
center
而不是此处的 view.center
,
override func viewDidLoad() {
super.viewDidLoad()
let centre = CGPoint(x: gaugeView.frame.width/2, y: gaugeView.frame.height/2)
...
}
注意: 在使用 Autolayout
时,viewDidLoad
永远不是使用 subView
的 frame
的正确位置autolayout
尚未布局。获取和使用 frame
的最佳位置是 viewDidLayoutSubviews
.
我试图将 CAShapeLayer 添加到主视图(单视图应用程序)上的较小 UIView。我将形状图层设置为动画并对触摸手势做出反应以开始绘制它。但它是从主视图的中心绘制的,我需要能够移动它并出于布局目的对其进行约束。我看到另一个 post 似乎有同样的问题,但我想我自己更困惑了。我在主 ViewController.
的 viewDidLoad 函数中有以下代码这是我正在玩的一个测试项目,可以在我现有的应用程序运行后向其添加新功能。
我尝试在项目的 MainStoryBoard 中添加一个 UIView 并将其添加到 ViewController.swift 文件(控制拖动)以创建一个出口,然后将 shapeLayer 和 trackLayer 添加到 UIView。
下面的代码
@IBOutlet weak var gaugeView: UIView!
override func viewDidLoad() {
super.viewDidLoad()
let centre = view.center
let circularPath = UIBezierPath(arcCenter: centre, radius: 100, startAngle: -CGFloat.pi / 2, endAngle: 2 * CGFloat.pi, clockwise: true)
// Track Layer Under Gauge
trackLayer.path = circularPath.cgPath
trackLayer.strokeColor = UIColor.lightGray.cgColor
trackLayer.lineWidth = 10
trackLayer.fillColor = UIColor.clear.cgColor
//view.layer.addSublayer(trackLayer)
gaugeView.layer.addSublayer(trackLayer)
// Animated Circular Guage
shapeLayer.path = circularPath.cgPath
shapeLayer.strokeColor = UIColor.green.cgColor
shapeLayer.lineWidth = 10
shapeLayer.lineCap = .round
shapeLayer.fillColor = UIColor.clear.cgColor
shapeLayer.strokeEnd = 0
//view.layer.addSublayer(shapeLayer)
gaugeView.layer.addSublayer(shapeLayer)
}
一旦我在模拟器中安装了该应用程序,它就会在 view.layer.addSubLayer 未被注释掉时绘制圆并为其设置动画,但不会将其添加到 UIView 容器中,其中包含 gaugeView.layer.addSubView。
您需要将 center
设置为 gaugeView
center
而不是此处的 view.center
,
override func viewDidLoad() {
super.viewDidLoad()
let centre = CGPoint(x: gaugeView.frame.width/2, y: gaugeView.frame.height/2)
...
}
注意: 在使用 Autolayout
时,viewDidLoad
永远不是使用 subView
的 frame
的正确位置autolayout
尚未布局。获取和使用 frame
的最佳位置是 viewDidLayoutSubviews
.