feat(Windows): Adds Windows support to react-native-video
This PR adds react-native-windows support to react-native-video. The Video component is implemented with a XAML MediaPlayerElement. Most of the features implemented by Android (and some additional ones) are implemented by Windows. Known issues and missing features include: * onReadyForDisplay event * local URI convention (e.g., "broadchurch" in examples changed to require("./broadchurch.mp4") * `playableDuration` in `onVideoProgress` event is always 0.0 * `playInBackground` is not yet supported * Volume settings are applied, but the UWP control does not handle it properly
This commit is contained in:
53
README.md
53
README.md
@@ -80,6 +80,59 @@ Under `.addPackage(new MainReactPackage())`:
|
||||
.addPackage(new ReactVideoPackage())
|
||||
```
|
||||
|
||||
#### Windows
|
||||
|
||||
Make the following additions to the given files manually:
|
||||
|
||||
**windows/myapp.sln**
|
||||
|
||||
Add the `ReactNativeVideo` project to your solution.
|
||||
1. Open the solution in Visual Studio 2015
|
||||
2. Right-click Solution icon in Solution Explorer > Add > Existing Project...
|
||||
3. Select `node_modules\react-native-video\windows\ReactNativeVideo\ReactNativeVideo.csproj`
|
||||
|
||||
**windows/myapp/myapp.csproj**
|
||||
|
||||
Add a reference to `ReactNativeVideo` to your main application project.
|
||||
|
||||
Using Visual Studio 2015:
|
||||
1. Right-click main application project > Add > Reference...
|
||||
2. Check `ReactNativeVideo` from Solution Projects.
|
||||
|
||||
Manually from `windows/myapp/myapp.csproj`, add:
|
||||
```xml
|
||||
<ProjectReference Include="..\..\node_modules\react-native-video\windows\ReactNativeVideo\ReactNativeVideo.csproj">
|
||||
<Project>{e8f5f57f-757e-4237-ad23-f7a8755427cd}</Project>
|
||||
<Name>ReactNativeVideo</Name>
|
||||
</ProjectReference>
|
||||
```
|
||||
|
||||
**MainPage.cs**
|
||||
|
||||
Add the `ReactVideoPackage` class to your list of exported packages.
|
||||
```cs
|
||||
using ReactNative;
|
||||
using ReactNative.Modules.Core;
|
||||
using ReactNative.Shell;
|
||||
using ReactNativeVideo; // <-- Add this
|
||||
using System.Collections.Generic;
|
||||
...
|
||||
|
||||
public override List<IReactPackage> Packages
|
||||
{
|
||||
get
|
||||
{
|
||||
return new List<IReactPackage>
|
||||
{
|
||||
new MainReactPackage(),
|
||||
new ReactVideoPackage(), // <-- Add this
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
...
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
||||
```javascript
|
||||
|
Reference in New Issue
Block a user