Przeglądaj źródła

WebDavMainPage也实现滚动隐藏标题栏

onecold 8 miesięcy temu
rodzic
commit
353e78b41d

+ 30 - 1
entry/src/main/ets/pages/WebDavMainPage.ets

@@ -77,6 +77,9 @@ function decodeUrlEncodedString(encodedStr: string): string {
 @Entry
 @Component
 export struct WebDavMainPage {
+  @State isShowTitleBar: boolean = true //是否显示分类导航条
+  private prevOffsetY: number = 0; // 记录上一次的Y轴偏移量
+  @State autoHideTitle: boolean = true //滚动自动隐藏标题栏
   @State isCustomizeBg: boolean = false //自定义背景界面
   @StorageProp('isLandscape')  isLandscape: boolean = false;
   @State blurValue: number = 0 //背景模糊
@@ -345,6 +348,8 @@ export struct WebDavMainPage {
     this.isLongNameRoLL = PreferencesUtil.getBooleanSync('isLongNameRoLL', true)
     this.sortType = PreferencesUtil.getNumberSync('webDavSortType', 0)
     this.isNoJumpToHome = PreferencesUtil.getBooleanSync('isNoJumpToHome', true)
+    this.isShowTitleBar = PreferencesUtil.getBooleanSync(SettingPage.IS_SHOW_TITLTBAR, true)
+    this.autoHideTitle = PreferencesUtil.getBooleanSync('autoHideTitle', true)
   }
   aboutToAppear(): void {
 
@@ -1151,6 +1156,12 @@ export struct WebDavMainPage {
         this.breaker()
       }
       .width('100%')
+      .visibility(this.isShowTitleBar?Visibility.Visible:
+        this.autoHideTitle?Visibility.None:Visibility.Visible)
+      .animation({
+        duration: 500,
+        curve: Curve.Friction  // 可选动画曲线
+      })
       .position({ top: 0, left: 0 })
       // .backgroundColor($r('app.color.start_window_background'))
 
@@ -1265,7 +1276,7 @@ export struct WebDavMainPage {
           .fontColor($r('app.color.index_tab_font_color'))
           .margin({ left: 12 })
       }
-      .padding({top: this.topSafeHeight + 90, bottom: 5, left: 20, right: 20})
+      .padding({top: this.topSafeHeight + 90, left: 20, right: 20})
       .visibility(this.isLoading?Visibility.Visible:Visibility.None)
       .opacity(this.isLoading ? 1 : 0)
       .animation({
@@ -1298,6 +1309,24 @@ export struct WebDavMainPage {
           }, (item: VideoItem) =>  item.filePath + '_' + this.listRefreshKey)
         }
         .scrollBar(BarState.Off)
+        .onScrollFrameBegin((offset: number) => {
+          // 获取当前滚动偏移量
+          if(this.autoHideTitle){
+            const currentOffsetY = this.listScroller.currentOffset().yOffset;
+            // 判断滚动方向
+            if (currentOffsetY > this.prevOffsetY) {
+              console.log("onecold 向上滚动");
+              this.isShowTitleBar = false
+            } else if (currentOffsetY < this.prevOffsetY) {
+              console.log("onecold 向下滚动");
+              this.isShowTitleBar = true
+            }
+            // 更新前一次偏移量
+            this.prevOffsetY = currentOffsetY;
+          }
+
+          return { offsetRemain: offset };
+        })
         .contentStartOffset(this.topSafeHeight + 85)
         .contentEndOffset(this.bottomSafeHeight+70)
         .layoutWeight(1)

+ 1 - 1
entry/src/main/ets/view/NavidromePage.ets

@@ -1480,7 +1480,7 @@ export struct NavidromePage {
           Button('返回')
             .type(ButtonType.Capsule)
             .backgroundColor(this.themeColor)
-            .fontSize(12)
+            .fontSize(11)
             .onClick(() => this.clearFilter())
         }
         .width('90%')