1

SAMSUNG's Notification Player At Default Size

Samsung Default Player Notification Player UI

SAMSUNG's Notification Player At Maximized Size

Samsung Maximize Player Notification Player UI

react-native-track-player Default Player Notification Player UI

<code>react-native-track-player</code> Default Player Notification Player UI

react-native-track-player Maximize Player Notification Player UI

<code>react-native-track-player</code> Maximize Player Notification Player UI

I want react-native-track-player Default Player Notification Player UI Look Like Samsung ones.I mean Play,Pause,Stop button should be there too..

AmerllicA
  • 29,059
  • 15
  • 130
  • 154
Imran Noor
  • 491
  • 2
  • 7
  • 22

1 Answers1

3

For Maximized Notification Player UI use capabilities and For compact Notification Player UI use compactCapabilities as follow:

import TrackPlayer from "react-native-track-player";
export default class Screen1 extends React.Component {
  constructor(props) {
    super(props);
  }
  componentWillMount() {
    TrackPlayer.setupPlayer().then(async () => {
      // Adds a track to the queue
      await TrackPlayer.add({
        id: "123",
        url:"https://raw.githubusercontent.com/zmxv/react-native-sound-demo/master/advertising.mp3",
        title: "Track Title",
        artist: "Track Artist",
        artwork:"https://socialecologies.files.wordpress.com/2015/10/a_monk.jpg"
      });
      TrackPlayer.updateOptions({
        capabilities: [
          TrackPlayer.CAPABILITY_PLAY,
          TrackPlayer.CAPABILITY_PAUSE,
          TrackPlayer.CAPABILITY_STOP
        ],
        compactCapabilities: [
          TrackPlayer.CAPABILITY_PLAY,
          TrackPlayer.CAPABILITY_PAUSE,
          TrackPlayer.CAPABILITY_STOP
        ]
      });
      // Starts playing it
      TrackPlayer.play();
    });
  }
  render() {
    return <View style={Styler.container} />;
  }
}
Imran Noor
  • 491
  • 2
  • 7
  • 22