Блог

Итак, в настоящее время я работаю над проектом react native, я пытаюсь добавить компонент всплывающей подсказки, который появляется, когда пользователь нажимает на элемент в Flatlist. это вызовет эту всплывающую подсказку, у которой есть несколько вариантов. Проблема в том, что теперь он был отключен, даже если я установил «позицию» как «абсолютную» с позицией x, y.

Могу ли я в любом случае преодолеть эту проблему? Я тоже пробовал с zIndex, но все равно не получилось.

Вот компонент всплывающей подсказки, который я реализовал.

 export function Tooltip({
    children,
    x,
    y,
    height,
    width,
    isVisible = false,
    component,
}: TooltipProps) {

const [myWidth, setW] = useState(0)
const [myHeight, setH] = useState(0)

function onLayout({
    nativeEvent: {
        layout: {width, height},
    },
    }: LayoutChangeEvent) {
    setW(width)
    setH(height)
}

return (
    <View>
    {children}
    {isVisible amp;amp; (
    <View
        onLayout={onLayout}
        style={{
        elevation: 5,
        borderWidth: 1,
        backgroundColor: 'white',
        position: 'absolute',
    top: (height - componentHeight * 2) / 2   y,
    left: (width - componentWidth) / 2   x,
    }}>
        {component}
    </View>
    )}
    </View>
    )
}
 

Вот изображение в приложении (мне нужно размыть элементы там, извините за неудобства)

Tty для создания родительского представления — safeareaviewe . return(<SafeAreaView><YourComponent/></SafeAreaView>)

Может быть, это может помочь.