Android Controls Disappear. Potential Memory Issue?

[AndresTIY]

Description

1. Sample code (provide repo url or sample code)

So I'm using this library along with react-native-video. I want to be able to control video playback with these lock screen controls. So far, this works as intended on iOS. Android has an issue where the controls seem to disappear after a couple of minutes of playback. Sometimes the controls will come up again but will not be updated with the play state, duration, or artwork.

I believe my issue is related to https://github.com/tanguyantoine/react-native-music-control/issues/45 . When I see the error in Android Studio LogCat, some of the lines I see contain this onTrimMemory message and as soon the controls vanish, it looks like the memory is being cleaned up. Has there been a solution for this or is it because I'm using these controls for video playback which is already using up a lot of memory? Thanks!

Here's how I'm using it:

import { useEffect, useState } from 'react';
import { Platform } from 'react-native';
import MusicControl, { Command } from 'react-native-music-control';

const useLockControls = ({
  videoLoaded,
  paused,
  title,
  duration,
  currentTime,
  handlePlayback,
  skipBackward,
  thumbnail,
  rate,
}: LockControls) => {
  const [controlsEnabled, setControlsEnabled] = useState(false);
  const [triggerUpdatePlayback, setTriggerUpdatePlayback] = useState(false);
  const [preventUpdate, setPreventUpdate] = useState(true);

  useEffect(() => {
    if (!preventUpdate) {
      MusicControl.updatePlayback({
        state: paused ? MusicControl.STATE_PAUSED : MusicControl.STATE_PLAYING,
        speed: rate,
        elapsedTime: currentTime,
      });
    }

    // You don't need to call this method repeatedly to update the elapsedTime --
    // only call it when you need to update any other property.
    // https://github.com/tanguyantoine/react-native-music-control#update-playback
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [paused, rate, preventUpdate]);

  useEffect(() => {
    if (triggerUpdatePlayback) {
      MusicControl.updatePlayback({
        elapsedTime: currentTime,
      });
      setTriggerUpdatePlayback(false);
    }
  }, [triggerUpdatePlayback, currentTime]);

  useEffect(() => {
    if (videoLoaded) {
      setControlsEnabled(true);
      setPreventUpdate(false);
      MusicControl.enableControl('play', true);
      MusicControl.enableControl('pause', true);
      MusicControl.enableControl('skipBackward', true);
      MusicControl.setNowPlaying({
        title,
        artwork: thumbnail, // URL or RN's image require()
        duration,
        speed: rate,
      });
    }
    if (!videoLoaded) {
      MusicControl.resetNowPlaying();
      setPreventUpdate(true);
    }
  }, [videoLoaded, duration, title, rate, thumbnail]);

  useEffect(() => {
    MusicControl.enableBackgroundMode(true);

    Platform.OS === 'ios' && MusicControl.handleAudioInterruptions(true);

    MusicControl.on(Command.skipBackward, () => {
      skipBackward();
      setTriggerUpdatePlayback(true);
    });

    MusicControl.on(Command.play, () => {
      setTriggerUpdatePlayback(true);
      handlePlayback();
    });

    // on iOS this event will also be triggered by audio router change events
    // happening when headphones are unplugged or a bluetooth audio peripheral disconnects from the device
    MusicControl.on(Command.pause, () => {
      handlePlayback();
    });
  }, [handlePlayback, skipBackward]);

  useEffect(() => {
    return () => {
      if (controlsEnabled) {
        MusicControl.stopControl();
      }
    };
  }, [controlsEnabled]);

  return { setTriggerUpdatePlayback };
};

export default useLockControls;

2. Platform ?

   • [ ] iOS
   • [X] Android

3. Device - [ ] Simulator - [X] Real device

[flexgrip]

I think I'm seeing the exact same thing. Did you ever figure this out?

[gpawlik]

@AndresTIY ☝️ could you please update on this issue?

[AliHaidar110]

same issue but using expo-av