具有不同宽度的多行文字?

时间:2018-08-08 08:32:06

标签: react-native react-native-text

在React Native中是否可以制作多行文本,其中行的长度不同?

我的情况是示例地址(可以是任何字符串),其中行的长度相同:

const address = 'Circular Quay, Alfred St, Sydney 2021 NSW Alexandria';
return ( 
    <View style={{width: 80}}>
        <Text>{address}</Text>
    </View>
)

所需结果:

multiline text with different widths

谢谢!

2 个答案:

答案 0 :(得分:0)

您可以通过在文本样式中应用不同的宽度来实现此目的

<Text style={{width='200'}}>Text 1</Text>
<Text style={{width='100'}}>Text 2</Text>

答案 1 :(得分:0)

问题的解决方案可以是“文本组件”中的textAlign属性。

<View style={{width: 80}}>
    <Text style={{ textAlign:'center'}}>{address}</Text>
</View>