Audio Mix-up issue with react-native-video - Need to Stop External Sounds on Android

Question

I have implemented a VideoPlayer in my React Native application using the [email protected] package. My videos play seamlessly, but on Android devices, when other sounds like Spotify or YTMusic are active, the audio from my VideoPlayer mixes with these sounds.

The problem is that I want to stop other sounds when my VideoPlayer is active because the mixed audio makes the VideoPlayer's sound unintelligible. I've tried various properties of the react-native-video package such as disableFocus, allowsExternalPlayback, ignoreSilentSwitch, etc., but none of the combinations have been effective.

Here is a snippet of my code:

import Video from 'react-native-video'


const Player = ({ url, goBack, videoPlayerStyle, item, rewindDisable, rewindOffTimeout }) => {


...

 const onEnd = () => {
        setPlayerState(PLAYER_STATES.ENDED);
        setPaused(true);
        setIsCloseDisable(false);
        if (item) {
            AsyncStorage.setItem('WatchedAndWon', item.Id.toString());
            goBack();
        }
    };

const onLoad = (data) => {
        if(timer2.current) {
            clearTimeout(timer2.current);
        }
        setDuration(data.duration);
        setLoading(false);
        if(rewindOffTimeout){
            setIsCloseDisable(true);
            timer.current = setTimeout(() => {
              setRewindOff(false);
              setIsCloseDisable(false);
            }, rewindOffTimeout*1000);
        }
    };

const onLoadStart = () => {
        setLoading(true);
        timer2.current = setTimeout(() => {
            if(!timer.current){
                setIsCloseDisable(false);
            }
        }, 5000);
    };

const onProgress = (data) => {
        if (!loading) {
            setCurrentTime(data.currentTime)
        }
    };

    const onPaused = (playerState) => {
        if(playerState != undefined){
            setPaused(!!playerState);
            setPlayerState(playerState);
            return;
        }
        setPaused(!paused);
        setPlayerState(!paused ? PLAYER_STATES.PAUSED : PLAYER_STATES.PLAYING)
    };

 const onDrag = (value) => {
        if(rewindOff) return;
        setCurrentTime(value);
        if (playerState === PLAYER_STATES.PAUSED) {
            return;
        }else if(playerState === PLAYER_STATES.ENDED){
            onPaused(PLAYER_STATES.PAUSED);
            return;
        }
        onPaused();
    };

    const onSeek = (value) => {
        if(rewindOff) return;
        videoPlayer.current.seek(value);
        onPaused();
    };

    const onReplay = () => {
        videoPlayer.current.seek(0);
        setCurrentTime(0);
        onPaused(PLAYER_STATES.PLAYING)
    };


...



return (

...

  <Video
                ref={(ref) => (videoPlayer.current = ref)}
                source={url}
                onEnd={onEnd}
                onLoad={onLoad}
                onLoadStart={onLoadStart}
                onProgress={onProgress}
                paused={paused}
                resizeMode={screenType}
                style={[styles.videoPlayerStyle ,videoPlayerStyle, { flex: loading ? undefined : 1 }]}
                onError={onError}
                rate={playerSpeed}
                muted={muted}

            />

... 
)

}

I've experimented with different properties of the react-native-video package, such as setting disableFocus={false}, allowsExternalPlayback={false}, and ignoreSilentSwitch={ignore}, but unfortunately, I haven't achieved the desired result.