修复横屏界面赞助中心 通用设置无法滚动 小屏界面侧边栏图片隐藏

entry/src/main/ets/pages/AboutPage.ets

@@ -71,10 +71,11 @@ export struct AboutPage{
             })
 
           Button('加入讨论组：685109858', { type: ButtonType.Capsule, stateEffect: false })
-            .width('70%')
+            .width('60%')
             .height(55)
             .margin({top:50,bottom:20})
               // .visibility(Visibility.None)
+            .stateEffect(true)
             .backgroundColor(Color.Red)
             .stateStyles({
               pressed: { opacity: 0.6 } // 按压反馈
@@ -91,8 +92,9 @@ export struct AboutPage{
             })
 
           Button('用户反馈', { type: ButtonType.Capsule, stateEffect: false })
-            .width('70%')
+            .width('60%')
             .height(55)
+            .stateEffect(true)
             .margin({bottom:20})
               // .visibility(Visibility.None)
             .backgroundColor(Color.Red)

entry/src/main/ets/pages/NewIndex.ets

@@ -1,4 +1,4 @@
-import { AppUtil, DisplayUtil, ToastUtil } from '@pura/harmony-utils';
+import { AppUtil, DeviceUtil, DisplayUtil, ToastUtil } from '@pura/harmony-utils';
 import TitleBar from '../view/TitleBar';
 import { router } from '@kit.ArkUI';
 import mainViewModel, { MainViewModel } from '../viewmodel/MainViewModel';
@@ -20,6 +20,8 @@ import { StreamContent } from '../view/StreamContent';
 import { AvSessionController } from '../controller/AvSessionController';
 import { ImageKnife } from '@ohos/imageknife';
 import { BreakpointSystem, BreakpointTypeEnum } from '../common/util/BreakpointSystem';
+import { deviceInfo } from '@kit.BasicServicesKit';
+import { resourceManager } from '@kit.LocalizationKit';
 
 const TAG = 'NewIndex'; // 日志标签
 
@@ -203,57 +205,65 @@ struct NewIndex{
 
       // 侧边抽屉菜单
       if(this.isShowDrawer){
-        Column() {
           Column() {
-            // 抽屉顶部背景图
-            Image($r('app.media.bg_music'))
-              .width('100%')
-              .height(180)
-            // 动态生成抽屉菜单内容
-            this.getDrawerView()
+            Column() {
+              // 抽屉顶部背景图
+              Image($r('app.media.bg_music'))
+                .width('100%')
+                .visibility(this.isCoverOpacity()?Visibility.None:Visibility.Visible)
+                .height(180)
+              Blank()
+                .backgroundColor($r('app.color.title_bar_bg'))
+                .visibility(this.isCoverOpacity()?Visibility.Visible:Visibility.None)
+                .width('100%')
+                .height(55)
+              // 动态生成抽屉菜单内容
+              this.getDrawerView()
+            }
+            .width(this.currentBreakpoint !== BreakpointTypeEnum.SM?'40%':'80%')
+            .height('100%')
+            .backgroundColor(Color.White)
+            .onClick((event:ClickEvent)=>{
+              // 阻止事件冒泡
+            })
           }
-          .width(this.currentBreakpoint !== BreakpointTypeEnum.SM?'40%':'80%')
+          .width('100%')
           .height('100%')
-          .backgroundColor(Color.White)
+          .backgroundColor($r('app.color.ban_touming'))
+          .alignItems(HorizontalAlign.Start)
           .onClick((event:ClickEvent)=>{
-            // 阻止事件冒泡
-          })
-        }
-        .width('100%')
-        .height('100%')
-        .backgroundColor($r('app.color.ban_touming'))
-        .alignItems(HorizontalAlign.Start)
-        .onClick((event:ClickEvent)=>{
-          // 点击抽屉外部关闭抽屉
-          animateTo({ duration: 555 }, () => {
-            this.isShowDrawer = false
-          })
-        })
-        .translate({ x: this.offsetX, y: 0, z: 0 })
-        .transition({ type: TransitionType.Insert, translate: { x: -DisplayUtil.getWidth(), y: 0 } })
-        .transition({ type: TransitionType.Delete, translate: { x: -DisplayUtil.getWidth(), y: 0 } })
-        .gesture(
-          PanGesture()
-            .onActionUpdate((event:GestureEvent)=>{
-              // 手势滑动更新抽屉偏移
-              if(event.offsetX<0){
-                this.offsetX = event.offsetX;
-              }
-            })
-            .onActionEnd(() => {
-              // 手势结束判断是否关闭抽屉
-              if(this.offsetX<-DisplayUtil.getWidth()/9){
-                animateTo({ duration: 555 }, () => {
-                  this.isShowDrawer = false
-                })
-              }else{
-                animateTo({ duration: 555 }, () => {
-                  this.isShowDrawer = true
-                  this.offsetX = 0
-                })
-              }
+            // 点击抽屉外部关闭抽屉
+            animateTo({ duration: 555 }, () => {
+              this.isShowDrawer = false
             })
-        )
+          })
+          .translate({ x: this.offsetX, y: 0, z: 0 })
+          .transition({ type: TransitionType.Insert, translate: { x: -DisplayUtil.getWidth(), y: 0 } })
+          .transition({ type: TransitionType.Delete, translate: { x: -DisplayUtil.getWidth(), y: 0 } })
+          .gesture(
+            PanGesture()
+              .onActionUpdate((event:GestureEvent)=>{
+                // 手势滑动更新抽屉偏移
+                if(event.offsetX<0){
+                  this.offsetX = event.offsetX;
+                }
+              })
+              .onActionEnd(() => {
+                // 手势结束判断是否关闭抽屉
+                if(this.offsetX<-DisplayUtil.getWidth()/9){
+                  animateTo({ duration: 555 }, () => {
+                    this.isShowDrawer = false
+                  })
+                }else{
+                  animateTo({ duration: 555 }, () => {
+                    this.isShowDrawer = true
+                    this.offsetX = 0
+                  })
+                }
+              })
+          )
+
+
       }
     }
   }
