W3Cschool
恭喜您成為首批注冊用戶
獲得88經(jīng)驗值獎勵
解釋: 暫停
Web 態(tài)說明:詳見 animation-video 組件 Web 態(tài)說明。
無
<view class="wrap">
<view class="card-area">
<view class="video-area">
<animation-video
id="myAnimationVideo"
path="{{path}}"
loop="{{loop}}"
resource-width="800"
resource-height="400"
canvas-style="width:200px;height:200px"
autoplay="{{autoplay}}"
bindstarted="started"
bindended="ended"
></animation-video>
</view>
<button class="btn" type="primary" bindtap="changeStatus">{{status}}動畫</button>
</view>
</view>
Page({
data: {
loop: true,
path: 'https://efe-h2.cdn.bcebos.com/ceug/resource/res/2020-1/1577964961344/003e2f0dcd81.mp4',
status: '暫停',
autoplay: true
},
onLoad() {
// 創(chuàng)建動畫組件實例
this.myAnimationVideo = swan.createAnimationVideo('myAnimationVideo');
},
changeStatus() {
let action = this.data.status;
let status = action === '暫停' ? '播放' : '暫停';
status === '暫停' ? this.myAnimationVideo.play() : this.myAnimationVideo.pause();
this.setData({status});
},
started(e) {
console.log('animationVideo', e.type);
},
ended(e) {
console.log('animationVideo', e.type);
}
});
.video-area {
height: 2.18rem;
background: #343434;
display: flex;
align-items: center;
justify-content: center;
}
Copyright©2021 w3cschool編程獅|閩ICP備15016281號-3|閩公網(wǎng)安備35020302033924號
違法和不良信息舉報電話:173-0602-2364|舉報郵箱:jubao@eeedong.com
掃描二維碼
下載編程獅App
編程獅公眾號
聯(lián)系方式:
更多建議: