Touching controlcomponents to show and hide control has a long delay
tmKnight01 opened this issue · 2 comments
Hello, I am very happy to be able to use such a great component, but I encountered a problem on the Android side.
When I touch the video to show and hide the controls, the delay reaches more than 10s.
I read the source code, but I don’t know what happened What.
import React from 'react';
import {
View,
StyleSheet,
Image,
} from 'react-native';
import {AssetItem} from '@/services/api';
import {isEmpty, get} from 'lodash-es';
import VideoPlayer from 'react-native-media-console';
import pxToDp from 'utils/pxToDp';
interface ItemProps {
item: AssetItem;
}
function RenderItem({item}: ItemProps) {
const isStartsWithHttp = (str: string) => str.startsWith('http');
if (isEmpty(item)) return null;
if ((get(item?.t?.split('/'), '[0]', '') as string) == 'video')
return (
<View style={{width: pxToDp(300), height: pxToDp(250)}}>
<VideoPlayer
disableBack
repeat
showOnStart
source={{uri: 'https://media.w3.org/2010/05/sintel/trailer.mp4'}}
/>
</View>
);
if ((get(item?.t?.split('/'), '[0]', '') as string) == 'image') {
if (isStartsWithHttp(item?.b)) {
return (
<Image
onError={e => console.log(e.nativeEvent.error)}
style={CSS.itemBox}
source={{uri: item?.b}}
/>
);
}
return (
<Image
style={CSS.itemBox}
onError={e => console.log(e.nativeEvent.error)}
source={{uri: 'data:image/png;base64,' + item?.b}}
/>
);
}
}
const CSS = StyleSheet.create({
itemBox: {
width: pxToDp(200),
height: pxToDp(150),
marginTop: pxToDp(40),
},
});
export default RenderItem;
it`s my code pls help me - -
Hello @tmKnight01
Unfortunately, we cannot reproduce it on our side and if we copy paste your code of course it won't work. I suggest you create a reproduction repository, that way you'll definitely receive help faster. Start a fresh react-native project by using npx react-native init
in your terminal and see if the problem persists. If you cannot reproduce it on a new project, perhaps there are some issues in a parent component that's using the videoplayer?
Also, did you try the react-native-video alpha version 6? We're using that in production, since v5 has a lot of issues.
Note: react-native-video
is in a pretty bad shape right now, our clients are considering to move to expo-av
, and thus a new videoplayer will be required.
Closing for now. Will be reopened if needed.