iOS拖动UIImageView角落圆形调尺寸异常及约束冲突求助

一、解决约束冲突问题 #

控制台的约束冲突是因为每次布局都会重复创建并激活约束：viewDidLayoutSubviews会在视图尺寸变化时多次调用，而你在其中每次都执行addConstraintsForItems()，导致同一个位置的约束被重复添加（比如leading约束既有初始的70，又有拖动后修改的65）。

修复步骤： #

1. 将约束的创建和激活移到viewDidLoad中，只执行一次：

override func viewDidLoad() {
    super.viewDidLoad()
    scrollView.delegate = self
    setupView()
    // 移到这里，只创建一次约束
    addConstraintsForItems()
    addTapGestureRecognizer()
    addPinchGestureRecognizer()
    addRotateButton()
    addDeletePhotoButton()
}

override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()
    borderLayer.path = UIBezierPath(rect: imageView.bounds).cgPath
    // 移除这里的addConstraintsForItems()
    updateCircles() // 改为更新圆形位置，而非重复创建
}

2. 给addConstraintsForItems()添加判断，确保约束只初始化一次：

private func addConstraintsForItems() {
    // 已创建过约束则直接返回
    guard imageViewTopConstraint == nil else { return }
    
    imageViewTopConstraint = imageView.topAnchor.constraint(equalTo: view.topAnchor, constant: 180)
    imageViewBottomConstraint = imageView.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: -180)
    imageViewLeadingConstraint = imageView.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 70)
    imageViewTrailingConstraint = imageView.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -70)

    NSLayoutConstraint.activate([imageViewTopConstraint, imageViewBottomConstraint, imageViewLeadingConstraint, imageViewTrailingConstraint])
}

二、修复圆形控件显示问题 #

目前只显示一个圆形的原因有两个：

1. 重复创建圆形Layer：每次viewDidLayoutSubviews调用createCircles()会生成新的Layer，旧Layer被覆盖或位置错乱；
2. 坐标系错误：你用了imageView.frame（相对于父视图的坐标）设置Layer的position，但CAShapeLayer的position是相对于父Layer（imageView.layer）的bounds的，而非父视图的frame。

修复步骤： #

1. 只创建一次圆形Layer，在viewDidLoad中初始化：

override func viewDidLoad() {
    super.viewDidLoad()
    // ...其他代码
    createCircles() // 移到这里，只创建一次
}

2. 修改圆形创建和更新的坐标系逻辑：

private func updateCircles() {
    // 使用imageView自身bounds的坐标（相对于自身layer）
    let topLeft = CGPoint(x: 0, y: 0)
    topLeftCircleLayer.position = topLeft
    let topRight = CGPoint(x: imageView.bounds.maxX, y: 0)
    topRightCircleLayer.position = topRight
    let bottomLeft = CGPoint(x: 0, y: imageView.bounds.maxY)
    bottomLeftCircleLayer.position = bottomLeft
    let bottomRight = CGPoint(x: imageView.bounds.maxX, y: imageView.bounds.maxY)
    bottomRightCircleLayer.position = bottomRight
}

private func createCircles() {
    topLeftCircleLayer = createCircle()
    topRightCircleLayer = createCircle()
    bottomLeftCircleLayer = createCircle()
    bottomRightCircleLayer = createCircle()
    // 初始更新位置
    updateCircles()
}

private func createCircle() -> CAShapeLayer {
    let circle = CAShapeLayer()
    // 圆形的path基于自身坐标系，中心在(10,10)，半径10，刚好覆盖角落
    circle.path = UIBezierPath(arcCenter: CGPoint(x: 10, y: 10), radius: 10, startAngle: 0, endAngle: .pi * 2, clockwise: true).cgPath
    circle.fillColor = UIColor.systemPink.cgColor
    circle.strokeColor = UIColor.white.cgColor
    circle.lineWidth = 6
    circle.isHidden = !isCirclesVisible
    imageView.layer.addSublayer(circle)
    return circle
}

三、优化拖动响应问题 #

拖动响应缓慢是因为在touchesMoved中添加了动画，去掉动画直接布局即可：

override func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent?) {
    if let touch = touches.first{
        let currentTouchPoint = touch.location(in: self.view)
        let previousTouchPoint = touch.previousLocation(in: self.view)

        let deltaX = currentTouchPoint.x - previousTouchPoint.x
        let deltaY = currentTouchPoint.y - previousTouchPoint.y

        // ...你的拖动判断逻辑保持不变

        // 去掉动画，直接触发布局
        self.view.layoutIfNeeded()
    }
}

另外，建议在touchesEnded中重置resizeRect的状态，避免下次拖动时状态混乱：

override func touchesEnded(_ touches: Set<UITouch>, with event: UIEvent?) {
    resizeRect.topTouch = false
    resizeRect.leftTouch = false
    resizeRect.rightTouch = false
    resizeRect.bottomTouch = false
}

内容的提问来源于stack exchange，提问作者Stefan