Swift UIView 子视图在自定义 UIView 子类中没有圆角

Tom*_*ulz 3 uikit uiview ios swift

问候堆栈溢出。

我正在尝试使用彩色子视图和角半径来构建“牛眼”类型视图。我遇到的问题是,只有我的第一个子视图的角变圆,内部视图仍然是正方形。黑色视图是我的自定义视图的子视图。红色视图是它的子视图,黄色视图是它的子视图。非常简单的层次结构。

结果如下:

靶心用正方形代替圆形

我添加视图并手动设置它们的约束。我的测试应用程序只有视图控制器的 ThreeCircleView 死点,其中 X、Y 居中且宽度、高度恒定。我在 didLayoutSubViews 中对角进行了实际的圆角处理,因为视图的大小可能会发生变化,因此必须调整角的大小。

我写了一个测试视图来隔离它,这里是

class ThreeCircleView: UIView {

    var outerCircle: UIView = UIView()
    var middleCircle: UIView = UIView()
    var innerCircle: UIView = UIView()
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        translatesAutoresizingMaskIntoConstraints = false
        addSubViews()
    }

    required init?(coder: NSCoder) {
        super.init(coder: coder)
        translatesAutoresizingMaskIntoConstraints = false
        addSubViews()
    }

    func addSubViews() {
        outerCircle.backgroundColor = .black
        middleCircle.backgroundColor = .red
        innerCircle.backgroundColor = .yellow
    
        self.addSubview(outerCircle)
        outerCircle.addSubview(middleCircle)
        middleCircle.addSubview(innerCircle)
        
        let outerCenterY = outerCircle.centerYAnchor.constraint(equalTo: self.centerYAnchor)
        let outerCenterX = outerCircle.centerXAnchor.constraint(equalTo: self.centerXAnchor)
        let outerCenterWidth = outerCircle.widthAnchor.constraint(equalTo: self.widthAnchor, constant: -50.0 )
        let outerCenterHeight = outerCircle.heightAnchor.constraint(equalTo: self.heightAnchor, constant: -50.0 )
        outerCircle.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([outerCenterY,outerCenterX,outerCenterWidth,outerCenterHeight])
        
        self.setNeedsLayout()
        let middleCenterY = middleCircle.centerYAnchor.constraint(equalTo: self.centerYAnchor)
        let middleCenterX = middleCircle.centerXAnchor.constraint(equalTo: self.centerXAnchor)
        let middleCenterWidth = middleCircle.widthAnchor.constraint(equalTo: self.widthAnchor, constant: -100.0 )
        let middleCenterHeight = middleCircle.heightAnchor.constraint(equalTo: self.heightAnchor, constant: -100.0 )
        middleCircle.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([middleCenterY,middleCenterX,middleCenterWidth,middleCenterHeight])

        let innerCenterY = innerCircle.centerYAnchor.constraint(equalTo: self.centerYAnchor)
        let innerCenterX = innerCircle.centerXAnchor.constraint(equalTo: self.centerXAnchor)
        let innerCenterWidth = innerCircle.widthAnchor.constraint(equalTo: self.widthAnchor, constant: -150.0 )
        let innerCenterHeight = innerCircle.heightAnchor.constraint(equalTo: self.heightAnchor, constant: -150.0 )
        innerCircle.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([innerCenterY,innerCenterX,innerCenterWidth,innerCenterHeight])

    }

    func makeCircle(v:UIView) {
        v.layer.cornerRadius = v.frame.size.width * 0.50
        v.clipsToBounds = true
    }
    
    override func layoutSubviews() {
        super.layoutSubviews()
        makeCircle(v: outerCircle)
        makeCircle(v: middleCircle)
        makeCircle(v: innerCircle)
    }
    
}
Run Code Online (Sandbox Code Playgroud)

Pet*_*rev 7

使其看起来符合预期的一个简单方法是在方法layoutIfNeeded()中添加调用makeCircle(v:UIView)。这将确保您在应用视觉更改之前正确更新所有视图的框架:

func makeCircle(v:UIView) {
        v.layoutIfNeeded()
        v.layer.cornerRadius = v.frame.size.width * 0.50
        v.clipsToBounds = true
    }
Run Code Online (Sandbox Code Playgroud)