0

We've got an mp4 video which has no audio track in it playing as a muted background video e.g.

<Video
    style={ tailwind.style('w-full h-full absolute z-10') }
    source={ intro }
    resizeMode="cover"
    isLooping={ true }
    isMuted={ true }
    shouldPlay={ true }
/>

However when a user opens the app, sees this page and they have background music, e.g. spotify, youtube, etc running it pauses their music. How can we set this so it completely ignores audio from within this video preventing any conflicts?

We're using a managed expo workflow v47, expo-av v13 and react-native v0.70

Please advise

P.s. We have other audio in the app that the user explicitly clicks that we do want audio interruption on.

owenmelbz
  • 6,180
  • 16
  • 63
  • 113

1 Answers1

1

For this you will have to use Expo AV documentation for MixWithOthers api.

For example you can add the following configuration before the video component.

import { Video, InterruptionModeAndroid, InterruptionModeIOS, Audio } from 'expo-av';

Audio.setAudioModeAsync({
  playsInSilentModeIOS: true,
  allowsRecordingIOS: false,
  interruptionModeIOS: InterruptionModeIOS.MixWithOthers,
  interruptionModeAndroid: InterruptionModeAndroid.DuckOthers,
  shouldDuckAndroid: true,
  staysActiveInBackground: false,
});

This code sets the audio mode to allow audio to play in the background while other audio is playing. The InterruptionModeIOS.MixWithOthers and InterruptionModeAndroid.DuckOthers options ensure that audio from your app is not completely silenced, but instead is "ducked" or lowered in volume.

Hillkim Henry
  • 2,841
  • 13
  • 17
  • Thanks for this, will take a look shortly! – owenmelbz Mar 15 '23 at 10:34
  • Hi, have you any more examples or information regarding what we should be setting this to to allow a muted video not to affect the user? Currently we're getting strange behaviours when the app is minimised, it pauses the users background music – owenmelbz Apr 23 '23 at 21:21