I want to rotate a Text
component with an angle of -90deg
. The component should be rotated from the left corner instead of middle. I am using below
constructor(props) {
super(props)
this.state = {
angle: 0
}
}
componentDidMount() {
this.progress()
}
progress(){
intervalId = BackgroundTimer.setInterval(() => {
this.setState({angle: this.state.angle +1})
}, (1000); // 1000 milliseconds
}
render () {
const dx = responsiveHeight(9.5);
const dy = responsiveHeight(9.5);
const position= {
transform: [
{
translateX: Math.cos((360 - this.state.angle) * Math.PI / 180) * dx - Math.sin((360 - this.state.angle) * Math.PI / 180) * dy
},
{
translateY: Math.sin((360 - this.state.angle) * Math.PI / 180) * dx + Math.cos((360 - this.state.angle) * Math.PI / 180) * dy
}
]
};
return(
Text move
);
}
NOTE: responsiveHeight, responsiveWidth are introduced in
react-native-responsive-dimensions
BackgroundTimer please check here react-native-background-timer
Import some libraries