React-native textAlign по выравниванию

Андроид

Я пытался использовать textAlign для выравнивания текста, но это не сработало.

<Text style={{textAlign: 'justify',color:'#1B3D6C', margin: 20}}>
Lorem ipsum dolor sit amet, et usu congue vocibus, ei sea alienum repudiandae, intellegam quaerendum an nam. Vocibus apeirian no vis, eos cu conguemoo scaevola accusamus. Et sea placerat persecutii oinn
</Text>

введите описание изображения здесь

Редактировать: хорошо, textAlign justify не работает на Android, так что я спрашиваю сейчас, есть ли какое-то решение для этого? Мне очень нужно!


react-native react-native-ios react-native-android
person Brunaine    schedule 09.05.2017    source источник
comment
Когда я прочитал это, вы забыли добавить justify : some text here , так что попробуйте этот код <Text style={{textAlign: 'justify',color:'#1B3D6C', margin: 20}}> justify : Lorem ipsum dolor sit amet, et usu congue vocibus, ei sea alienum repudiandae, intellegam quaerendum an nam. Vocibus apeirian no vis, eos cu conguemoo scaevola accusamus. Et sea placerat persecutii oinn </Text>   -  person Yash Karanke    schedule 09.05.2017
comment
Это не сработало, просто появился текст в представлении «Justify: Lorem .....»   -  person Brunaine    schedule 09.05.2017

Ответы (2)


arrow_upward
21
arrow_downward

Android не поддерживает выравнивание текста. Документы компонента React Native Text об атрибуте стиля говорят:

textAlign enum('auto', 'left', 'right', 'center', 'justify'): определяет выравнивание текста. Значение "по ширине" поддерживается только на iOS и заменяется значением "слева" на Android.

Чтобы обойти это ограничение, можно использовать компонент React Native WebView. Содержимое WebView может быть HTML-кодом с выровненным по ширине текстом. Как это:

<View style={{flex: 1}}>
    <WebView
        source={{ html: "<p style='text-align: justify;'>Justified text here</p>" }}
    />
</View>
person Bruno Peres    schedule 09.05.2017
comment
Это не работает на реальном устройстве, текст идет влево, используя реактивную версию 0.56. - person 151291; 21.09.2018
comment
Оно работает!! и если вы используете динамические тексты, вы можете сделать так: const NoteContent = ${Nota.content}; и используйте его внутри WebView следующим образом: ‹p style='text-align: justify;'› + NoteContent + ‹/p› - person Luciano Santos; 22.04.2020

arrow_upward
16
arrow_downward

ОБНОВЛЕНИЕ

В старых версиях react-native textAlign:'justify' не работал для Android, но теперь он поддерживает textAlign:'justify' для Android Oreo и выше.

textAlign: перечисление («авто», «влево», «вправо», «по центру», «по ширине»)

Задает выравнивание текста. Значение justify поддерживается только на iOS и Android Oreo (8.0) или выше (уровень API >= 26). Для более низкой версии Android он будет отступать влево.

Прочтите обновленную документацию здесь

person HarshitMadhav    schedule 17.10.2019
comment
Это идеально. Спасибо, чувак. - person Ekane 3; 13.04.2021
comment
@Ekane3 Рад, что это помогло вам. - person HarshitMadhav; 15.04.2021