Треугольник с размытым фоном - PullRequest
Новая
       26

Треугольник с размытым фоном

0 голосов
/ 25 апреля 2019

Я пытаюсь размыть вид, который имеет форму треугольника.Треугольник отлично работает для простых компонентов представления, но когда я использую BlurView, он просто дает мне размытое представление квадрата.

Есть идеи, как решить эту проблему?Вот мой текущий код ... 

const Triangle = () => <View style={Style.triangle} />; => works
const BlurTriangle = () => <BlurView  blurType="dark" blurAmount={2} style={Style.triangle} />; => does not works => renders a blur square element

const Style = StyleSheet.create({
 triangle: {
  overflow: 'hidden',
  left: 10,
  width: 0,
  height: 0,
  backgroundColor: 'transparent',
  borderStyle: 'solid',
  borderLeftWidth: 8,
  borderRightWidth: 8,
  borderBottomWidth: 16,
  borderLeftColor: 'transparent',
  borderRightColor: 'transparent',
  borderBottomColor: 'rgba(0,0,0,0.3)',
  transform: [{ rotate: '180deg' }],
 },
});

Есть идеи, как сделать треугольник BlurView?:)

...