it-roy-ru.com

Ионная панель вкладок перекрывает домашнюю кнопку (iPhone X - iOS 11)

С iOS 11 и iPhone X указано Apple каждое приложение должно находиться в «безопасной зоне» (из-за кнопки виртуального дома):

 enter image description here

Вставить необходимый контент для предотвращения отсечения. [...] Для достижения наилучших результатов используйте стандартные, предоставленные системой элементы интерфейса и Auto Layout, чтобы создать свой интерфейс. Все приложения должны придерживаться безопасных областей и полей макета, определенных UIKit, которые обеспечивают соответствующую вставку в зависимости от устройства и контекста. Безопасная область также не позволяет контенту перекрывать строку состояния, панель навигации, панель инструментов и панель вкладок.

Проблема в приложении Ionic (v. 1) с панелью вкладок, покрывающей эту часть экрана, поэтому панель находится под кнопкой home:

 enter image description here

Кто-нибудь знает как это исправить?

(обратите внимание: если вы запустите новое приложение Ionic v1 в симуляторе iPhone X, вы получите два черных пространства вверху и внизу окна, но вы можете предотвратить это, добавив "viewport-fit = cover" к вашему метатегу внутри index.html)

6
Ernesto Schiavo

Для проекта Ionic1 я обнаружил, что нацеливание на tab-nav дает свои результаты.

.tab-nav {
    margin-bottom: constant(safe-area-inset-bottom);
}
0
Murph0

Вы должны быть в состоянии применить тот же принцип, изложенный в этот ответ к нижнему колонтитулу Ionic v1, т.е. 

.bar-footer {
    margin-bottom: constant(safe-area-inset-bottom);
}

(или что-то подобное - я не проверял это)

1
DaveAlden

Вы можете добавить ограничение в свой пользовательский основной вид tabBar, чтобы подключить его к нижнему safeAreaLayoutGuide.

yourView.bottomAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.bottomAnchor).isActive = true
0
Andres Arciniegas