我想旋转一个Text
组件,角度为-90deg
。该组件应该从左侧角落而不是中心旋转。我正在使用以下代码:
render() {
return (
<View style = {{flex : 1}}>
<View style={styles.sidebar}>
<Text style={styles.lblSideBar} numberOfLines = {1} >DUMMY TEXT</Text>
</View>
</View>);
}
const styles = StyleSheet.create({
sidebar : {
flex : 1,
flexDirection : 'row',
alignItems : 'flex-end',
justifyContent : 'center',
width : 30,
},
lblSideBar : {
bottom : 20,
transform : [{rotate : '-90deg'}],
}
});
我想要底部空间为20像素,但由于旋转默认从中心进行,所以文本在旋转后覆盖了底部区域。请建议如何实现?
此外react-native
需要支持pivotPoint
、anchorPoint
或transformOrigin
,以便可以轻松地实现此属性。