Как сделать так, чтобы Inset Buttons были такими же, как в приложении iOS Maps? - PullRequest
0 голосов
/ 05 октября 2018

Swift 4.2 реализованные виды programmatically только

Я создал stack view и вставил в него четыре кнопки, но они просто простые кнопки безлюбой серый фон.

Я хочу добиться точных четырех кнопок в моем стеке, одинаково центрированных как -

button.contentEdgeInset //Not working

Это то, что я пробовал -

 let feedbackButton:UIButton = {
    let origImage = UIImage(named: "feedback")
    let tintedImage = origImage?.withRenderingMode(.alwaysTemplate)
    let button = UIButton(frame: CGRect(x: 0, y: 0, width: 100, height: 50))
    button.translatesAutoresizingMaskIntoConstraints = false
    button.setBackgroundImage(tintedImage, for: UIControl.State.normal)
    button.tintColor = .systemPinkColor
    button.layer.cornerRadius = 7
    button.backgroundColor = UIColor.lightGray.withAlphaComponent(0.5)
    button.contentEdgeInsets = UIEdgeInsets(top: 0, left: 40, bottom: 0, right: 40)
//  button.imageEdgeInsets = UIEdgeInsets(top: 0, left: 50, bottom: 0, right: 50)
//  button.titleEdgeInsets = UIEdgeInsets(top: 0, left: 50, bottom: 0, right: 50)
    button.clipsToBounds = true
    button.addTarget(self, action: #selector(feedbackFaculty), for: .touchUpInside)
    return button
}()

Вывод -

Изображение кнопки растягивается вместе со вставками.button.imageInsets и button.titleInsets не работают.Помоги мне.Спасибо!

1 Ответ

0 голосов
/ 05 октября 2018

Фоновое изображение не соответствует содержанию вставок.Таким образом, эту строку:

button.setBackgroundImage(tintedImage, for: UIControl.State.normal)

необходимо изменить на:

button.setImage(tintedImage, for: .normal)

Также обратите внимание на пару вещей (согласно документации UIButton Apple):

Введите строку заголовка или изображение;измените размер кнопки в соответствии с вашим контентом.

Это означает, что вы не можете установить изображение и заголовок одновременно, поэтому вы можете заметить, что titleInset и imageInset не играют красиво.

Однако, если вы просто установите соответствующие ограничения для кнопок и вставите вставки для заголовка ИЛИ изображения, вы сможете получить желаемый вид.Также убедитесь, что ваш вид стека настроен на использование равного расстояния для своего распределения.

imageInset для каждой кнопки на изображении ниже: (20, 20, 20, 20).

enter image description here

...