feat: move docs to github pages (#3296 )

* feat(docs): setup nextra

* feat(docs): add pages

* docs: update introduction page

* docs: fix typos

* docs: fix links

* docs: update README

* docs: sync with master

* docs: remove old docs

* fix(ci/docs): fix typos

* fix(ci/docs): fix docs setup

* fix(docs): update next config

* chore(ci/docs): clean up

* chore(docs): add meta tags

* chore: apply review changes

* docs: move drm into api section

* docs: fix next config

* docs: fix links

* docs: add methods section

* chore: sync with main

* docs: add missing onAudio events

2023-10-26 08:54:14 +02:00

3.5 KiB

Raw Blame History

Miscellaneous

iOS App Transport Security

By default, iOS will only load encrypted (https) urls. If you want to load content from an unencrypted (http) source, you will need to modify your Info.plist file and add the following entry:

For more detailed info check this article

Audio Mixing

At some point in the future, react-native-video will include an Audio Manager for configuring how videos mix with other apps playing sounds on the device.

On iOS, if you would like to allow other apps to play music over your video component, make the following change:

AppDelegate.m

#import <AVFoundation/AVFoundation.h>  // import

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  ...
  [[AVAudioSession sharedInstance] setCategory:AVAudioSessionCategoryAmbient error:nil];  // allow
  ...
}

You can also use the ignoreSilentSwitch prop.

Android Expansion File Usage

Expansions files allow you to ship assets that exceed the 100MB apk size limit and don't need to be updated each time you push an app update.

This only supports mp4 files and they must not be compressed. Example command line for preventing compression:

zip -r -n .mp4 *.mp4 player.video.example.com

// Within your render function, assuming you have a file called
// "background.mp4" in your expansion file. Just add your main and (if applicable) patch version
<Video source={{uri: "background", mainVer: 1, patchVer: 0}} // Looks for .mp4 file (background.mp4) in the given expansion version.
       resizeMode="cover"           // Fill the whole screen at aspect ratio.
       style={styles.backgroundVideo} />

Load files with the RN Asset System

The asset system introduced in RN 0.14 allows loading image resources shared across iOS and Android without touching native code. As of RN 0.31 the same is true of mp4 video assets for Android. As of RN 0.33 iOS is also supported. Requires react-native-video@0.9.0.

<Video
  source={require('../assets/video/turntable.mp4')}
/>

Play in background on iOS

To enable audio to play in background on iOS the audio session needs to be set to AVAudioSessionCategoryPlayback. See [Apple documentation][3] for additional details. (NOTE: there is now a ticket to expose this as a prop )

Examples

See an [Example integration][1] in react-native-login note that this example uses an older version of this library, before we used export default -- if you use require you will need to do require('react-native-video').default as per instructions above.

Try the included [VideoPlayer example][2] yourself:

git clone git@github.com:react-native-community/react-native-video.git
cd react-native-video/example
npm install
open ios/VideoPlayer.xcodeproj

Then Cmd+R to start the React Packager, build and run the project in the simulator.

Lumpen Radio contains another example integration using local files and full screen background video.

3.5 KiB Raw Blame History