@@ -519,6 +529,48 @@ struct NewIndex{
     this.status = "广告加载中..."
   }
 
+
+
+  @StorageProp('currentHeightBreakpoint') currentHeightBreakpoint: HeightBreakpoint | undefined =
+    HeightBreakpoint.HEIGHT_LG;
+  @StorageProp('currentWidthBreakpoint') currentWidthBreakpoint: WidthBreakpoint | undefined = WidthBreakpoint.WIDTH_SM;
+
+  //是否是Pura X外屏，或者小屏幕
+  isPuraWP() {
+    return this.currentWidthBreakpoint === WidthBreakpoint.WIDTH_SM
+      && this.currentHeightBreakpoint === HeightBreakpoint.HEIGHT_MD
+  }
+  //是否是Pura X外屏，或者小屏幕或者手机横屏
+  isCoverOpacity() {
+    if (this.isPuraWP()) {
+      return true
+    }
+
+    if (this.isPhoneLan()) {
+      return true
+    }
+
+    if (deviceInfo.marketName.includes('Pura X')
+      && this.currentHeightBreakpoint === HeightBreakpoint.HEIGHT_SM) {
+      return true
+    }
+
+
+    return false
+  }
+
+  //是不是手机横屏
+  isPhoneLan() {
+    if (DeviceUtil.getDeviceType() === resourceManager.DeviceType.DEVICE_TYPE_PHONE
+      && this.currentBreakpoint !== BreakpointTypeEnum.SM) {
+      if (DisplayUtil.getFoldStatus() === 0 || DisplayUtil.getFoldStatus() === 2) {
+        return true
+      }
+    }
+
+    return false
+  }
+
   /**
    * 展示Banner广告
    */

