Выбор ответа Middle Компоненты и стили обновлено
React Native: вырезы и системные панели
Вопрос
Как правильно учесть «чёлку» и системные панели на обеих платформах?
Попробуйте сами
Выберите вариант, и откроется разбор.
Показать ответ и разбор
Коротко
Правильный ответ: react-native-safe-area-context: провайдер в корне и useSafeAreaInsets в экранах. Библиотека safe-area-context даёт отступы на обеих платформах и обновляет их при повороте.
Варианты ответа
- Встроенный
SafeAreaViewизreact-native, он одинаково работает на Android и iOS react-native-safe-area-context: провайдер в корне иuseSafeAreaInsetsв экранахправильный ответ- Добавить
paddingTop: 44всем экранам: это высота выреза на всех телефонах - Использовать
StatusBar.currentHeightкак верхний отступ на обеих платформах
Разбор
Библиотека safe-area-context даёт отступы на обеих платформах и обновляет их при повороте. Встроенный SafeAreaView работает только на iOS и устарел. Фиксированные 44 точки неверны для разных устройств и ориентаций. StatusBar.currentHeight есть только на Android и не учитывает вырезы и нижнюю панель.
Ответьте сами, а не прочитайте
В тренажёре вопрос попадёт в повторения и вернётся, когда начнёт забываться. Плюс билеты с зачётом: 20 вопросов, не больше 2 ошибок.