skewY在React Native上没有按预期工作,似乎不是倾斜变换 - 而是应用了2D旋转。
我的渲染方法:
<View style={styles.container}>
<View style={styles.background}>
<Image style={styles.bgImage}
source={require('../assets/live_betting.png')} />
</View>
<View style={styles.placeholder} />
<View style={styles.overlay}
onClick={this.navigateToGame()}>
</View>
</View>
样式表:
const styles = StyleSheet.create({
container: {
flex: 1,
flexDirection:'column',
backgroundColor: '#F5FCFF'
},
background : {
position: 'absolute',
top:0,
left:0,
right:0,
bottom:0
},
bgImage: {
alignSelf : 'center'
},
placeholder : {
flex: .75
},
overlay : {
flex: .25,
backgroundColor: 'rgba(249,168,37,0.7)',
transform: [{skewY: '10deg'}]
}
});
结果如下:
我错过了什么吗?
似乎所有反应原生变换都是3D变换,但是在这种情况下没有SkewZ变换是正确的。