I'm building an audio player as a mobile app using React Native and aiming to achieve perfect transition i.e audio to next audio without any silence, when looping. There's a heart beat, half second skip in between each song and when looping any given song that there's no sound.
Currently using Expo Audio player: https://docs.expo.dev/versions/latest/sdk/audio/ Also tried: https://www.npmjs.com/package/react-native-vlc-media-player
My Audioprovider.js where the logic is located looks like this:
onPlaybackStatusUpdate = async playbackStatus => {
if (playbackStatus.isLoaded && playbackStatus.isPlaying) {
this.updateState(this, {
playbackPosition: playbackStatus.positionMillis,
playbackDuration: playbackStatus.durationMillis,
});
}
if (playbackStatus.isLoaded && !playbackStatus.isPlaying) {
storeAudioForNextOpening(
this.state.currentAudio,
this.state.currentAudioIndex,
playbackStatus.positionMillis
);
}
let durationSeconds = playbackStatus.durationMillis/1000;
let positionSeconds = playbackStatus.positionMillis/1000;
if (playbackStatus.didJustFinish || (parseInt(durationSeconds)-2 === parseInt(positionSeconds))) {
if (this.state.isPlayListRunning) {
let audio;
const indexOnPlayList = this.state.activePlayList.audios.findIndex(
({ id }) => id === this.state.currentAudio.id
);
const nextIndex = this.state.isLoop ? indexOnPlayList : indexOnPlayList + 1;
audio = this.state.activePlayList.audios[nextIndex];
if (!audio) audio = this.state.activePlayList.audios[0];
const indexOnAllList = this.state.audioFiles.findIndex(
({ id }) => id === audio.id
);
const status = await playNext(this.state.playbackObj, audio.url);
return this.updateState(this, {
soundObj: status,
isPlaying: true,
currentAudio: audio,
currentAudioIndex: indexOnAllList,
});
}
Any ideas? Is it even possible?