The media controls notification is rendered completely different on different devices. On some devices I get these good looking controls with the artwork as background. But sometimes I get a notification with only three controls that looks not very good:
Is it somehow possible to avoid this notification style and get a consistent look for all Android devices?
Sample code (provide repo url or sample code)
import { compose } from 'ramda';
import React, { useEffect } from 'react';
import MusicControl, { Command } from 'react-native-music-control';
import { connect } from 'react-redux';
import { configure } from '../../config/configure';
import {
getCurrentCourse,
getCurrentLesson,
getNextLesson,
getPreviousLesson,
setCurrentLesson,
} from '../../features/player/player-reducer';
<!-- replace the balnk space within backets by a x so that it checks the box ;-) -->
2. Platform ?
- [ ] iOS
- [x] Android
<!-- same here -->
3. Device
- [ ] Simulator
- [x] Real device
Description
The media controls notification is rendered completely different on different devices. On some devices I get these good looking controls with the artwork as background. But sometimes I get a notification with only three controls that looks not very good:
Is it somehow possible to avoid this notification style and get a consistent look for all Android devices?
import { configure } from '../../config/configure'; import { getCurrentCourse, getCurrentLesson, getNextLesson, getPreviousLesson, setCurrentLesson, } from '../../features/player/player-reducer';
const get = configure();
const mapStateToProps = state => ({ nextLesson: getNextLesson(state), previousLesson: getPreviousLesson(state), currentLesson: getCurrentLesson(state), currentCourse: getCurrentCourse(state), });
export default compose(connect(mapStateToProps, { setCurrentLesson }))( ({ onPlay, onPause, onSeekForward, onSeekBackward, nextLesson, previousLesson, currentLesson, setCurrentLesson, currentCourse, }) => { useEffect(() => { MusicControl.setNowPlaying({ title: currentLesson.title, artwork: get('REMOTE_IMAGE')(currentCourse.artwork), }); }, [currentLesson, currentCourse]);
} );