Центрирование пользовательского элемента панели навигации с помощью якорей макета

Я создал пользовательский элемент навигации (с заголовком и UISearchBar) заменить стандартное название навигации на iOS, и я пытаюсь центрировать его в UINavigationBar, используя привязки макета.

Тем не менее, ограничение макета [self.navigationItem.titleView.centerXAnchor constraintEqualToAnchor:self.navigationController.navigationBar.centerXAnchor].active = YES; не работает и UIView содержащая строку поиска отображается слева от UINavigationBar,

Другие ограничения:

  • Ширина должна составлять 1/3 ширины экрана
  • Я хочу избежать установки ширины в качестве константы, чтобы сделать представление отзывчивым в ответ на ориентацию и другие изменения макета

Как центрировать элемент панели навигации?

ScreenViewController.m:

- (void) viewDidLoad {
    [super viewDidLoad];

    // Create the search bar
    self.searchBar = [SearchBar new];

    // Create a new UIView as titleView (otherwise I'm receiving an error)   
    self.navigationItem.titleView = [UIView new];

    // Add into view hierarchy and turn off auto constraints
    [self.navigationController.navigationBar addSubview:self.navigationItem.titleView];
    [self.navigationItem.titleView setTranslatesAutoresizingMaskIntoConstraints:NO];
    [self.navigationItem.titleView addSubview:self.searchBar.view];            
    [self.searchBar.view setTranslatesAutoresizingMaskIntoConstraints:NO];

    // Set anchors for the wrapping view
    [self.navigationItem.titleView.widthAnchor constraintEqualToAnchor:self.navigationController.navigationBar.widthAnchor multiplier:1.0/3.0].active = YES;
    //[self.navigationItem.titleView.heightAnchor constraintEqualToConstant:50.0].active = YES;
    [self.navigationItem.titleView.topAnchor constraintEqualToAnchor:self.navigationController.navigationBar.topAnchor].active = YES;
    [self.navigationItem.titleView.centerXAnchor constraintEqualToAnchor:self.navigationController.navigationBar.centerXAnchor].active = YES;
    [self.navigationItem.titleView.bottomAnchor constraintEqualToAnchor:self.navigationController.navigationBar.bottomAnchor].active = YES;

    // Set anchors for the search bar
    [self.searchBar.view.widthAnchor constraintEqualToAnchor:self.navigationItem.titleView.widthAnchor multiplier:1.0].active = YES;
    //[self.navigationItem.titleView.heightAnchor constraintEqualToConstant:50.0].active = YES;
    [self.searchBar.view.topAnchor constraintEqualToAnchor:self.navigationItem.titleView.topAnchor].active = YES;
    [self.searchBar.view.bottomAnchor constraintEqualToAnchor:self.navigationItem.titleView.bottomAnchor].active = YES;
    //[self.searchBar.view.leftAnchor constraintEqualToAnchor:self.navigationItem.titleView.leftAnchor].active = YES;
    //[self.searchBar.view.rightAnchor constraintEqualToAnchor:self.navigationItem.titleView.rightAnchor].active = YES;
    [self.searchBar.view.centerXAnchor constraintEqualToAnchor:self.navigationItem.titleView.centerXAnchor].active = YES;
}

Ожидаемый результат: Центрирование панели поиска

Что я получаю (вид заголовка не по центру): Центрирование проблемы в строке поиска

Посмотреть иерархию:

Посмотреть иерархию

2 ответа

То, что вы делаете, невозможно и незаконно. Вы вообще не создаете "пользовательский элемент панели навигации" (как указано в заголовке). Вы пытаетесь добавить подпредставление непосредственно на панель навигации. Вы не можете сделать это. Способ поместить что-то в панель навигации - назначить это в контроллер вида navigationItemлибо как элемент панели кнопок, либо как реальный элемент навигации titleView, (Вы называете свою переменную titleView, но на самом деле вы не делаете его элементом навигации titleView.)

Вот мое решение, меняя только вид заголовка, устанавливая его привязку ширины к доле навигационной панели, чтобы сделать его отзывчивым:

// Create search bar and set it as title view
self.searchBar = [SearchBar new];
self.navigationItem.titleView = self.searchBar.view;

// Turn auto constraints off
[self.searchBar.view setTranslatesAutoresizingMaskIntoConstraints:NO];

// Set the layout anchors
[self.navigationItem.titleView.widthAnchor constraintEqualToConstant:250.0].active = YES; // Had to set the width to a constant
// Was still causing problems
//[self.navigationItem.titleView.widthAnchor constraintEqualToAnchor:self.navigationController.navigationBar.widthAnchor multiplier:1.0/3.0].active = YES;// Still need to access the navigation bar's anchor
[self.navigationItem.titleView.heightAnchor constraintEqualToConstant:50.0].active = YES;
Другие вопросы по тегам