Blizzard
55 lines
1.7 KiB
Plaintext
55 lines
1.7 KiB
Plaintext
<!-- 全局底部悬浮播放控制条 -->
|
|
<view class="player-bar {{show ? 'show' : ''}}" wx:if="{{activeContent}}" bindtap="goToPlayer">
|
|
|
|
<!-- 左侧封面圆盘（播放时旋转） -->
|
|
<view class="disc-wrap">
|
|
<view class="disc {{isPlaying ? 'disc-spin' : ''}}">
|
|
<!-- 外环 -->
|
|
<view class="disc-ring"></view>
|
|
<text class="disc-emoji">📻</text>
|
|
</view>
|
|
<!-- 播放时的声波小点 -->
|
|
<view class="disc-pulse" wx:if="{{isPlaying}}"></view>
|
|
</view>
|
|
|
|
<!-- 标题区域 -->
|
|
<view class="info">
|
|
<text class="title">{{activeContent.title}}</text>
|
|
<view class="subtitle-row">
|
|
<!-- 播放中的活跃波形条 -->
|
|
<view class="mini-wave" wx:if="{{isPlaying}}">
|
|
<view class="mw-bar" style="animation-delay:0s"></view>
|
|
<view class="mw-bar" style="animation-delay:0.2s"></view>
|
|
<view class="mw-bar" style="animation-delay:0.1s"></view>
|
|
</view>
|
|
<text class="subtitle">{{isPlaying ? '正在播放' : '已暂停'}}</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 播放/暂停按钮 -->
|
|
<view class="ctrl-btn" catchtap="onTogglePlay">
|
|
<!-- 暂停：两竖线 -->
|
|
<view wx:if="{{isPlaying}}" class="pause-icon">
|
|
<view class="p-bar"></view>
|
|
<view class="p-bar"></view>
|
|
</view>
|
|
<!-- 播放：三角 -->
|
|
<text wx:else class="play-icon">▶</text>
|
|
</view>
|
|
|
|
<!-- 底部进度条（可拖动） -->
|
|
<slider
|
|
class="bar-slider"
|
|
min="0"
|
|
max="{{duration}}"
|
|
value="{{currentTime}}"
|
|
activeColor="#FF9E6D"
|
|
backgroundColor="rgba(255, 122, 47, 0.08)"
|
|
block-size="10"
|
|
block-color="#FF9E6D"
|
|
bindchange="onProgressChange"
|
|
bindchanging="onProgressChanging"
|
|
catchtap
|
|
/>
|
|
</view>
|