Integrating the plugin for Apple and Android
Setting up a new project
Unless you have react-native installed globally, NAGRA recommends you use npx
to run react-native.
npx react-native init basicPlaybackApp [email protected]
For tvOS support use [email protected]_
, otherwise use [email protected]_
.
For generating a project with typescript templating (and compatible version of React Native) use _---template [email protected]_
See also https://reactnative.dev/docs/environment-setup for details of how to set up a React Native project.
Adding dependencies
To add the plug-in as a dependency to an existing project:
- Extract the plug-in from the opy-react-native-<version>-react-otvplayer.zip file.
Add the extracted plug-in as a dependency in the project folder.
CODEyarn add file:/path/to/plug-in/folder
Apple iOS/tvOS
For Apple iOS/tvOS, take the following extra steps:
- Open the basicPlaybackApp/ios/Podfile, change the platform :ios, '10.0' to "platform :ios, '12.0'.
Add React-otvplayer into <project_folder>/ios/Podfile for both iOS and tvOS.
RUBYconfig = use_native_modules! # Add react-otvplayer podspec here: pod 'React-otvplayer', :path => '../node_modules/@nagra/react-otvplayer/React-otvplayer.podspec' , :modular_headers => true use_react_native!( ...
- Run pod install:
- cd basicPlaybackApp/ios pod install
- Open <project_folder> /ios/<project>.xcworkspace
- Select the build TARGET and change the Signing & Capabilities with your Team and Bundle Identifier.
- Build and deploy the iOS or tvOS Target and run the app on your device.
Android
For Android, include the following extra steps:
Open <project_folder>/android/build.gradle, and change the'minSdkVersion' to 21.
CODEbuildscript { ext { ... minSdkVersion = 21 ...
- Before building for Android, define your Android SDK path by:
- Setting ANDROID_SDK_ROOT in your environment, or
- Adding sdk.dir path in your project's local properties file at <project_folder>/android/local.properties.
- Build and run the Android app on your device using
yarn android
.
Additional Help
Missing Android SDK errors
Ensure that the local.properties file which contains Android SDK install path exists in the Android path of the React plugin.
Android manifest collided
If your application uses Android Gradle plugin version 3.6.0 or higher, it may encounter the error: "Entry name 'AndroidManifest.xml' collided" when building the application. The application can work around this issue by adding the following into the <project_folder>/android/app/build.gradle file:
packagingOptions {
exclude 'AndroidManifest.xml'
}