- React Native - transform样式的使用详解(平移、缩放、旋转、倾斜等图形变换)
1,平移(translate)
- translateX:沿 x 轴方向平移
- translateY:沿 y 轴方向平移
2,缩放(scale)
- scaleX:沿 x 轴方向放大
- scaleY:沿 y 轴方向放大
- scale:沿 x、y 轴方向都放大
3,旋转(rotate)
- rotateX:沿 x 轴旋转
- rotateY:沿 y 轴旋转
- rotateZ:沿 z 轴旋转
- rotate:不指定轴旋转
4,倾斜(skew)
- skewX:沿 x 轴方向倾斜
- skewY:沿 y 轴方向倾斜
http://www.hangge.com/blog/cache/detail_1746.html
const styles = StyleSheet.create({
flex:{
flex:1,
alignItems: 'center'
},
t1: {
transform: [{rotateX:'45deg'}]
},
t2: {
transform: [{rotateY:'45deg'}]
},
t3: {
transform: [{rotateZ:'45deg'}]
},
t4: {
transform: [{rotate:'45deg'}]
}
});