kyo504 / react-native-audio-streaming-player Goto Github PK

How to fix this?

RN: 0.57.7
OS: macOS Mojave

1: in IOS, it can not find Player object when you import it, if I want to use play() function, it is undefined.
2: building the android crashes, saying
RNAudioPlayer/AudioPlayerService.java:172: error: cannot find symbol MediaButtonReceiver.handleIntent(mMediaSession, startIntent);

*** Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: 'image must be non-nil' in IOS Device.
*** First throw call stack:

I have this audio player up and running on streaming audio but for some reason the audio stops playing when the application goes into the background. Am I supposed to do something to enabled that functionality?

@kyo504 , is this library still working?
It has so many issues open and none closed ... Did you recommend me to use this one?

We are using the plugin to play an Icecast audio stream on iOS. Unfortunately stop as well as pause action doesn't stop the playback properly. It just restarts audio from the buffer (starting from the same point where the listener has tuned in). Please find the relevant part of our code starting and stopping the playback...

  playerAction(action, url) {
    if (!this.locked) {
      this.locked = true;
      if (action === 'play' && url && url !== null) {
        this.url = url.replace('https', 'http');
        const genre = url.split('http://')[1].split('.')[0];
        this.title = `${genre.charAt(0).toUpperCase()}${genre.slice(1)}`;
        console.log(`Title: ${this.title}`);
        console.log(`Play URL: ${this.url}`);
        this.onPlay();
      } else if (action === 'pause') {
        console.log('pause');
        this.onPause();
      }  else if (action === 'stop') {
        console.log('stop');
        this.onPause(); // Player.stop is very unstable...
      }
      var self = this;
      setTimeout(() => {
        self.locked = false;
        console.log('Unlocking...');
      }, 500);
    }
  }

on back-end side what does represent for, i have put piano.wav in storage folder, but when i pass 'http://192.168.88.225/storage/piano2.wav' it returns an error:
undefiend is not an object (evaluating: '_reactNativeStreamingAudioPlayer2.default.play')

i used:

onPlay() {
Player.play("http://192.168.88.225/storage/piano2.wav", {
title: 'asd',
artist: 'asd',
album_art_uri: 'asd',
})
}

Hi Hunkyo,

I am using this package for one mobile app I am making and I am wondering if you are going to add more functionalities to this package like getDuration, read from local files for network exceptions, skipping 10sec, etc.

I already updated RNAudioPlayer file to read local files with specific key sent to it but I think it would be better if this package gets more updates as it is excellent one compared to the other RN libs/packages.

is there a way to load my streaming URL fast ?

the player take 30 sec to load my streaming URL to listen the song.

Example app does not work in android. AudioPlayerService:47 is never called when play button is clicked.

Has this lib hls support?

help if you can

`import React from 'react'
import {Dimensions,View,ImageBackground, DeviceEventEmitter,TouchableOpacity,Image} from "react-native"
import { Transition } from "react-navigation-fluid-transitions"
import LinearGradient from 'react-native-linear-gradient';
import PlayBar from "./music/play"
import Entypo from "react-native-vector-icons/Entypo"

import { Slider } from 'react-native-elements'
import * as Animatable from 'react-native-animatable';
import Player from 'react-native-audio-streaming-player';

export default class MusicPage extends React.Component {

constructor(props) {
super(props)
this.state = {
maxValue:0,
currentValue:0,
isPlaying:false,

}

Player.play("https://archive.org/download/testmp3testfile/mpthreetest.mp3", {
title: "test",
artist: "test",
album_art_uri: "https://i.ytimg.com/vi/y90yaLFoYoA/maxresdefault.jpg",
});

this.onPlaybackActionChanged = this.onPlaybackActionChanged.bind(this);
this.onPlaybackPositionUpdated = this.onPlaybackPositionUpdated.bind(this);
this.onPlaybackStateChanged = this.onPlaybackStateChanged.bind(this);

}

componentDidMount() {
DeviceEventEmitter.addListener('onPlaybackPositionUpdated', this.onPlaybackPositionUpdated);
DeviceEventEmitter.addListener('onPlaybackStateChanged', this.onPlaybackStateChanged);
DeviceEventEmitter.addListener('onPlaybackActionChanged', this.onPlaybackActionChanged);
}
onPlaybackPositionUpdated(event) {
console.log('Current position: ' + event.currentPosition);

if (this.state.status === 'PLAYING') {
if (!this.dragging) {
this.setState({
currentTime: parseInt(event.currentPosition), // convert milisecond to second
});
}
}
}

onPlaybackActionChanged(event) {
console.log('Current Action: ' + event.action);
}

onPlaybackStateChanged(event) {
console.log('PlaybackState: ' + event.state);
this.setState({ status: event.state });
}

render() {

return (
   <View style={{flex:1,backgroundColor:'#000'}}>
<ImageBackground blurRadius={15} style={{flex:1}} source={{uri:this.props.navigation.state.params.url}}>
<TouchableOpacity onPress={()=> {this.props.navigation.pop()}}style={{marginTop:20,marginLeft:20,width:40,height:40,borderRadius:20,backgroundColor:"rgba(0,0,0,0.5)",justifyContent:"center",alignItems:"center"}}>
  <Entypo size={20}  color="#FFF" name="chevron-thin-down" />
  </TouchableOpacity>
  
  
  
   <View style={{flex:1,alignItems:"center",justifyContent:"center"}}>
   
   {
     
     this.state.isPlaying?(
            <Transition shared="img" >

    <Animatable.Image animation="pulse" easing="ease-in-out"  useNativeDriver={true} duration={300} iterationCount="infinite" style={{ width:Dimensions.get("window").width/2,height:Dimensions.get("window").width/2,borderRadius:Dimensions.get("window").width/4}} source={{uri:this.props.navigation.state.params.url}}/>

  </Transition>
       ):(
              <Transition shared="img" >

    <Image  style={{ width:Dimensions.get("window").width/2,height:Dimensions.get("window").width/2,borderRadius:Dimensions.get("window").width/4}} source={{uri:this.props.navigation.state.params.url}}/>

  </Transition>
         
         )
     
   }


  
  
    </View>

     <View style={{flex:0.5}}>
    <LinearGradient colors={['transparent',"#000000"]} style={{flex:1}}> 
        <View style={{flex:1,justifyContent:"center"}}>
        <View style={{flexDirection:"row",justifyContent:"center"}}>
          <Slider maximumValue={this.state.maxValue} animateTransitions={true}  value={this.state.currentValue} style={{width:Dimensions.get("window").width-50}} minimumTrackTintColor="#FFF" maximumTrackTintColor="#6A6D70"  
         />
 
        </View>
          <View style={{height:100}}>
             <PlayBar onPlay={() => soundObject.playAsync() } onPause={() => soundObject.pauseAsync()} isPlaying={this.state.isPlaying}/>
          </View>
           
        </View>
        </LinearGradient>  
    </View>
   
    
   </ImageBackground>
     
   
    
   </View>
  )

}
}
`