React Native - точные тени в Android

Целевая тень:

Target Shadow

Текущая реализация:

Текущая реализация

Я использую React-Native-Shadow, но он не размывает тень, поскольку в React-Native-SVG нет реализации размытия.

Есть ли способ достичь этой тени? Я даже пытался размыть shaodow svg, но безуспешно.

Даже в Android нет возможности изменить цвет высоты или любую другую библиотеку, которая обеспечивает точные тени. Если кто-нибудь может подсказать мне способ, я могу сделать свой собственный модуль.

ShadowOpt Используется:

  width: 105,
  height: 1,
  top: 0,
  color: '#0c00ff',
  border: 27,
  radius: 0,
  opacity: 0.8,
  x: 36,
  y: 30,
  style: { position: 'absolute' }

react-native reactjs android svg react-native-android
person vatsa patel    schedule 26.01.2018    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Я использую их для создания тени, но не уверен, что это поможет в SVG. Я ими не пользовался. Дайте мне знать

elevationLow: {
          ...Platform.select({
            ios: {
              shadowColor: '#000',
              shadowOffset: { width: 0, height: 2 },
              shadowOpacity: 0.8,
              shadowRadius: 2,    
            },
            android: {
              elevation: 5,
            },
          }),
        },

Обратите внимание, что вам придется импортировать платформу из response-native, поскольку стиль имеет разные реализации в iOS или Android.

person sfratini    schedule 28.01.2018
comment
Спасибо за ответ, но в Elevation нет средств для изменения цвета или даже шкалы x. Я хотел бы создать цветную тень, чтобы кнопка была полупрозрачной, а свет светился от нее. - person vatsa patel; 28.01.2018
comment
А, подумал, ты имел в виду, что тень имела пару размытых линий. Так что ты хочешь сделать? Размыть текст? Для этого есть библиотека, которая называется response-native-blur. Насколько я знаю, вы можете только размыть изображение изначально. - person sfratini; 28.01.2018