#react-native
#react-native
Вопрос:
я столкнулся с проблемой в react native Хотите, чтобы реальное изображение было интерактивным, но не должно нажимать альфа-фон. Пожалуйста, подскажите мне, как я могу это сделать.
На изображении ниже я использовал zIndex для размещения птиц, красным цветом обозначена альфа-область вышеуказанной птицывведите описание изображения здесь
Комментарии:
1. Может быть, попробовать сделать css polygon похожим на те птицы, которые прозрачны?
2. чего вы действительно хотите, так это сделать красную часть интерактивной, верно?, Я думаю, что обертывание вида с помощью TouchableHighlight может вам помочь, пожалуйста, поделитесь каким-нибудь фрагментом кода
3. хотите щелкнуть по красной части, чтобы пользователь мог щелкнуть птицу назад, все птицы доступны для просмотра. проблема в том, что изображение имеет прямоугольную форму (реальное содержимое и другая часть — альфа). итак, изображение птицы выше (альфа-часть покрывает изображение ниже, теперь пользователь не может щелкнуть под изображением птицы).
Ответ №1:
К сожалению, нет простого способа сделать это с помощью React Native. Лучшее решение, которое я нашел, — это определить SVGS и использовать react-native-svg
, который поддерживает события касания. Если вы используете Expo, то оно уже предустановлено и может быть импортировано следующим образом import { Svg } from 'expo'; const { Circle, Rect } = Svg;
.
В качестве альтернативы вы можете использовать WebView
(зеркальное отображение) и маскировку CSS для достижения желаемого результата.