Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Interspace between text Lines in React native

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',
}
like image 561
user3521011 Avatar asked Mar 10 '17 16:03

user3521011


People also ask

How do you put a space between text in react?

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.

How do you add space between text and underline in React Native?

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.

What is lineHeight in React Native?

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.


Video Answer


2 Answers

Use lineHeight -

  text: {
    color: '#C0C0C0',
    fontSize: 18,
    textAlign: 'justify',
    lineHeight: 30,
  },
like image 194
vinayr Avatar answered Oct 21 '22 09:10

vinayr


You can use

{'\n'}

inside your Text tag

example :

<Text>{'\n'} Heading : </Text>
like image 27
Salem_Raouf Avatar answered Oct 21 '22 10:10

Salem_Raouf