Перечисление Direction

Перечисление Direction задает ключ direction в стиле View. Направление влияет на порядок элементов в ряду и на то, с какой стороны считаются left и right. Системное направление интерфейса задает класс I18nManager.

Синтаксис

direction: 'rtl'

Значения

Значение	Описание
`'inherit'`	Берется направление от родительского контейнера.
`'ltr'`	Письмо слева направо; начало ряда слева.
`'rtl'`	Письмо справа налево; начало ряда справа.

Пример

Давайте поставим тексты в ряд справа налево:

import { View, Text, StyleSheet } from 'react-native';

export default function App() {
	return (
		<View style={styles.row}>
			<Text>abcde</Text>
			<Text>12345</Text>
		</View>
	);
}

const styles = StyleSheet.create({
	row: {
		flexDirection: 'row',
		direction: 'rtl',
	},
});

На экране первый текст окажется справа, второй слева от него.

Пример

Давайте явно зададим письмо слева направо:

import { View, Text, StyleSheet } from 'react-native';

export default function App() {
	return (
		<View style={styles.row}>
			<Text>abcde</Text>
			<Text>12345</Text>
		</View>
	);
}

const styles = StyleSheet.create({
	row: {
		flexDirection: 'row',
		direction: 'ltr',
	},
});

На экране тексты пойдут в ряд слева направо независимо от системной локали.

Смотрите также

перечисление FlexDirection,
которое задает направление главной оси
класс I18nManager,
который включает RTL для всего приложения
компонент View,
который держит дочерние элементы
класс StyleSheet,
который собирает объект стиля