Панель навигации titleView выравнивание

Question

Я хочу, чтобы моя панель навигации показывала две вещи посередине. Один из них будет именем списка, а другой будет именем пользователей. Имена пользователей будут помещены под списком имен. Что я сделал до сих пор, так это то, что я создал два лейбла и одно супервидение программно и установил titleView из navigationItem,

override func viewDidLoad() {
        super.viewDidLoad()
        var rectForView = CGRect(x: 0, y: 0, width: 190, height: 176)
        var viewForTitle = UIView(frame: rectForView)

        var rectForNameLabel = CGRect(x: 0, y: 63, width: 190, height: 30)
        var listNameLabel = UILabel(frame: rectForNameLabel)
        listNameLabel.text = "Name of the List...."
        listNameLabel.textAlignment = NSTextAlignment.Center
        listNameLabel.font = UIFont(name: "HelveticaNeue-Bold", size: 15)

        var rectForListLabel = CGRect(x: 0, y: 93, width: 190, height: 20)
        var usersOfListLabel = UILabel(frame: rectForListLabel)
        usersOfListLabel.text = "some Users...."
        usersOfListLabel.textAlignment = NSTextAlignment.Center
        usersOfListLabel.font = UIFont(name: "HelveticaNeue", size: 10)

        viewForTitle.addSubview(listNameLabel)
        viewForTitle.addSubview(usersOfListLabel)


        self.navigationItem.titleView = viewForTitle

Дело в том, что я выбираю ширину случайно, что приводит к проблемам с выравниванием на разных устройствах. Как добиться среднего выравнивания в моем случае?

Answer 1

Дело в том, что навигация titleView всегда пытается центрировать ваш вид. Причина того, что заголовок, который вы видите не по центру на меньшем экране, заключается в том, что ширина вашего пользовательского titleView превысила максимальную ширину titleView.

Если вы установите значение 160, вы увидите его по центру для второй ситуации.

Общее решение

Если вы хотите адаптировать ширину заголовка к разным устройствам, есть несколько подходов, которые могут помочь вам решить проблему.

1. Установите разную ширину в зависимости от разной ширины экрана. Например, если ширина экрана равна 320, установите значение не более 160. Если значение больше 320, присвойте значение на основе другого размера экрана. Это не элегантное решение, но в значительной степени простое, не тратя время на настройку и не пытаясь использовать сложные ограничения.

2. Рассчитать фактическую ширину titleView. Ширина titleView определяется шириной панели навигации минус левый и правый barbuttonitem. Что-то вроде

TitleViewWidth = Ширина навигации - leftbarbuttonitem.width +/- rightbarbuttonitem.width - someConstant

Вам нужно немного поэкспериментировать, чтобы найти подходящую константу, которая соответствует этой формуле.

3. Создайте xib-файл для этого titleView, установите ограничения более гибко, чем требуйте фиксированной ширины. Загрузите представление из xib и затем назначьте titleView. Это может занять больше времени, чтобы настроить его на работу.

редактировать

Я думаю о другом способе, который может быть проще для вас, если вы новичок в этом.

В раскадровке найдите и перетащите представление в область заголовка панели навигации этого представления контроллера.

Разверните, как долго вы хотите, чтобы вид был.

Перетащите две метки в это представление и установите начальные и конечные и высотные и вертикальные ограничения.

Как это выглядит на раскадровке

Как это работает на 4S

Answer 2

Подход:

• titleView всегда в центре
• Так что установите ширину вашего пользовательского представления, чтобы соответствовать ширине navigationBar (ширина -40)

Код

private func setupNavigationItems() {

    let label = UILabel()

    label.translatesAutoresizingMaskIntoConstraints = false

    label.text = "aaaaa"
    label.backgroundColor = .green

    label.textAlignment = .left

    navigationItem.titleView = label

    if let navigationBar = navigationController?.navigationBar {

        label.widthAnchor.constraint(equalTo: navigationBar.widthAnchor, constant: -40).isActive = true
    }
}