'skewY'变换无法正常工作

时间:2016-05-26 10:17:25

标签: javascript css reactjs react-native

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'}]
  }
});

结果如下:

enter image description here

我错过了什么吗?

修改

似乎所有反应原生变换都是3D变换,但是在这种情况下没有SkewZ变换是正确的。

0 个答案:

没有答案