entry/src/main/ets/pages/ScanFilePage.ets

@@ -198,7 +198,7 @@ export struct ScanFilePage{
             Column() {
               Button($r('app.string.start_scan'), { type: ButtonType.Capsule, stateEffect: false })
 
-                .width('80%')
+                .width('60%')
                 .height(55)
                 .margin({ top: 50, bottom: 20 })
                 .linearGradient({

entry/src/main/ets/pages/SettingPage.ets

@@ -123,193 +123,205 @@ export struct SettingPage {
   }
 
   build() {
+
     Column() {
       TitleBar({ model: $titleBarModel })
-      Column() {
-        //音频设置
-        Row() {
-          Text('音频设置')
-            .margin({ left: 38, right: 20 })
-            .fontSize(16)
-            .fontColor(Color.Gray)
-            .fontWeight(480)
-          Blank()
-        }
-        .width('100%')
-        .height(55)
+      Scroll() {
+        Column() {
+          //音频设置
+          Row() {
+            Text('音频设置')
+              .margin({ left: 38, right: 20 })
+              .fontSize(16)
+              .fontColor(Color.Gray)
+              .fontWeight(480)
+            Blank()
+          }
+          .width('100%')
+          .height(55)
+          Line().width('100%').height(0.3).backgroundColor($r('app.color.index_tab_unselected_font_color'))
+          Row() {
+            Image($r('app.media.kp_music_nor'))
+              .width(22)
+              .height(22)
+              .alignSelf(ItemAlign.Center)
+              .margin({ left: 28 })
+            Text('记忆播放')
+              .margin({ left: 10, right: 20 })
+              .fontSize(15)
+              .fontColor(Color.Gray)
+              .fontWeight(480)
+            Blank()
+            Toggle({ type: ToggleType.Switch, isOn: this.isMusicMemoryPlay })
+              .selectedColor($r('app.color.title_bar_bg'))// 设置开关打开时的背景颜色为蓝色
+              .switchPointColor(Color.White)// 设置开关关闭时的滑块颜色为白色
+              .margin({ right: 28 })
+              .onChange((checked: boolean) => { // 选择开关状态变化时触发事件
+                this.isMusicMemoryPlay = checked;
+                PreferencesUtil.put(SettingPage.iS_MUSIC_MEMORY_PLAY, this.isMusicMemoryPlay)
+              })
+              .width(50)
+              .height(30);
+          }
+          .width('100%')
+          .height(55)
 
-        Line().width('100%').height(0.3).backgroundColor($r('app.color.index_tab_unselected_font_color'))
-        Row() {
-          Image($r('app.media.kp_music_nor'))
-            .width(22)
-            .height(22)
-            .alignSelf(ItemAlign.Center)
-            .margin({ left: 28 })
-          Text('记忆播放')
-            .margin({ left: 10, right: 20 })
-            .fontSize(15)
-            .fontColor(Color.Gray)
-            .fontWeight(480)
-          Blank()
-          Toggle({ type: ToggleType.Switch, isOn: this.isMusicMemoryPlay })
-            .selectedColor($r('app.color.title_bar_bg'))// 设置开关打开时的背景颜色为蓝色
-            .switchPointColor(Color.White)// 设置开关关闭时的滑块颜色为白色
-            .margin({ right: 28 })
-            .onChange((checked: boolean) => { // 选择开关状态变化时触发事件
-              this.isMusicMemoryPlay = checked;
-              PreferencesUtil.put(SettingPage.iS_MUSIC_MEMORY_PLAY, this.isMusicMemoryPlay)
-            })
-            .width(50)
-            .height(30);
-        }
-        .width('100%')
-        .height(55)
+          Line().width('100%').height(0.3).backgroundColor($r('app.color.index_tab_unselected_font_color'))
+          Row() {
+            Image($r('app.media.kp_music_nor'))
+              .width(22)
+              .height(22)
+              .alignSelf(ItemAlign.Center)
+              .margin({ left: 28 })
+            Text('默认排序模式')
+              .margin({ left: 10, right: 20 })
+              .fontSize(15)
+              .fontColor(Color.Gray)
+              .fontWeight(480)
+            Blank()
+            Select([//默认排序模式
+              { value: CommonConstants.SORT_ARRAY[0] },
+              { value: CommonConstants.SORT_ARRAY[1] },
+              { value: CommonConstants.SORT_ARRAY[2] },
+              { value: CommonConstants.SORT_ARRAY[3] },
+              { value: CommonConstants.SORT_ARRAY[4] },
+              { value: CommonConstants.SORT_ARRAY[5] },
+              { value: CommonConstants.SORT_ARRAY[6] },
+              { value: CommonConstants.SORT_ARRAY[7] }])
+              .font({ size: 15, weight: FontWeight.Medium })
+              .fontColor(Color.Gray)
+              .margin({right:28})
+              .selected(this.sortType)
+              .value(CommonConstants.SORT_ARRAY[this.sortType])
+              .onSelect(async (_index: number, text?: string | undefined) => {
+                this.sortType = _index
+                PreferencesUtil.put(SettingPage.SORT_TYPE, this.sortType)
+              })
 
-        Line().width('100%').height(0.3).backgroundColor($r('app.color.index_tab_unselected_font_color'))
-        Row() {
-          Image($r('app.media.kp_music_nor'))
-            .width(22)
-            .height(22)
-            .alignSelf(ItemAlign.Center)
-            .margin({ left: 28 })
-          Text('默认排序模式')
-            .margin({ left: 10, right: 20 })
-            .fontSize(15)
-            .fontColor(Color.Gray)
-            .fontWeight(480)
-          Blank()
-          Select([//默认排序模式
-            { value: CommonConstants.SORT_ARRAY[0] },
-            { value: CommonConstants.SORT_ARRAY[1] },
-            { value: CommonConstants.SORT_ARRAY[2] },
-            { value: CommonConstants.SORT_ARRAY[3] },
-            { value: CommonConstants.SORT_ARRAY[4] },
-            { value: CommonConstants.SORT_ARRAY[5] },
-            { value: CommonConstants.SORT_ARRAY[6] },
-            { value: CommonConstants.SORT_ARRAY[7] }])
-            .font({ size: 15, weight: FontWeight.Medium })
-            .fontColor(Color.Gray)
-            .margin({right:28})
-            .selected(this.sortType)
-            .value(CommonConstants.SORT_ARRAY[this.sortType])
-            .onSelect(async (_index: number, text?: string | undefined) => {
-              this.sortType = _index
-              PreferencesUtil.put(SettingPage.SORT_TYPE, this.sortType)
-            })
 
+          }
+          .width('100%')
+          .height(55)
 
-        }
-        .width('100%')
-        .height(55)
 
+          Line().width('100%').height(0.3).backgroundColor($r('app.color.index_tab_unselected_font_color'))
+          Row() {
+            Image($r('app.media.kp_music_nor'))
+              .width(22)
+              .height(22)
+              .alignSelf(ItemAlign.Center)
+              .margin({ left: 28 })
+            Text('播放背景随音乐封面')
+              .margin({ left: 10, right: 20 })
+              .fontSize(15)
+              .fontColor(Color.Gray)
+              .fontWeight(480)
+            Blank()
+            Toggle({ type: ToggleType.Switch, isOn: this.isMusicBGCover })
+              .selectedColor($r('app.color.title_bar_bg'))// 设置开关打开时的背景颜色为蓝色
+              .switchPointColor(Color.White)// 设置开关关闭时的滑块颜色为白色
+              .margin({ right: 28 })
+              .onChange((checked: boolean) => { // 选择开关状态变化时触发事件
+                this.isMusicBGCover = checked;
+                PreferencesUtil.put(SettingPage.iS_MUSIC_BG_COVER, this.isMusicBGCover)
+
+              })
+              .width(50)
+              .height(30);
+          }
+          .width('100%')
+          .height(55)
 
-        Line().width('100%').height(0.3).backgroundColor($r('app.color.index_tab_unselected_font_color'))
-        Row() {
-          Image($r('app.media.kp_music_nor'))
-            .width(22)
-            .height(22)
-            .alignSelf(ItemAlign.Center)
-            .margin({ left: 28 })
-          Text('播放背景随音乐封面')
-            .margin({ left: 10, right: 20 })
-            .fontSize(15)
-            .fontColor(Color.Gray)
-            .fontWeight(480)
-          Blank()
-          Toggle({ type: ToggleType.Switch, isOn: this.isMusicBGCover })
-            .selectedColor($r('app.color.title_bar_bg'))// 设置开关打开时的背景颜色为蓝色
-            .switchPointColor(Color.White)// 设置开关关闭时的滑块颜色为白色
-            .margin({ right: 28 })
-            .onChange((checked: boolean) => { // 选择开关状态变化时触发事件
-              this.isMusicBGCover = checked;
-              PreferencesUtil.put(SettingPage.iS_MUSIC_BG_COVER, this.isMusicBGCover)
 
-            })
-            .width(50)
-            .height(30);
-        }
-        .width('100%')
-        .height(55)
+          Line().width('100%').height(0.3).backgroundColor($r('app.color.index_tab_unselected_font_color'))
 
+          // API设置（合并标题）
+          Row() {
+            Text('API设置')
+              .margin({ left: 38, right: 20 })
+              .fontSize(16)
+              .fontColor(Color.Gray)
+              .fontWeight(480)
+          }
+          .width('100%')
+          .height(55)
 
-        Line().width('100%').height(0.3).backgroundColor($r('app.color.index_tab_unselected_font_color'))
+          Line().width('100%').height(0.3).backgroundColor($r('app.color.index_tab_unselected_font_color'))
+          // 歌词API地址展示
+          Row() {
+            Text('歌词:')
+              .margin({ left: 38, right: 6 })
+              .fontSize(15)
+              .fontColor(Color.Gray)
+            Text(this.lyricApiUrl)
+              .margin({ right: 10 })
+              .fontSize(15)
+              .fontColor(Color.Gray)
+              .layoutWeight(1)
+            // 编辑图标按钮
+            Image($r('app.media.edit'))
+              .width(28)
+              .height(28)
+              .margin({ right: 18 })
+              .onClick(() => {
+                this.apiDialogType = 'lyric'
+                this.tempApiUrl = this.lyricApiUrl
+                this.apiDialogController.open()
+              })
+            Blank()
+          }
+          .width('100%')
+          .margin({ top: 8, bottom: 12 })
 
-        // API设置（合并标题）
-        Row() {
-          Text('API设置')
-            .margin({ left: 38, right: 20 })
-            .fontSize(16)
-            .fontColor(Color.Gray)
-            .fontWeight(480)
-        }
-        .width('100%')
-        .height(55)
+          // 封面API地址展示
+          Row() {
+            Text('封面:')
+              .margin({ left: 38, right: 6 })
+              .fontSize(15)
+              .fontColor(Color.Gray)
+            Text(this.coverApiUrl)
+              .margin({ right: 10 })
+              .fontSize(15)
+              .fontColor(Color.Gray)
+              .layoutWeight(1)
+            // 编辑图标按钮
+            Image($r('app.media.edit'))
+              .width(28)
+              .height(28)
+              .margin({ right: 18 })
+              .onClick(() => {
+                this.apiDialogType = 'cover'
+                this.tempApiUrl = this.coverApiUrl
+                this.apiDialogController.open()
+              })
+            Blank()
+          }
+          .width('100%')
+          .margin({ top: 8, bottom: 12 })
 
-        Line().width('100%').height(0.3).backgroundColor($r('app.color.index_tab_unselected_font_color'))
-        // 歌词API地址展示
-        Row() {
-          Text('歌词:')
-            .margin({ left: 38, right: 6 })
-            .fontSize(15)
-            .fontColor(Color.Gray)
-          Text(this.lyricApiUrl)
-            .margin({ right: 10 })
-            .fontSize(15)
-            .fontColor(Color.Gray)
-            .layoutWeight(1)
-          // 编辑图标按钮
-          Image($r('app.media.edit'))
-            .width(28)
-            .height(28)
-            .margin({ right: 18 })
-            .onClick(() => {
-              this.apiDialogType = 'lyric'
-              this.tempApiUrl = this.lyricApiUrl
-              this.apiDialogController.open()
-            })
-          Blank()
         }
-        .width('100%')
-        .margin({ top: 8, bottom: 12 })
+        .backgroundColor(Color.White)
+        .margin({
+          left: 25,
+          right: 25,
+          top: 20,
+          bottom: 50
+        })
+        .layoutWeight(1)
+        .justifyContent(FlexAlign.Start) // Align items to the start
+        .borderRadius(30)
 
-        // 封面API地址展示
-        Row() {
-          Text('封面:')
-            .margin({ left: 38, right: 6 })
-            .fontSize(15)
-            .fontColor(Color.Gray)
-          Text(this.coverApiUrl)
-            .margin({ right: 10 })
-            .fontSize(15)
-            .fontColor(Color.Gray)
-            .layoutWeight(1)
-          // 编辑图标按钮
-          Image($r('app.media.edit'))
-            .width(28)
-            .height(28)
-            .margin({ right: 18 })
-            .onClick(() => {
-              this.apiDialogType = 'cover'
-              this.tempApiUrl = this.coverApiUrl
-              this.apiDialogController.open()
-            })
-          Blank()
-        }
-        .width('100%')
-        .margin({ top: 8, bottom: 12 })
 
       }
-      .backgroundColor(Color.White)
-      .margin({
-        left: 15,
-        right: 15,
-        top: 20,
-        bottom: 10
-      })
-      .borderRadius(30)
+      .scrollBar(BarState.Auto)
+      .height('100%')
+      .width('100%')
+      .margin({bottom:18})
+
     }
     .backgroundColor($r('app.color.index_background'))
     .height('100%')
+    .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.BOTTOM])
   }
 
 }

entry/src/main/ets/pages/VipPage.ets

@@ -118,7 +118,7 @@ export  struct  VipPage{
 
     Column() {
       TitleBar({ model: $titleBarModel })
-      // Scroll() {
+      Scroll() {
       Column() {
         Column() {
           Column() {
@@ -150,14 +150,13 @@ export  struct  VipPage{
           .height(72)
           .borderRadius(30)
         }
-
+        .height(72)
         .margin({
           left: 15,
           right: 15,
           top: 15,
           bottom: 0
         })
-        .justifyContent(FlexAlign.Center)
 
         Column() {
           Line().width('100%').height(0.3).backgroundColor($r('app.color.index_tab_unselected_font_color'))
@@ -450,8 +449,7 @@ export  struct  VipPage{
           Line().width('100%').height(0.3).backgroundColor($r('app.color.index_tab_unselected_font_color'))
         }
         .margin({top:20,bottom:15})
-        .layoutWeight(1)
-        Blank()
+
 
         Row(){
 
@@ -466,16 +464,16 @@ export  struct  VipPage{
               this.doPay()
             })
         }
-        .position({bottom:50})
-        .margin({top:15})
-
+        .margin({top:15,bottom:66})
+        .width('60%')
 
       }
-      // }
-      // .scrollBar(BarState.Off)
-      // .height('100%')
-      // .alignSelf(ItemAlign.Start)
-      // .width('100%')
+      .layoutWeight(1)
+      }
+      .scrollBar(BarState.Auto)
+      .height('100%')
+      .alignSelf(ItemAlign.Start)
+      .width('100%')
     }
   }