Style¶
В React Native вы оформляете свое приложение с помощью JavaScript. Все основные компоненты принимают параметр с именем style
. Имена стилей и значения обычно соответствуют тому, как CSS работает в Интернете, за исключением того, что имена пишутся с использованием верблюжьей кавычки, например, backgroundColor
, а не background-color
.
пропс style
может быть обычным объектом JavaScript. Это то, что мы обычно используем для примера. Вы также можете передать массив стилей — последний стиль в массиве имеет приоритет, поэтому вы можете использовать его для наследования стилей.
По мере усложнения компонента часто удобнее использовать StyleSheet.create
для определения нескольких стилей в одном месте. Вот пример:
Один из распространенных шаблонов — заставить ваш компонент принимать свойство style
, которое, в свою очередь, используется для стилизации подкомпонентов. Вы можете использовать это, чтобы сделать стили "каскадными", как это делается в CSS.
Существует множество других способов настройки стиля текста. Полный список смотрите в Text component reference.
Теперь вы можете сделать свой текст красивым. Следующий шаг в становлении экспертом по стилям — узнать, как управлять размером компонента.
Известные проблемы¶
- react-native#29308: В некоторых случаях React Native не соответствует тому, как CSS работает в Интернете, например, область касания никогда не выходит за границы родительского представления, а на Android отрицательные поля не поддерживаются.