Playing a video from the VideoCard component ListHeaderComponent disappears

[brayanobisto]

When a video is played on the Home screen in the VideoCard component, the ListHeaderComponent disappears

video5004055281194238821.mp4

[usmanpkz]

actually it does not disappear, it goes behind the video that is playing. I was having the same problem. I changed the video height in component to h-60 (same as the TouchableOpacity that follows in that ternary operator. that seems to fix the issue. Not sure why no other height settings work for the video element but the issue got fixed.

{play ? (
<Video
source={{ uri: video }}
className='h-60 w-full rounded-xl mt-3 '
useNativeControls
shouldPlay
resizeMode={ResizeMode.COVER}
onPlaybackStatusUpdate={status=> status.didJustFinish == true && setPlay(false)}
/>
) : (
<TouchableOpacity
className='w-full h-60 rounded-xl mt-3 relative justify-center items-center'
activeOpacity={0.7}
onPress={() => setPlay(true)}
>
<Image
source={{ uri: thumbnail }}
className='h-full w-full rounded-xl mt-3'
resizeMode='cover'
/>


)}