Reputation: 51
I'm having a problem with the video player when using the property paused and when putting the inside another View. When I try to put the video between two Views (to test the scroll) the first view is hidden by the player, but the second one stays working. The scrolling also works properly. Although, when I remove the first View, the player just disappears, but the second view stays there. The same issue happens when I put a paused=true, the player just doesn't appears. Another issue I'm having here is when I try to use the Dimensions, the player doesn't show up. Here the code (not using the Dimensions):
import Video from 'react-native-video';
import {
Text,
StyleSheet,
View,
Dimensions,
ScrollView
} from 'react-native';
import api from '../services/api';
import JojoVideo from '../assets/jojo_op_1.mp4';
import Icon from 'react-native-vector-icons/FontAwesome';
export default function Videos({ navigation }) {
/* state = {
paused: true
};
position = {
start: null,
end: null
};
const [state, setState] = useState({ paused: true });
const [postion, setPosition] = useState({ start: null, end: null });
// const {width} = Dimensions.get('window');
return (
<View style={styles.container}>
<ScrollView style={styles.scrollView}>
{/* <View style={styles.fakeContent}></View> */}
<Video
source={JojoVideo}
ref={(ref) => {
player = ref
}}
style={styles.video}
paused={state.paused}
/>
<View style={styles.fakeContent}></View>
</ScrollView>
</View>
);
}
StyleSheet:
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#5EFFB1',
justifyContent: 'center',
alignItems: 'center',
padding: 30
},
scrollView: {
position: 'absolute',
top: 0,
left: 0,
right: 0,
bottom: 0,
flex: 1
},
video: {
position: 'absolute',
top: 0,
left: 0,
bottom: 0,
right: 0
},
fakeContent: {
height: 850,
backgroundColor: "#CCC",
paddingTop: 250,
alignItems: "center"
},
});
When I try to test the Dimensions, the tag will be like that:
<Video
source={JojoVideo}
ref={(ref) => {
player = ref
}}
style={styles.video, width}
paused={state.paused}
/>
Upvotes: 0
Views: 5038
Reputation: 51
Well, I solved the mystery, I only had to put the Video tag inside a View and put the same height in both View and Video... Now it´s working properly!
Upvotes: 5