findme-miniprogram-frontend/custom-tab-bar/index.wxml
2025-12-27 17:16:03 +08:00

33 lines
No EOL
1.8 KiB
Text
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!--custom-tab-bar/index.wxml-->
<view class="tab-bar-glass tab-bar">
<view wx:for="{{list}}" wx:key="index"
class="tab-bar-item {{selected === index ? 'tab-active' : ''}} {{index === 2 ? 'camera-tab-item' : ''}}"
data-path="{{item.pagePath}}"
data-index="{{index}}"
bindtap="switchTab">
<!-- 拍照按钮索引2根据激活状态显示图标其他按钮根据选中状态显示 -->
<image class="tab-bar-icon {{selected === index ? 'tab-icon-active' : ''}} {{index === 2 && cameraActive ? 'tab-icon-active camera-icon-large' : ''}} {{index === 2 && !cameraActive ? 'camera-icon-normal' : ''}}"
src="{{index === 2 ? (cameraActive ? item.selectedIconPath : item.iconPath) : (selected === index ? item.selectedIconPath : item.iconPath)}}"
mode="aspectFit" />
<!-- 所有按钮未选中/未激活时显示文字 -->
<text wx:if="{{index === 2 ? !cameraActive : selected !== index}}" class="tab-bar-text" style="color: {{selected === index ? selectedColor : color}};">{{item.text}}</text>
</view>
</view>
<!-- 拍照功能弹窗 -->
<view class="camera-action-sheet {{showCameraAction ? 'show' : ''}}">
<view class="action-sheet-mask" bindtap="hideCameraActionSheet"></view>
<view class="action-sheet-content">
<view class="action-sheet-item primary" bindtap="takePhoto">
<text class="action-text">拍照</text>
</view>
<view class="action-sheet-divider-thin"></view>
<view class="action-sheet-item primary" bindtap="chooseImage">
<text class="action-text">从相册选择</text>
</view>
<view class="action-sheet-divider"></view>
<view class="action-sheet-item cancel" bindtap="hideCameraActionSheet">
<text class="action-text">取消</text>
</view>
</view>
</view>