it-swarm.com.ru

руководство по макету iOS 11 о безопасной области для iPhone x

Мое приложение уже в магазине приложений, вчера я обновил свою версию XCode до 9 и работает нормально, за исключением iPhone x. Пользователь рухнул.

1. Здесь я создал два UIView (оба имеют фиксированную высоту), названные заголовком и панелью вкладок, и я спрятал все свое приложение NavigationBar.

2.Добавлено расширение UIViewController для создания заголовка и вкладки

func addHeaderTab(currentViewController:UIViewController,content:String, isMenu:Bool){
        let noView = TopHeaderView()
        noView.tag = 12345
        noView.isMenu = isMenu
        noView.translatesAutoresizingMaskIntoConstraints = false
        currentViewController.view .addSubview(noView)
        if isMenu{
            noView.menuBtn .setImage(UIImage(named: "Small"), for: .normal)
            noView.logoImg.isHidden = false

        }else{
            noView.menuBtn .setImage(UIImage(named: "arrow_small"), for: .normal)
            noView.logoImg.isHidden = true
        }
        noView.titleLbl.text = content
        noView.delegate = (currentViewController as! menuOpen)

        NSLayoutConstraint(item: noView, attribute: .leading, relatedBy: .equal, toItem: currentViewController.view, attribute: .leading, multiplier: 1.0, constant: 0.0).isActive = true

        NSLayoutConstraint(item: noView, attribute: .trailing, relatedBy: .equal, toItem: currentViewController.view, attribute: .trailing, multiplier: 1.0, constant: 0.0).isActive = true

        NSLayoutConstraint(item: noView, attribute: .top, relatedBy: .equal, toItem: currentViewController.view, attribute: .top, multiplier: 1.0, constant: 0.0).isActive = true

        NSLayoutConstraint(item: noView, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .height, multiplier: 1.0, constant: 64).isActive = true

    }

и вызывая его каждый Viewcontroller, как показано ниже:

self.addHeaderTab(currentViewController: self, content:"நிகழ்ச்சி நிரல்" , isMenu: true)

Как и та панель вкладок, которую я сделал, но все работающие устройства ожидают iPhone x.

Смотрите мой снимок экрана: 

 Image

я изучал о https://developer.Apple.com/ios/human-interface-guidelines/overview/iphone-x/

но не ясно с их документом.

Помощь будет оценена, спасибо заранее.

11
karthikeyan

С iOS11 (и появлением iPhoneX) Apple представила Safe Layout Guide, чтобы адаптировать ваши взгляды к iPhoneX.

Безопасная зона - это область экрана, которая не перекрывается надписью или индикатором дома. 

 enter image description here

Чтобы избежать проблемы, с которой вы столкнулись, вы должны изменить главное ограничение noView для iOS11:

if #available(iOS 11, *) {
   let guide = view.safeAreaLayoutGuide
   NSLayoutConstraint.activate([
      noView.topAnchor.constraint(equalTo: guide.topAnchor)
   ])
} else {
   NSLayoutConstraint.activate([
      noView.topAnchor.constraint(equalTo: currentViewController.topLayoutGuide.bottomAnchor)
   ])
}
NSLayoutConstraint.activate([
   noView.leadingAnchor.constraint(equalTo: currentViewController.view.leadingAnchor),
   noView.trailingAnchor.constraint(equalTo: currentViewController.view.trailingAnchor),
   noView.heightAnchor.constraint(equalToConstant: 65)
])

К сожалению, это еще не все. Потому что теперь ваш noView перемещается вниз на iPhone X, но строка состояния больше не имеет красного фона. Вы добавили красный цвет фона за строкой состояния:

 enter image description here  enter image description here

Вы можете сделать все намного проще, используя UINavigationController (с красной панелью навигации):

 enter image description here  enter image description here

При таком подходе вам не нужно устанавливать никаких ограничений! Система выполняет все настройки автоматически.

19
joern

В Objective-C для верхнего и нижнего поля, когда на iPhone-X

if (@available(iOS 11, *)) {

    NSLayoutConstraint *bottomConstraint   = [NSLayoutConstraint constraintWithItem:self.childView
                                                                          attribute:NSLayoutAttributeBottom
                                                                          relatedBy:NSLayoutRelationEqual
                                                                             toItem:self.parentView.safeAreaLayoutGuide
                                                                          attribute:NSLayoutAttributeBottom
                                                                         multiplier:1.0
                                                                           constant:0];


    NSLayoutConstraint *topConstraint   = [NSLayoutConstraint constraintWithItem:self.childView
                                                                   attribute:NSLayoutAttributeTop
                                                                   relatedBy:NSLayoutRelationEqual
                                                                      toItem:self.parentView.safeAreaLayoutGuide
                                                                   attribute:NSLayoutAttributeTop
                                                                  multiplier:1.0
                                                                    constant:0];


} else {

    NSLayoutConstraint *bottomConstraint   = [NSLayoutConstraint constraintWithItem:self.childView
                                                                      attribute:NSLayoutAttributeBottom
                                                                      relatedBy:NSLayoutRelationEqual
                                                                         toItem:self.parentView
                                                                      attribute:NSLayoutAttributeBottom
                                                                     multiplier:1.0
                                                                       constant:0];


    NSLayoutConstraint *topConstraint   = [NSLayoutConstraint constraintWithItem:self.childView
                                                                   attribute:NSLayoutAttributeTop
                                                                   relatedBy:NSLayoutRelationEqual
                                                                      toItem:self.parentView
                                                                   attribute:NSLayoutAttributeTop
                                                                  multiplier:1.0
                                                                    constant:0];

}
6
Chandan

Установите ограничение высоты headerView в соответствии с устройством.

if iPhoneX {
NSLayoutConstraint(item: noView, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .height, multiplier: 1.0, constant: 64+24).isActive = true
} else {
NSLayoutConstraint(item: noView, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .height, multiplier: 1.0, constant: 64).isActive = true
}

И установите все ограничения subView (of headerView), соответствующие нижней части суперпредставления (headerView). 

Дополнительная информация о том, почему мы добавили 24 пикселя для iphoneX:

    // portrait orientation - status bar is shown
    additionalSafeAreaInsets.top = 24.0
0
Mehul Sojitra

Если вы не хотите использовать UINavigationController, но хотите иметь панель навигации, вы можете сделать это (используя UIImageView):

https://medium.com/@kahseng.lee123/creating-custom-navigation-bar-tab-bar-for-iphone-x-f03b1e1827d3

Или вы можете создать представление и установить его верхнее ограничение в верхней части суперпредставления и его нижнее ограничение в верхней части панели навигации. Не забудьте сделать его красным. :-)

0
user1094081