I am working on creating a custom player controls component for the react-native-video package. I use react-native-video’s onProgress event prop to store the video progress data.
This is not the exact code I am using in my project. I created a function to handle this, but it works the same as shown here:
<Video
onProgress={ ({ currentTime }) => this.setState({ currentTime }) }
/>
Since onProgress is called every 250ms, whenever I click on a Touchable component, there is a chance my press will be cut by the component being re-rendered after the new state is set. This makes my Touchable component frequently unresponsive, and I have to end up pressing it multiple times to get the perfect timing to make it work.
I was curious if there was a way to overcome this issue. I thought about splitting everything in the component into their own small files and connect them all in one parent file, but the issue persisted. Any help would be appreciated!