如何以编程方式在中心图像周围的圆圈中布局图像/视图

Question

我正在尝试围绕中心图像绘制 8 个 UIView。我可以将图像绘制成一个圆圈，但我的中心点不在中心图像上。

我已经成功地使用共享中心/原点以编程方式在一个圆圈中绘制了 8 个 UIView（将是图像）。从 center.x 和 center.y 我使用三角函数为每个特定图像添加 x 和 y 分量。

让 radiusX = center.x + (radius * cos(radians)) 。 让 radiusY = center.y + (radius * sin(radians))

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var centerImage: UIImageView!{
        didSet{
            centerImage.clipsToBounds = true
            centerImage.layer.cornerRadius = 
            centerImage.frame.width/2
        }
    }
    @IBOutlet weak var containerView: UIView!


    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, 
        typically from a nib.

    }

    override func viewDidLayoutSubviews() {
        initSmallPhotos()
    }

    func initSmallPhotos() {

        var radians : CGFloat = 0
        let sideOfPic : CGFloat = 65.7
        let radius : CGFloat = containerView.frame.width > 
            containerView.frame.height ? 
            containerView.frame.height / 2 - 
            sideOfPic : containerView.frame.width / 2 - sideOfPic

        let x = containerView.center.x
        let y = containerView.center.y

        let center = CGPoint(x: x, y: y)

        print(center)


        for _ in 0...7 {


            let radiusX = center.x + (radius * cos(radians))
            let radiusY = center.y + (radius * sin(radians))

            let view = UIView()
            view.backgroundColor = UIColor.red
            view.frame.size = CGSize(width: sideOfPic, height: 
                 sideOfPic)
            view.center = CGPoint(x: radiusX, y: radiusY)
            view.clipsToBounds = true
            view.layer.cornerRadius = sideOfPic / 2
            view.layer.masksToBounds = true
            view.layer.borderColor = UIColor.white.cgColor
            view.layer.borderWidth = 2
            view.contentMode = .scaleAspectFit

            containerView.addSubview(view)

            radians += (CGFloat.pi / 4)
            print(radians)

        }
    }

}

问题是我的中心点使用什么。我可以使用我的 center.x = containerView.center.x 将 8 个图像水平居中，但是当我使用 center.y = containerView.center.y 时，图像设置得太低。我还尝试了 center.y = containerView.frame.origin.y 并将 8 个图像设置在屏幕上过高的位置。

尝试使用我的 centerImage 中的中心点给了我非常奇怪的行为，即使图像被限制在容器视图的中心。

任何帮助将不胜感激。

Answer 1

使用 bounds.midX 与 center.x 和 bounds.midY 与 center.y.. 检查您设置 x 和 y 的行。使用中心为您提供 containerView 在其超级视图内的位置，而不是 containerView 的中心。希望这是有道理的。

import Foundation
import UIKit
import PlaygroundSupport
class ViewController:UIViewController{
    var check = true
    var containerView = UIView(frame: CGRect(x: 30, y: 30, width: 400, height: 300))
    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .blue
        view.addSubview(containerView)

        initSmallPhotos()

    }

    func initSmallPhotos() {

        var radians : CGFloat = 0
        let sideOfPic : CGFloat = 65.7
        let radius : CGFloat = containerView.frame.width >
            containerView.frame.height ?
                containerView.frame.height / 2 -
                sideOfPic : containerView.frame.width / 2 - sideOfPic

        let x = containerView.bounds.midX
        let y = containerView.bounds.midY

        let center = CGPoint(x: x, y: y)

        print(center)


        for _ in 0...7 {


            let radiusX = center.x + (radius * cos(radians))
            let radiusY = center.y + (radius * sin(radians))

            let view = UIView()
            view.backgroundColor = UIColor.red
            view.frame.size = CGSize(width: sideOfPic, height:
                sideOfPic)
            view.center = CGPoint(x: radiusX, y: radiusY)
            view.clipsToBounds = true
            view.layer.cornerRadius = sideOfPic / 2
            view.layer.masksToBounds = true
            view.layer.borderColor = UIColor.white.cgColor
            view.layer.borderWidth = 2
            view.contentMode = .scaleAspectFit

            containerView.addSubview(view)

            radians += (CGFloat.pi / 4)
            print(radians)

        }
    }
}


let viewController = ViewController()
PlaygroundPage.current.liveView = viewController
PlaygroundPage.current.needsIndefiniteExecution