tabbar适配安卓端

gym-manage-uniapp/pages/index/index.vue

@@ -1,9 +1,4 @@
 <template>
-  <!-- 水波纹背景 - 顶层显示 -->
-  <!-- <view class="bg-wrapper">
-    <image src="https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/wave_top.png" mode="widthFix" class="wave-bg wave-top" />
-    <image src="https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/wave_bottom.png" mode="widthFix" class="wave-bg wave-bottom" />
-  </view> -->
   <!-- 固定白色块（滚动时显示） -->
   <view class="hand" :style="{height : handHeight + 'rpx'}" v-show="isShow"></view>
   
@@ -61,24 +56,11 @@ const handleScroll = (e) => {
   const distance = e.detail.scrollTop
   scrollDistance.value = distance
   
-  // 获取滚动容器的高度（可视区域高度）
-  const scrollViewHeight = e.detail.scrollHeight
-  scrollContentHeight.value = scrollViewHeight
+  console.log(`滚动距离: ${distance}`)
   
-  // 计算滚动百分比
-  // 滚动百分比 = 当前滚动距离 / (内容总高度 - 可视区域高度) * 100
-  const maxScrollDistance = scrollContentHeight.value - windowHeight.value
-  let scrollPercent = 0
-  
-  if (maxScrollDistance > 0) {
-    scrollPercent = (distance / maxScrollDistance) * 100
-  }
-  
-  console.log(`滚动距离: ${distance}, 滚动百分比: ${scrollPercent.toFixed(2)}%`)
-  
-  // 当滚动超过 10% 时显示白色块（你可以调整这个百分比）
-  const SHOW_THRESHOLD = 40 // 10% 的阈值，可以根据需要调整
-  isShow.value = scrollPercent > SHOW_THRESHOLD
+  // 当滚动超过一定距离时显示白色块（200px = 400rpx）
+  const SHOW_THRESHOLD = 50 // 滚动超过200px时显示白条
+  isShow.value = distance > SHOW_THRESHOLD
 }
 
 // 下拉刷新处理
@@ -118,16 +100,27 @@ onMounted(() => {
     loading.value = false
   }, 1500)
   
-  // 获取胶囊按钮高度
-  const menuButtonInfo = uni.getMenuButtonBoundingClientRect()
-  const navTotalHeight = menuButtonInfo.top + menuButtonInfo.height
-  handHeight.value = navTotalHeight * 2.5
-  
-  // 获取可视窗口高度
+  // 获取系统信息
   uni.getSystemInfo({
     success: (res) => {
       windowHeight.value = res.windowHeight
       console.log('可视窗口高度:', windowHeight.value)
+      console.log('平台:', res.platform)
+      
+      // #ifdef MP-WEIXIN
+      // 微信小程序使用胶囊按钮高度（保持原有逻辑）
+      const menuButtonInfo = uni.getMenuButtonBoundingClientRect()
+      const navTotalHeight = menuButtonInfo.top + menuButtonInfo.height
+      handHeight.value = navTotalHeight * 2.5
+      console.log('微信小程序胶囊按钮高度:', handHeight.value)
+      // #endif
+      
+      // #ifndef MP-WEIXIN
+      // H5和安卓App只显示状态栏高度
+      const statusBarHeight = res.statusBarHeight || 0
+      handHeight.value = statusBarHeight * 2 // 转换为rpx（1px = 2rpx）
+      console.log('非微信小程序状态栏高度:', handHeight.value, 'rpx')
+      // #endif
     }
   })
   
@@ -145,35 +138,6 @@ onMounted(() => {
 </script>
 
 <style lang="scss" scoped>
-/* 背景包装器 - 固定在最底层 */
-.bg-wrapper {
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  z-index: 1;
-  pointer-events: none;
-}
-
-.wave-bg {
-  position: fixed;
-  left: 0;
-  width: 100%;
-  pointer-events: none;
-  opacity: 0.6;
-}
-
-.wave-top {
-  top: 0;
-  opacity: 0.5;
-}
-
-.wave-bottom {
-  bottom: 100rpx;
-  opacity: 0.35;
-}
-
 /* 滚动容器 */
 .scroll-container {
   position: relative;