Есть ли способ раскладки кнопок по кругу? - PullRequest
1 голос
/ 23 апреля 2020

Я пытаюсь сделать круглую кнопку в углу, и когда вы нажимаете на нее, вокруг нее появляются 3 кнопки. Что-то вроде меню Pinterest, когда вы держите булавку. Я посмотрел с помощью UIBezierPath, но это не то, что я ищу. Я знаю, что есть библиотеки GitHub, но я пытаюсь сделать это с нуля.

Вот пример того, что я пытаюсь сделать с нуля:

example

Я понял, как сделать круглые кнопки, используя радиус угла. И у меня есть определенная c функция, которая собирается анимировать кнопки, но я не могу понять, как правильно расположить их по кругу. Я использовал ограничения, но это больше напоминает квадратную планировку, чем круглую.

1 Ответ

1 голос
/ 23 апреля 2020

Вы сказали:

, но я не могу понять, как правильно расположить их по кругу.

Это просто небольшая тригонометрия, чтобы выяснить, где Центр новой кнопки должен быть связан с существующей кнопкой. Если r - это расстояние от центра x , y существующего круга, а круг i находится под углом θᵢ , затем xᵢ = x + r * cos (θᵢ) и yᵢ = y + r * sin (θᵢ) . (При таком расположении углы измеряются в радианах от 3 часов по часовой стрелке или отрицательно до go против часовой стрелки.)

Например, если используются ограничения:

let r: CGFloat = 150               // let's say you want center of the circles to be 150 points away from center of existing button
let range = -CGFloat.pi / 2 ... 0  // and we want the angles to range from -π/2 to 0
let howMany = 5                    // and you want five of them

for i in 0 ..< howMany {
    let angle = range.lowerBound + CGFloat(i) / CGFloat(howMany - 1) * (range.upperBound - range.lowerBound)
    let offset = CGPoint(x: r * cos(angle), y: r * sin(angle))
    let button = ...
    button.translatesAutoresizingMaskIntoConstraints = false
    view.addSubview(button)
    NSLayoutConstraint.activate([
        button.centerXAnchor.constraint(equalTo: mainButton.centerXAnchor, constant: offset.x),
        button.centerYAnchor.constraint(equalTo: mainButton.centerYAnchor, constant: offset.y),
        button.widthAnchor.constraint(equalToConstant: 40),
        button.heightAnchor.constraint(equalToConstant: 40)
    ])
}

enter image description here

...