I need to change the space between lines in a text in a React Native for both android and iOS. This is the code in the styles pages:
text: {
color: '#C0C0C0',
fontSize: 18,
textAlign: 'justify',
}
To add space between two elements on the same line with React, we can use flexbox. We set the style prop of the outer div to { display: "flex", justifyContent: "space-between" } to make the div have a flexbox layout.
Show activity on this post. Wrap your Text in a View that has a style containing borderBottomWidth: 1 or whatever you want the thickness to be. Give your Text a lineHeight to adjust the spacing between the border and the content. If you have multiple lines of text, then using paddingBottom would also work.
React Native provide lineHeight style props to make vertical space between text. lineHeight default value is 0 use if developer not defined lineHeight for text.
Use lineHeight
-
text: {
color: '#C0C0C0',
fontSize: 18,
textAlign: 'justify',
lineHeight: 30,
},
You can use
{'\n'}
inside your Text tag
example :
<Text>{'\n'} Heading : </Text>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With