Media buttons in notification

[at-oliverapps]

i would like to know how to customize the notification in media 3 like shown in pictures below

Expected behavior how it was before with PlayerNotificationManager

how it is now with media3

[marcbaechinger]

PlayerNotificationManager does not work together with Android 13 out of the box. If you want to customize the notification to get a notification as above you can implement a CustomLayout that defines the custom commands that should be displayed on the mini player/media notification.

There is issue #38 that explains how a custom layout can be done that provides a notification across all API levels.

You can use DefaultMediaNotificationProvider to tune the look of the notification on API levels lower than 33 (see JavaDoc and please see #213 that is fixed on the main branch).

You may want to consult the Android 13 documentation on how custom actions are used to layout the new miniplayer.
https://developer.android.com/about/versions/13/behavior-changes-13#playback-controls

[at-oliverapps]

hello Marc thanks for reaching back to me
first 2 pics is with Media3 and below is PlayerNotificationManager
im using media3 now and I like it but I have these problems

I tried searching around and I can't seem to figure out how to make it work on my own I even looked at the documentation and in sourcecode for DefaultMediaNotificationProvider
its described how to get it appear in miniplayer but not how to make ( PREV : PLAY_PAUSE : NEXT ) appear in miniplayer below android 13

and can't figure out to replace (play next prev) icons in android 13 I know Spotify did it and it works for me below android 13
is it how it is in android 13+

[marcbaechinger]

EDIT: Since this comment was written, Media3 has introduced an API throught the media notification controller, which is now the preferred way to remove player commands for the media notification. Using a ForwardingPlayer is discouraged as it has the disadvantage to remove the command on the player level and hence for all controllers.

See also Android Media Controls.

---

Yeah, it's complicated. Please accept my apologies that this is not documented properly yet. We need to provide this asap because it is complicated. I added the documentation candidate labels to express this.

Let me try to give an overview/introduction:

1. All screenshots above are mini players based on the actions that are added to the notification. These are PendingIntent that will be sent to the service when tapped. These kind of notifications are displayed on all devices with Android 12 and earlier. They are also shown like this for apps that are running on an Android 13 device but still have the targetSdk set to below 33. I think this is the case for your app, that's why even on Android 13 it is handled like for Android 12 and before.

2. For all these cases (Android 12 and earlier and apps with targetSdk below 33), by default, the DefaultMediaNotificationProvider adds all the player commands first and then the custom layout. I think that's how you end up with this:

You can change the order of the actions by creating your own MediaNotificationProvider that is a sublcass of DefaultMediaNotifcationProvider and then override getMediaButtons(). However, there is a bug #213 that is fixed on the main branch but not yet release. This prevents you from subclassing the DefaultMediaNotificationProvider with the current released version I'm afraid.

With the fix of #213 this lets you create the notifications for API level <33 as you like I think.

3. On Android 13 and with targetSdk=33, the mini player is based on the actions and custom actions that are present in the PlaybackStateCompat of the media session as opposed to the actions of the notification. It looks like this (note the big play/pause button)

Because it is not based on the notification but on the PlaybackStateCompat the order of the elements is different. By default the custom actions are placed to the right (see the crossed arrow shuffle icon to the right which is a custom command that is added to the CustomLayout as described in #38).

It's possible to hide the skip previous and skip next button by removing the available commands Player.COMMAND_SEEK_TO_PREVIOUS and Player.COMMAND_SEEK_TO_NEXT from the player that is used when building the MediaSession in Media3:

val player =
      ExoPlayer.Builder(this)
        .setAudioAttributes(AudioAttributes.DEFAULT, /* handleAudioFocus= */ true)
        .build()

val forwardingPlayer =
      object : ForwardingPlayer(player) {
        override fun getAvailableCommands(): Player.Commands {
          return super.getAvailableCommands()
                  .buildUpon()
                  .remove(COMMAND_SEEK_TO_PREVIOUS)
                  .remove(COMMAND_SEEK_TO_NEXT)
                  .build()
        }
      }
MediaSession.Builder(context, forwardingPlayer)
    .build()

Now, the skip previous and the skip next button would not be displayed in the mini player. Instead the custom actions are placed at these positions. So in the screenshot above the shuffle icon would be at the position of the skip previous button. With this we can for instance provide three custom commands in the CustomLayout like:

[[rewind 30s], [ffwd 30s], [shuffle]]

Now, the rewind 30s is to the left of the seek bar, ffwd 30s is to the right of the seekbar, and all the other custom commands follow to the right.

EDIT: I don't think this last section is correct, sorry. This is currently not supported with Media3

However, some apps probably do not want that. So we can advice the mini player to simply space out the skip to previous/skip to next buttons and leave them empty, and put the custom command as the are in the screenshot above (usually only one is displayed). To signal this an app needs to set some session extras right after building the session:

val sessionExtras = Bundle()
sessionExtras.putBoolean(MediaConstants.EXTRAS_KEY_SLOT_RESERVATION_SEEK_TO_PREV, true);
sessionExtras.putBoolean(MediaConstants.EXTRAS_KEY_SLOT_RESERVATION_SEEK_TO_NEXT, true);
mediaSession.setSessionExtras(sessionExtras)

[PaulWoitaschek]

I'm also having a really hard time figuring this out.
I'm developing an audiobook player so the hard fast forward / rewind do not make sense at all.

However I still need them to be supported because if for example a user presses next / previous through a bluetooth headset gesture I need to handle that as a fast forward / rewind instead.

I achieved that by overwriting the commands in my wrapping player:

  override fun seekToPreviousMediaItem() {
    seekBack()
  }

  override fun seekToPrevious() {
    seekBack()
  }

  override fun seekToNext() {
    seekForward()
  }

  override fun seekToNextMediaItem() {
    seekForward()
  }

Setting EXTRAS_KEY_SLOT_RESERVATION_SEEK_TO_PREV does / NEXT does not seem to have any effect.

Right now I could get two things to work:

1. Advertise the default commands and overwriting their actions. This has the disadvantage that in the Android 13 Notification, the previous / next icons are shown instead of the fast forward / rewind icons.
2. Remove the next / previous from the available commands. This leads to my custom fast forward / rewind being shown. So from the UI everything is perfect. This however now breaks the ability to control the fast forward / rewind using bluetooth headset taps.

Is there any way to fix this?

[maknon]

val player =
      ExoPlayer.Builder(this)
        .setAudioAttributes(AudioAttributes.DEFAULT, /* handleAudioFocus= */ true)
        .build()

val forwardingPlayer =
      object : ForwardingPlayer(player) {
        override fun getAvailableCommands(): Player.Commands {
          return super.getAvailableCommands()
                  .buildUpon()
                  .remove(COMMAND_SEEK_TO_PREVIOUS)
                  .remove(COMMAND_SEEK_TO_NEXT)
                  .build()
        }
      }
MediaSession.Builder(context, forwardingPlayer)
    .build()

Now, the skip previous and the skip next button would not be displayed in the mini player

if i have more than one MediaItem, the button is displayed but do nothing if clicked when trying to use this code. is this a bug or an intended behavior ?

[brabebhin]

I managed to obtain the first expected screenshot by using this media notification builder implementation. My aim was to have all 3 buttons (skip previous, play/pause, skip next) shown in compact mode on both android 12 and 13, as shown in the first screenshot

My guess is that further customization can be done with addNotificationActions. Maybe this can further help people who also run into this issue.

class MediaNotificationBuilder(val context: Context) : DefaultMediaNotificationProvider(context) {

override fun addNotificationActions(
    mediaSession: MediaSession,
    mediaButtons: MutableList<CommandButton>,
    builder: NotificationCompat.Builder,
    actionFactory: MediaNotification.ActionFactory
): IntArray {

    val skipPreviousCommandButton = CommandButton.Builder().setPlayerCommand(COMMAND_SEEK_TO_PREVIOUS).setEnabled(true).setIconResId(androidx.media3.ui.R.drawable.exo_ic_skip_previous)
        .setExtras(Bundle().apply { putInt("androidx.media3.session.command.COMPACT_VIEW_INDEX", 0)}).build();

    val playCommandButton = CommandButton.Builder().setPlayerCommand(COMMAND_PLAY_PAUSE).setEnabled(true).setIconResId(if(mediaSession.player.isPlaying) androidx.media3.ui.R.drawable.exo_icon_pause else androidx.media3.ui.R.drawable.exo_icon_play)
        .setExtras(Bundle().apply { putInt("androidx.media3.session.command.COMPACT_VIEW_INDEX", 1)}).build();

    val skipNextCommandButton = CommandButton.Builder().setPlayerCommand(COMMAND_SEEK_TO_NEXT).setEnabled(true).setIconResId(androidx.media3.ui.R.drawable.exo_ic_skip_next)
        .setExtras(Bundle().apply { putInt("androidx.media3.session.command.COMPACT_VIEW_INDEX", 2)}).build();

    mediaButtons.clear()
    mediaButtons.add(skipPreviousCommandButton)
    mediaButtons.add(playCommandButton)
    mediaButtons.add(skipNextCommandButton)

    return super.addNotificationActions(mediaSession, mediaButtons, builder, actionFactory)
}

}

[marcbaechinger]

Thanks for the snippet @brabebhin

If you override DefaultMediaNotificationProvider.getMediaButtons(...) and then return that list of buttons that you create above, would that be the same? The list would then be the argument mediaButtons in addNotificationActions(...). That's how the API was designed. Sorry for this not being documented yet besides the JavaDoc. Documentation work has been started and is on it's way.

[brabebhin]

This is for beta2. In beta3 it is no longer possible to derive DefaultMediaNotificationProvider, as I just tried right now.

The problem with getMediaButtons (assuming the inability to override is another bug) is that you can't get to know which is the playback state of the player. You could theoretically pass the player instance to the constructor of the provider, but that is also ugly.

And since addNotificationActions allow you to override that list that you get as parameter, this is how I got it to work properly. In fact, I could simply create a new list there with the buttons and add them to the new list instead of using the one passed as parameter, but I was too lazy to do it.

My sugestions:

Pass the session instance that you get in addNotificationActions to getMediaButtons as well. This allows access to the player instance and allows better customization.
Make DefaultMediaNotificationProvider constructors public again, to allow overriding.
Make the list of media actions that you get in addNotificationActios immutable, to clarify the usage of the API.

You should regard documentation as an overhead. Make the API more intuitive by using the tools available to simply guide developers on the right path.
E.G. Documentation says the constructor is public, but in reality it is not.

[marcbaechinger]

Yes, sorry, my bad. The public constructors are already added in the main branch and this will be part of the next release that we are currently preparing (see #213).

I mark this issue as a bug to add the session like for addNotificationActions(..).