Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I make text vertical (rotated 90 deg) in react native?

Tags:

react-native

How can I make <Text /> vertical (rotated 90 deg) in react native? I want to have some text on the right side of the page along the edge of the screen.

like image 727
Dev01 Avatar asked Jan 28 '16 00:01

Dev01


People also ask

How do I change the orientation in react native?

For Android, open the AndroidManifest. xml file and within the activity element add 'android:screenOrientation="portrait"' to lock to portrait or 'android:screenOrientation="landscape"' to lock to landscape.

How do you rotate in react?

You can use the style prop to add a CSS transform to rotate the icon with a CSS transition to animate the transition. You could also use a third party library like Framer Motion to animate your components - but it is overkill for your needs.

How do you rotate text in CSS?

Rotate text can be done by using rotate() function in CSS. This are used to rotate the text in either clock wise or anti clock wise direction. This functions not only rotate text but also rotates HTML elements.


1 Answers

You can use a transformation.

https://facebook.github.io/react-native/docs/transforms.html#proptypes

myStyle: {     transform: [{ rotate: '90deg'}] } 
like image 177
d-vine Avatar answered Oct 04 '22 02:10

d-vine