Comments (18)
from react-native-video-controls.
from react-native-video-controls.
I am loading the uri link from a server, i dont think its network issue since i checked it on wifi only
Didn't try loading a local video.
My code:
<VideoPlayer
source={{uri: "http://d206s58i653k1q.cloudfront.net/videos/S_D124382B_DD5F_4ABA_BC0B_306044413E2C/c76973b3-b6b5-41b2-aea6-1f2134c231bd.mp4"}}
navigator={ this.props.navigator }
/>
I checked it on my Android Emulator Nexus 5X(Android 7.0) and also on my personal device(Android 7.1).
Can u check and help resolve it?
from react-native-video-controls.
from react-native-video-controls.
URL is same as in the code snippet above, u can check.
It loads fast in the browser.
from react-native-video-controls.
from react-native-video-controls.
how to use a local file instead of url ?
Is the loading late because it is a http url link?
from react-native-video-controls.
Back at my desk now so I can properly address this. Yes. Using a local file would be done like this:
<VideoPlayer source={ require('../assets/video.mp4') } navigator={ this.props.navigator } />
from react-native-video-controls.
I tried using a local file, it works pretty well. But little delay some times.
And the seekbar on moving goes back and comes to the place dragged(but video plays correctly).
Any solution?
from react-native-video-controls.
Okay...let's try some stuff here to figure out where the problem is stemming from.
1.) You should already have RN Video installed as it's a dep of this package so check out the documentation on their git and try using just a video element without any controls to see if the issues persist. I'd also recommend running some quick speed tests to confirm that it's not a network issue. Should look something like....
import Video from 'react-native-video';
// ...
render() {
return (
<Video source={ require('../assets/video.mp4') } />
);
}
2.) Regarding the seek bar jumping back. If what you're talking about is what I think you're talking about then it sounds like your issue is the onProgress event firing before the video has had a chance to update its location on the video. Try modifying the progressUpdateInterval
prop on the <VideoPlayer>
element...by default it fires every 250ms. Try upping this timing to half a second or even a full second like so:
<VideoPlayer progressUpdateInterval={1000} />
The number is in milliseconds and accepts decimals.
from react-native-video-controls.
Regarding the seekbar, i see in the RN Video documentation that progressUpdateInterval is only for iOS, how about in Andorid?
And in RN Video documentation i see methods to seek and presentfullscreenPlayer.
But i am not able to use it with VideoPlayer as it has no effect,why ?
this.player.ref.seek(0) ; this.player.ref.presentFullscreenPlayer()
from react-native-video-controls.
When seeking sometimes seek handle hops back to original position #9 , issues seems to exist still.
from react-native-video-controls.
You'll need to establish a reference to the <VideoPlayer>
first before you can use ref. Something like:
class MyComponent extends Component {
constructor(props) {
super(props);
this.controls = VideoPlayer;
}
render() {
return <VideoPlayer ref={ controls => this.controls = controls} ... />;
}
}
Then you can use the seekTo method on the VideoPlayer class like so: this.ref.seekTo(0)
or access the <Video>
element directly: this.controls.player.ref
or this.controls.player.ref.seek(0)
Keep in mind that presentFullscreenPlayer is iOS only
from react-native-video-controls.
k will check and let u know.
When seeking sometimes seek handle hops back to original position and then moves back #9 , issues seems to exist still. I find this more often when the network speed is bit slow.
As you told progressUpdateInterval is an iOS property ONLY according to react native video git docs.
from react-native-video-controls.
@Thanmai-C When the video is being loaded in your app, are there many/any other network requests being sent off? Seems like it could be related to "other stuff" your app is doing, hard to disregard atm with what you've said.
If so, have you tried loading your video in a plain old demo project, i.e. single component view, with just the video player component referenced?
@kylemilloy Should close this issue, it's become more of a discussion thread, your thoughts?
from react-native-video-controls.
Yeah that sounds about right....closed.
from react-native-video-controls.
I am facing the same issue but I can't use local video because I have a dynamic video from Vimeo server link, it takes some time to load is there any way to buffer the video before the video is playing or any other way
from react-native-video-controls.
I also have the same issue, anyone fixed this?
from react-native-video-controls.
Related Issues (20)
- Render Error [2209, "RCTVIEW",{"width":"<<NaN>>"}] is not usable as a native method argument HOT 9
- add custom btn and change rate
- How to use react-native-video-controls with typescript? HOT 3
- How do you reset the controlTimeout with custom buttons? HOT 1
- customise controller
- e
- Alternative to this lib HOT 2
- Here I add change color for the loader
- Support Integrate VAST Ads like react-native-video
- What is props.navigator ?
- Replay button when video end is reached HOT 2
- paused prop bug
- Starting on video shows exit full screen button instead full screen button & video doesn't plays on ios
- Play and pause videos in React-Native FlatList HOT 1
- Video player not working on Xcode 14.2
- Poster gets removed in IOS
- Default Loading Animation on Initial Loading HOT 1
- on click of onenterfullscreen not working in ios HOT 3
- Spotify Stops when I open RN app that uses react-native-video-controls lib HOT 1
- i can only hear sound not video HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-native-video-controls.