反应本机中的不规则形状视图？

Question

如何设计以下视图。我尝试使用borderWidth调整和透明度。帮我。 如何制作以下“ 30％折扣”视图？

Answer 1

这对我有用。

<View style={{
  width: 62,
  height: 0,
  borderBottomColor: colors.yellow,
  borderBottomWidth: 15,
  borderLeftWidth: 15,
  borderRightWidth: 15,
  borderRightColor: 'transparent',
  borderLeftColor: 'transparent',
  transform: [{ rotate: '315deg' }],
  top: 9,
  left: -15,
  position: 'absolute',
}}
>
    <Text style={{fontFamily: 'Montserrat_Medium', fontSize: 9, color: colors.white, marginTop: 1}}>25% off</Text>
</View>