快应用

Appearance

AudioPlayer ​

集成 ​

package.json引入库 ​

点击查看源码
js
"@extscreen/es-audio-player": "^x.x.x"

初始化 ​

点击查看源码
vue
ESAudioPlayerModule.init();

播放 ​

点击查看源码
vue
let url = "http://qcloudimg-moss.cp47.ott.cibntv.net/channelzero/video/music/500years.mp3"
ESAudioPlayerModule.play(url);

开始 ​

点击查看源码
vue
ESAudioPlayerModule.start();

暂停 ​

点击查看源码
vue
ESAudioPlayerModule.pause();

停止 ​

点击查看源码
vue
ESAudioPlayerModule.stop();

释放资源 ​

点击查看源码
vue
ESAudioPlayerModule.release();

快进 ​

点击查看源码
vue
ESAudioPlayerModule.seekTo(2000);

设置倍速播放 ​

点击查看源码
vue
ESAudioPlayerModule.setPlayRate(2);

监听音频播放状态 ​

点击查看源码
vue
export default {
  mixins: [ESAudioPlayerMixin],
  methods: {
    //播放状态变化
    onPlayerStatusChanged(event) {
      switch (event.playerStatus) {
        case ES_PLAYER_STATE_PREPARED: {
          ESAudioPlayerModule.start();
          break;
        }
        case ES_PLAYER_STATE_PAUSED: {
          break;
        }
        case ES_PLAYER_STATE_STOP: {
          break;
        }
        case ES_PLAYER_STATE_PLAYBACK_COMPLETED: {
          break;
        }
        case ES_PLAYER_STATE_ERROR: {
          break;
        }
        case ES_PLAYER_STATE_RESUMED: {
          break;
        }
        case ES_PLAYER_STATE_BUFFER_START: {
          break;
        }
        case ES_PLAYER_STATE_BUFFER_END: {
          break;
        }
        case ES_PLAYER_STATE_SEEK_START: {
          break;
        }
        case ES_PLAYER_STATE_SEEK_COMPLETED: {
          break;
        }
      }
    },
    //播放错误
    onPlayerError(errorCode, errorMessage) {
    },
    //播放信息
    onPlayerInfo(info) {
    },
    //播放速率变化
    onPlayRateChanged(playRate){
    },
  },
};

示例代码 ​

点击查看源码
vue
<template>
  <div class="es-sdk-root-css">
    <title class="es-sdk-content-title-css" :text="this.$options.name"/>
    <div class="es-sdk-content-divider-css"/>
    <div class="es-sdk-content-row-css">
      <text-button text="初始化" @onButtonClicked="initAudio"/>
      <text-button text="播放" @onButtonClicked="playAudio"/>
      <text-button text="开始" @onButtonClicked="startAudio"/>
      <text-button text="暂停" @onButtonClicked="pauseAudio"/>
      <text-button text="停止" @onButtonClicked="stopAudio"/>
      <text-button text="快进" @onButtonClicked="seekAudio"/>
      <text-button text="倍速" @onButtonClicked="speedAudio"/>
    </div>
  </div>
</template>

<script>
import { ESLaunchManager, ESPage } from '@extscreen/es-core';
import { ESAudioPlayerMixin, ESAudioPlayerModule } from '@extscreen/es-audio-player';
import {
  ES_PLAYER_STATE_BUFFER_END,
  ES_PLAYER_STATE_BUFFER_START,
  ES_PLAYER_STATE_ERROR,
  ES_PLAYER_STATE_PAUSED,
  ES_PLAYER_STATE_PLAYBACK_COMPLETED,
  ES_PLAYER_STATE_PREPARED,
  ES_PLAYER_STATE_RESUMED,
  ES_PLAYER_STATE_SEEK_COMPLETED,
  ES_PLAYER_STATE_SEEK_START,
  ES_PLAYER_STATE_STOP
} from '@extscreen/es-player';

const TAG = 'AudioPlayerModule';

export default {
  name: 'AudioPlayerModule',
  mixins: [ESPage, ESAudioPlayerMixin],
  methods: {
    initAudio() {
      ESAudioPlayerModule.init();
    },
    playAudio() {
      let url1 = 'http://qcloudimg-moss.cp47.ott.cibntv.net/channelzero/video/music/absolute_music_set_out.mp3';
      ESAudioPlayerModule.play(url1);
    },
    startAudio() {
      ESAudioPlayerModule.start();
    },
    pauseAudio() {
      ESAudioPlayerModule.pause();
    },
    stopAudio() {
      ESAudioPlayerModule.stop();
      ESAudioPlayerModule.release();
    },
    seekAudio() {
      ESAudioPlayerModule.seekTo(2000);
    },
    speedAudio() {
      ESAudioPlayerModule.setPlayRate(2);
    },
    onPlayerStatusChanged(event) {
      switch (event.playerStatus) {
        case ES_PLAYER_STATE_PREPARED: {
          ESAudioPlayerModule.start();
          break;
        }
        case ES_PLAYER_STATE_PAUSED: {
          break;
        }
        case ES_PLAYER_STATE_STOP: {
          break;
        }
        case ES_PLAYER_STATE_PLAYBACK_COMPLETED: {
          break;
        }
        case ES_PLAYER_STATE_ERROR: {
          break;
        }
        case ES_PLAYER_STATE_RESUMED: {
          break;
        }
        case ES_PLAYER_STATE_BUFFER_START: {
          break;
        }
        case ES_PLAYER_STATE_BUFFER_END: {
          break;
        }
        case ES_PLAYER_STATE_SEEK_START: {
          break;
        }
        case ES_PLAYER_STATE_SEEK_COMPLETED: {
          break;
        }
      }
    },
    onPlayerInfo(info) {
    },
    onPlayRateChanged(playRate) {
    },
    onPlayerError(errorCode, errorMessage) {
    },
    onBackPressed() {
      this.stopAudio();
      ESLaunchManager.finishESPage();
    },
  },
  components: {}
};
</script>

<style scoped>
</style>