Я просто пытаюсь реализовать "крайний свет" Ref в реагировать родной.
У меня есть этот код ниже для достижения этого.
<Layout style={{ flex: 1, paddingTop: 18, paddingBottom: 18, paddingLeft: 28, paddingRight: 28, borderWidth: 10, borderColor: '#36ABA5', justifyContent: 'center', backgroundColor: '#000', color: '#fff' }}> // All my code </Layout>
Это кажется работать нормально для мобильных телефонов с прямыми экранами. Но я сталкиваюсь с двумя проблемами:
- То же не работает, когда на мобильном телефоне есть метка или функциональные клавиши мобильного телефона включены.
- В Honor 8x сама граница не появляется, когда программные клавиши отключены, когда они включены, граница появляется над программными клавишами.
Я попытался вычислить высоту окна, высоту экрана и поставить границу. Кажется, что это не происходит.
В прямом телефоне

В телефоне Notch:

Включены программные клавиши:

В программных клавишах отключено:

Требуется аналогично этому, но не красочно / ожидаемые результаты :
