Надеюсь смогу понятно объяснить проблему) Подскажите, нужно сделать так, чтобы

Question

React Native — русскоговорящее сообщество

Надеюсь смогу понятно объяснить проблему) Подскажите, нужно сделать так, чтобы

основной контент экрана был ровно по центру по высоте, но на экране есть еще кнопка, которая прижата к низу экрана. Т.е. нужно, чтобы эта кнопка никак не влияла на центровку основного контента. Я пытался обернуть кнопку во <View> и так же сверху делал пустой <View>, которым давал flex: 1. Но проблема в том, что нижний из-за того, что в нем есть содержимое, все же больше верхнего. Есть какие-то приемы, чтобы добиться желаемого поведения? У меня в голове только вариант, с onLayout на нижнем <View> и применение его высоты для верхнего <View>.

#mobile #programming #reactnative #russian

0

30.10.2023

11 ответов

38 просмотров

Владимир Муравьев Автор вопроса

Alex
Спозиционировать нижнюю секцию с кнопкой через abs...

А если контента станет много (или экран маленький), то будут проблемы)

0

30.10.2023

Alex

Владимир Муравьев
А если контента станет много (или экран маленький)...

Ну я же не гадалка. Часто такие скрины делают где-то на экране авторизации где контента много не будет. И он вообще не динамичный. Если экран маленький - тут адаптировать, да. Если контента станет много — просчитать это условиями и не давать paddingTop. Но всегда проще договориться, чтобы содержимое в верхней секции было посередине относительно своего контейнера.

0

30.10.2023

Владимир Муравьев Автор вопроса

Alex
Ну я же не гадалка. Часто такие скрины делают где-...

А вариант с onLayout - бред?) Как считаете?

0

30.10.2023

Alex

Владимир Муравьев
А вариант с onLayout - бред?) Как считаете?

Лучше избегать такого там, где это возможно. Скорее всего будет моргать при просчёте и выставлении этого значения.

0

30.10.2023

Sergei Калуцкий

А можешь пример скинуть визуальный? Скрин, или что-то подобное, так может быстрее поймут что конкретно надо

0

30.10.2023

Sergei Калуцкий

Кнопку абсолютом сделай, а контейнер через пробы flex по центру и все гуд будет на первый взгляд

0

30.10.2023

Владимир Муравьев Автор вопроса

Sergei Калуцкий
Кнопку абсолютом сделай, а контейнер через пробы f...

Я с вэба не привык к ограничениям) Не могу себя заставить так сделать. Потому что если повернуть телефон, контент уже не будет убираться на экран и будет проблема

0

30.10.2023

Alex

Не так я себе визуализировал то, что ты описал. Такое без проблем верстается, flex: 1 и justifyContent: ‘center’ для содержимого с текстом оно и подвинет блок с кнопкой. Доступность горизонтального положения тут лучше выключить.

0

30.10.2023

Владимир Муравьев Автор вопроса

Alex
Не так я себе визуализировал то, что ты описал. Т...

Для такого нужно кнопку абсолютно спозиционировать

0

30.10.2023

Alex

Владимир Муравьев
Для такого нужно кнопку абсолютно спозиционировать

Верстай, зашлёшь что произойдет при абсолютном позиционировании с открытой клавой )

0

30.10.2023

Alex · Accepted Answer

Alex

Спозиционировать нижнюю секцию с кнопкой через absolute. Либо заранее заложить константой высоту нижнего содержимого с кнопкой и дать paddingTop: HEIGHT для верхнего содержимого

0

30.10.2023

169 похожих чатов

Надеюсь смогу понятно объяснить проблему) Подскажите, нужно сделать так, чтобы

11 ответов

Похожие вопросы