提交 f41eb0c7 编写于 作者: W wanganxp

web端屏蔽音频播放和uni-icon字体不支持的部分

上级 eb13c34c
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
<boolean-data :defaultValue="false" title="是否自动开始播放" @change="setAutoplay"></boolean-data> <boolean-data :defaultValue="false" title="是否自动开始播放" @change="setAutoplay"></boolean-data>
<boolean-data :defaultValue="false" title="是否循环播放" @change="setLoop"></boolean-data> <boolean-data :defaultValue="false" title="是否循环播放" @change="setLoop"></boolean-data>
<text class="uni-subtitle-text uni-title" <text class="uni-subtitle-text uni-title"
style="padding-left: 10px;padding-top: 10px;padding-right: 10px;">播放倍率</text> style="padding-left: 10px;padding-top: 10px;padding-right: 10px;">播放倍率(Web不支持)</text>
<radio-group class="uni-flex uni-row radio-group" @change="playbackRateChange" <radio-group class="uni-flex uni-row radio-group" @change="playbackRateChange"
style="flex-wrap: wrap;padding: 10px;"> style="flex-wrap: wrap;padding: 10px;">
<radio value="0.5" style="margin-right: 3px">0.5 <radio value="0.5" style="margin-right: 3px">0.5
...@@ -41,30 +41,30 @@ ...@@ -41,30 +41,30 @@
<view class="uni-title"> <view class="uni-title">
<text class="uni-title-text">方法示例</text> <text class="uni-title-text">方法示例</text>
</View> </View>
<button :disabled="isPlaying" type="primary" @click="play" class="uni-btn">播放</button> <button :disabled="isPlaying" @click="play" class="uni-btn">播放</button>
<button :disabled="!isPlaying" type="primary" @click="pause" class="uni-btn">暂停</button> <button :disabled="!isPlaying" @click="pause" class="uni-btn">暂停</button>
<button :disabled="!isPlaying" type="primary" @click="stop" class="uni-btn">停止</button> <button :disabled="!isPlaying" @click="stop" class="uni-btn">停止</button>
<button type="primary" @click="onchangeValue(20)" class="uni-btn">跳转到指定位置20</button> <button @click="onchangeValue(20)" class="uni-btn">跳转到指定位置20</button>
<button type="primary" @click="onTimeUpdate" class="uni-btn">onTimeUpdate</button> <button @click="onTimeUpdate" class="uni-btn">onTimeUpdate</button>
<button type="primary" @click="offTimeUpdate" class="uni-btn">offTimeUpdate</button> <button @click="offTimeUpdate" class="uni-btn">offTimeUpdate</button>
<button type="primary" @click="onWaiting" class="uni-btn">onWaiting</button> <button @click="onWaiting" class="uni-btn">onWaiting</button>
<button type="primary" @click="offWaiting" class="uni-btn">offWaiting</button> <button @click="offWaiting" class="uni-btn">offWaiting</button>
<text style="color: red;font-size: 15px;margin-top: 10px;">tip:销毁后请重新进入此界面再播放</text> <text style="color: red;font-size: 15px;margin-top: 10px;">tip:销毁后请重新进入此界面再播放</text>
<button type="primary" @click="destory" class="uni-btn">销毁</button> <button @click="destory" class="uni-btn">销毁</button>
<view class="uni-title"> <view class="uni-title">
<text class="uni-title-text">格式/路径示例</text> <text class="uni-title-text">格式/路径示例</text>
</View> </View>
<navigator url="/pages/API/create-inner-audio-context/inner-audio-format" class="uni-btn"> <navigator url="/pages/API/create-inner-audio-context/inner-audio-format" class="uni-btn">
<button type="primary" @click="pause">音频格式示例</button> <button @click="pause">音频格式示例</button>
</navigator> </navigator>
<navigator url="/pages/API/create-inner-audio-context/inner-audio-path" class="uni-btn"> <navigator url="/pages/API/create-inner-audio-context/inner-audio-path" class="uni-btn">
<button type="primary" @click="pause">音频路径示例</button> <button @click="pause">音频路径示例</button>
</navigator> </navigator>
<navigator url="/pages/API/create-inner-audio-context/inner-audio-mult" class="uni-btn"> <navigator url="/pages/API/create-inner-audio-context/inner-audio-mult" class="uni-btn">
<button type="primary" @click="pause">多音频同时播放</button> <button @click="pause">多音频同时播放</button>
</navigator> </navigator>
</view> </view>
<!-- #ifdef APP --> <!-- #ifdef APP -->
...@@ -304,4 +304,4 @@ ...@@ -304,4 +304,4 @@
width: 60px; width: 60px;
height: 60px; height: 60px;
} }
</style> </style>
\ No newline at end of file
<template> <template>
<page-head :title="title"></page-head> <!-- #ifdef APP -->
<view class="uni-padding-wrap uni-common-mt"> <scroll-view style="flex: 1;">
<!-- #endif -->
<view class="uni-title"> <view class="uni-title">
<text class="uni-title-text">音频路径示例</text> <text class="uni-title-text">音频路径示例</text>
</view> </view>
...@@ -9,7 +10,9 @@ ...@@ -9,7 +10,9 @@
<image class="icon-play" :src="(isPlaying && playIndex==index)?'/static/pause.png':'/static/play.png'" <image class="icon-play" :src="(isPlaying && playIndex==index)?'/static/pause.png':'/static/play.png'"
@click="play(item.src,index)"></image> @click="play(item.src,index)"></image>
</view> </view>
</view> <!-- #ifdef APP -->
</scroll-view>
<!-- #endif -->
</template> </template>
<script> <script>
...@@ -20,25 +23,30 @@ ...@@ -20,25 +23,30 @@
export default { export default {
data() { data() {
return { return {
title: 'audio-path',
playIndex: 0, playIndex: 0,
isPlaying: false, isPlaying: false,
nativePath:uni.env.CACHE_PATH+'uni-audio/test/test.mp3' as string, // #ifdef APP
sdcardPath :'sdcard/uni-audio/test.mp3', nativePath: uni.env.CACHE_PATH + 'uni-audio/test/test.mp3' as string,
// #endif
// #ifdef APP-ANDROID
sdcardPath: 'sdcard/uni-audio/test.mp3',
// #endif
_audioContext: null as InnerAudioContext | null, _audioContext: null as InnerAudioContext | null,
supportPaths: [ supportPaths: [
{ {
description: '本地路径:/static方式', description: '本地路径:/static方式',
src: '/static/test-audio/ForElise.mp3' src: '/static/test-audio/ForElise.mp3'
}, },
{ {
description: '本地路径:../static/', description: '本地路径:../static/',
src: '../../../static/test-audio/ForElise.mp3' src: '../../../static/test-audio/ForElise.mp3'
}, },
{ // #ifdef APP
description: '本地路径:env方式', {
src: 'env' description: '本地路径:env方式',
}, src: 'env'
},
// #endif
{ {
description: '网络路径', description: '网络路径',
src: 'https://web-ext-storage.dcloud.net.cn/uni-app-x/audio/ForElise.mp3' src: 'https://web-ext-storage.dcloud.net.cn/uni-app-x/audio/ForElise.mp3'
...@@ -55,37 +63,39 @@ ...@@ -55,37 +63,39 @@
} }
}, },
onReady() { onReady() {
this._audioContext = uni.createInnerAudioContext(); this._audioContext = uni.createInnerAudioContext();
this._audioContext!.onPlay(() => { this._audioContext!.onPlay(() => {
console.log('开始播放'); console.log('开始播放');
}); });
this._audioContext!.onEnded(() => { this._audioContext!.onEnded(() => {
console.log('播放结束'); console.log('播放结束');
this.isPlaying = false; this.isPlaying = false;
}); });
this._audioContext!.onError((err) => { this._audioContext!.onError((err) => {
this.isPlaying = false; this.isPlaying = false;
console.log('err', err); console.log('err', err);
}); });
const fileManager = uni.getFileSystemManager() // #ifdef APP
try { const fileManager = uni.getFileSystemManager()
fileManager.rmdirSync(uni.env.CACHE_PATH+'uni-audio/test',true) try {
} catch (e) { fileManager.rmdirSync(uni.env.CACHE_PATH + 'uni-audio/test', true)
} } catch (e) {
}
try {
fileManager.mkdirSync(uni.env.CACHE_PATH+'uni-audio/test',true) try {
} catch (e) { fileManager.mkdirSync(uni.env.CACHE_PATH + 'uni-audio/test', true)
} } catch (e) {
try{ }
fileManager.copyFileSync( try {
'/static/test-audio/ForElise.mp3', fileManager.copyFileSync(
this.nativePath) '/static/test-audio/ForElise.mp3',
} catch(e){ this.nativePath)
} } catch (e) {
}, }
// #endif
},
onUnload() { onUnload() {
if (this._audioContext != null) { if (this._audioContext != null) {
this.pause(); this.pause();
...@@ -97,16 +107,18 @@ ...@@ -97,16 +107,18 @@
this._audioContext!.pause(); this._audioContext!.pause();
this.isPlaying = false; this.isPlaying = false;
}, },
play(audioUrl:string, index:number) { play(audioUrl : string, index : number) {
console.log(index,audioUrl); console.log(index, audioUrl);
if (this.isPlaying && this.playIndex == index) { if (this.isPlaying && this.playIndex == index) {
this.pause(); this.pause();
return; return;
} }
if(audioUrl == 'env'){ // #ifdef APP
audioUrl=this.nativePath if (audioUrl == 'env') {
} audioUrl = this.nativePath
}
// #endif
this.playIndex = index this.playIndex = index
this._audioContext!.src = audioUrl; this._audioContext!.src = audioUrl;
this._audioContext!.play(); this._audioContext!.play();
...@@ -126,4 +138,4 @@ ...@@ -126,4 +138,4 @@
height: 60px; height: 60px;
margin: 10px; margin: 10px;
} }
</style> </style>
...@@ -8,9 +8,11 @@ ...@@ -8,9 +8,11 @@
<!-- <text class="common" style="font-family: AlimamaDaoLiTiWOFF">font-family: 阿里妈妈刀隶体-woff</text> <!-- <text class="common" style="font-family: AlimamaDaoLiTiWOFF">font-family: 阿里妈妈刀隶体-woff</text>
<text class="common" style="font-family: AlimamaDaoLiTiWOFF2">font-family: 阿里妈妈刀隶体-woff2</text> --> <text class="common" style="font-family: AlimamaDaoLiTiWOFF2">font-family: 阿里妈妈刀隶体-woff2</text> -->
</view> </view>
<!-- #ifdef APP -->
<view style="margin: 24px 12px;"> <view style="margin: 24px 12px;">
<button type="default" @click="openUniIcon">内置字体图标uni-icon示例</button> <button type="default" @click="openUniIcon">内置字体图标uni-icon示例</button>
</view> </view>
<!-- #endif -->
</template> </template>
<script lang="uts"> <script lang="uts">
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册