react-native-simple-player

A simple audio player for React Native applications. Currently supports only Android.

---

Features

• Load sounds from local directories
• Play/Pause/Seek
• Prevention of loud music
• Fully Customizable

Getting started

$ npm install react-native-simple-player --save

Mostly automatic installation

$ react-native link react-native-simple-player

Manual installation

Android

1. Open up android/app/src/main/java/[...]/MainActivity.java

• Add import com.reactlibrary.RNSimplePlayerPackage; to the imports at the top of the file
• Add new RNSimplePlayerPackage() to the list returned by the getPackages() method

2. Append the following lines to android/settings.gradle:

   include ':react-native-simple-player'
   project(':react-native-simple-player').projectDir = new File(rootProject.projectDir, 	'../node_modules/react-native-simple-player/android')
   

3. Insert the following lines inside the dependencies block in android/app/build.gradle:

     implementation project(':react-native-simple-player')
   

Grant Access Permission for

Android 5.0 If you're going to access external storage (say, SD card storage) for Android 5.0 (or lower) devices, you might have to add the following line to AndroidManifest.xml.

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.rnfetchblobtest"
    android:versionCode="1"
    android:versionName="1.0">      

+   <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />   
    ...

Android 6.0+

Beginning in Android 6.0 (API level 23), users grant permissions to apps while the app is running, not when they install the app. So adding permissions in AndroidManifest.xml won't work for Android 6.0+ devices. To grant permissions in runtime, you might use PermissionAndroid API.

iOS & Windows are not supported yet

Usage

The library exposes a SimplePlayer component which is responsible for playback. Now, it only supports loading of sounds from local directories.

import { SimplePlayer } from 'react-native-simple-player';

<SimplePlayer />

Props

• filePath - the full path to an audio file
• onFileNotFound - a callback function when the file is not found
• style - (optional) a style object for the player
• preventLoudMusic - (optional) whether to prevent playing of loud music or not (true/false)
• preventLoudMusicAlert - (optional) an object representing title, message and button texts in the loud music alert

Style

• backgroundColor - color of the player's background (default #FFF)
• textColor - color of the minutes (default #000)
• iconColor - color of the play icon (default #000)
• iconSize - size of the play icon (default #000)
• sliderMinTrackColor - the color used for the track to the left of the button (default #000)
• sliderThumbColor - color of the foreground switch grip (default #000)
• sliderMaxTrackColor - the color used for the track to the right of the button (default #000)

'preventLoudMusicAlert'

• title - text of the title
• message - text of the message
• buttonText - text of the button