BackgroundAudioManager.offNext

backgroundAudioManager.offNext(callback)

<!-- index.ttml -->
<view class="container">
  <view class="body body-bg">
    <view class="page-section page-section-space">
      <view class="page-body-buttons">
        <block tt:if="{{playing === true}}">
          <view class="page-body-button" bindtap="stop">
            <image src="{{imageUrl+'stop.png'}}" />
          </view>
          <view class="page-body-button" bindtap="pause">
            <image src="{{imageUrl+'pause.png'}}" />
          </view>
        </block>
        <block tt:if="{{playing === false}}">
          <view class="page-body-button" />
          <view class="page-body-button" bindtap="play">
            <image src="{{imageUrl+'play.png'}}" />
          </view>
        </block>
        <view class="page-body-button" />
      </view>
      <view class="page-section-title page-section-title-space">
        已监听用户在系统音乐播放面板点击下一曲事件
        <view> 提示: 暂仅支持iOS </view>
      </view>
    </view>
    <button class="off-next-btn" type="primary" bindtap="offNext">
      offNext
    </button>
  </view>
</view>

// index.js
const musicUrls = [
  "https://sf1-ttcdn-tos.pstatp.com/obj/developer/sdk/0000-0002.mp3",
  "https://sf1-ttcdn-tos.pstatp.com/obj/developer/sdk/0000-0001.mp3",
  "https://sf1-ttcdn-tos.pstatp.com/obj/developer/sdk/0000-0003.mp3",
];

const app = getApp();
Page({
  data: {
    imageUrl: app.globalData.imageUrl,
    playing: false,
    paused: false,
    curSrcIdx: 1,
  },
  onNextCallback: null,
  onLoad() {
    this.backgroundAudioManager = tt.getBackgroundAudioManager();
    const bgam = this.backgroundAudioManager;
    this.canUpdateUI = true;
    bgam.startTime = 0;
    bgam.title = "测试背景音乐";
    bgam.audioPage = { path: "pages/API/BackgroundAudioManager.play" };
    bgam.onPlay(() => {
      this.updateUI();
    });
    bgam.onPause(() => {
      this.updateUI();
    });
    bgam.onStop(() => {
      this.updateUI();
    });
    bgam.onEnded(() => {
      this.updateUI();
    });
    this.onNextCallback = () => {
      console.log("onNext");
      const { curSrcIdx } = this.data;
      this.setData(
        {
          curSrcIdx: curSrcIdx >= musicUrls.length ? 0 : curSrcIdx + 1,
        },
        () => {
          this.backgroundAudioManager.src = musicUrls[this.data.curSrcIdx];
          this.updateUI();
        }
      );
    };
    bgam.onNext(this.onNextCallback);
  },
  updateUI() {
    const bgam = this.backgroundAudioManager;
    if (this.canUpdateUI) {
      this.setData({
        playing: !bgam.paused,
      });
    }
  },
  pause() {
    this.backgroundAudioManager.pause();
    this.updateUI();
  },
  play() {
    if (!this.backgroundAudioManager.src) {
      this.backgroundAudioManager.src = musicUrls[this.data.curSrcIdx];
    }
    this.backgroundAudioManager.play();
    this.updateUI();
  },
  stop() {
    this.backgroundAudioManager.stop();
    this.updateUI();
  },
  offNext() {
    if (this.onNextCallback) {
      this.backgroundAudioManager.offNext(this.onNextCallback);
      this.onNextCallback = null;
      tt.showToast({
        title: "offNext",
        icon: "none",
      });
    }
  },
});

/* index.ttss */
.body-bg {
  border-radius: 18rpx;
  background: #8c8c8c;
  overflow: hidden;
}

image {
  width: 150rpx;
  height: 150rpx;
}

.page-body-buttons {
  display: flex;
  justify-content: space-around;
  margin: 50rpx 0;
}

.page-body-button {
  width: 250rpx;
  text-align: center;
}

.page-section {
  overflow: hidden;
  margin-bottom: 0;
}

.page-section-title-space {
  color: #eee;
}