react-native-track-player 通知区域播放器 UI答案

【问题标题】：react-native-track-player Notification area player UIreact-native-track-player 通知区域播放器 UI
【发布时间】：2018-07-09 05:41:33
【问题描述】：

三星默认大小的通知播放器

三星最大尺寸的通知播放器

react-native-track-player 默认播放器通知播放器 UI

react-native-track-player 最大化播放器通知播放器 UI

我想要react-native-track-player 默认播放器通知播放器 UI 看起来像三星的。我的意思是播放、暂停、停止按钮也应该在那里..

【问题讨论】：

标签： android react-native notifications react-native-track-player

【解决方案1】：

对于最大化通知播放器 UI，请使用 capabilities 和对于紧凑型通知播放器 UI，请使用 compactCapabilities 如下：

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} />;
  }
}

【讨论】：