一多适配界面修改

提交部分网格布局的功能

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

@@ -1,10 +1,11 @@
 import TitleBar from '../view/TitleBar'
 import { router } from '@kit.ArkUI'
 import { CommonConstants } from '../common/constants/CommonConstants'
-import { AppUtil, DisplayUtil, ToastUtil } from '@pura/harmony-utils'
+import { AppUtil, DeviceUtil, DisplayUtil, ToastUtil } from '@pura/harmony-utils'
 import { Utility } from '../common/util/Utility'
 import { ConfigurationConstant } from '@kit.AbilityKit'
 import { BreakpointTypeEnum } from '../common/util/BreakpointSystem'
+import { resourceManager } from '@kit.LocalizationKit'
 
 @Preview
 @Entry
@@ -55,12 +56,24 @@ export struct AboutPage{
     console.info('LifeCycleComponent aboutToDisappear');
   }
 
+  //是不是手机横屏
+  isPhoneLan() {
+    if (DeviceUtil.getDeviceType() === resourceManager.DeviceType.DEVICE_TYPE_PHONE
+      && this.currentBreakpoint !== BreakpointTypeEnum.SM) {
+      if (DisplayUtil.getFoldStatus() === 0 || DisplayUtil.getFoldStatus() === 2) {
+        return true
+      }
+    }
+
+    return false
+  }
+
   build() {
     Column(){
       Column(){
         Line().width('100%').height('100%')
       }
-      .height(this.currentBreakpoint !== BreakpointTypeEnum.SM?0:px2vp(AppUtil.getStatusBarHeight()))
+      .height(this.isPhoneLan()?0:px2vp(AppUtil.getStatusBarHeight()))
       .backgroundColor($r('app.color.title_bar_bg'))
       .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP])
       TitleBar({model:$titleBarModel})

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

@@ -1,6 +1,6 @@
 import TitleBar from '../view/TitleBar'
 import {  router } from '@kit.ArkUI'
-import { AppUtil, FileUtil, LogUtil, PreferencesUtil, ToastUtil } from '@pura/harmony-utils'
+import { AppUtil, DeviceUtil, DisplayUtil, FileUtil, LogUtil, PreferencesUtil, ToastUtil } from '@pura/harmony-utils'
 import lottie from '@ohos/lottie'
 import { AnimationItem } from '@ohos/lottie'
 import { MessageEvents, taskpool, worker } from '@kit.ArkTS'
@@ -13,6 +13,7 @@ import Logger from '../common/util/Logger'
 import { CommonConstants } from '../common/constants/CommonConstants'
 import { emitter } from '@kit.BasicServicesKit'
 import { BreakpointTypeEnum } from '../common/util/BreakpointSystem'
+import { resourceManager } from '@kit.LocalizationKit'
 
 
 @Preview
@@ -123,6 +124,17 @@ export struct ScanFilePage{
 
   }
 
+  //是不是手机横屏
+  isPhoneLan() {
+    if (DeviceUtil.getDeviceType() === resourceManager.DeviceType.DEVICE_TYPE_PHONE
+      && this.currentBreakpoint !== BreakpointTypeEnum.SM) {
+      if (DisplayUtil.getFoldStatus() === 0 || DisplayUtil.getFoldStatus() === 2) {
+        return true
+      }
+    }
+
+    return false
+  }
 
 
 
@@ -131,7 +143,7 @@ export struct ScanFilePage{
       Column(){
         Line().width('100%').height('100%')
       }
-      .height(this.currentBreakpoint !== BreakpointTypeEnum.SM?0:px2vp(AppUtil.getStatusBarHeight()))
+      .height(this.isPhoneLan()?0:px2vp(AppUtil.getStatusBarHeight()))
       .backgroundColor($r('app.color.title_bar_bg'))
       .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP])
       TitleBar({ model: $titleBarModel })

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

@@ -1,7 +1,7 @@
 import TitleBar from '../view/TitleBar'
 import { promptAction, router } from '@kit.ArkUI'
 import { CommonConstants } from '../common/constants/CommonConstants'
-import { AppUtil, FileUtil, MD5, PreferencesUtil, ToastUtil } from '@pura/harmony-utils'
+import { AppUtil, DeviceUtil, DisplayUtil, FileUtil, MD5, PreferencesUtil, ToastUtil } from '@pura/harmony-utils'
 import { CustomContentDialog } from '@kit.ArkUI'
 import ConfigurationConstant from '@ohos.app.ability.ConfigurationConstant';
 import common from '@ohos.app.ability.common';
@@ -9,6 +9,7 @@ import { photoAccessHelper } from '@kit.MediaLibraryKit'
 import { fileIo, fileUri } from '@kit.CoreFileKit'
 import { BusinessError, emitter } from '@kit.BasicServicesKit'
 import { BreakpointTypeEnum } from '../common/util/BreakpointSystem'
+import { resourceManager } from '@kit.LocalizationKit'
 
 @Preview
 @Entry
@@ -55,6 +56,7 @@ export struct SettingPage {
   static readonly IS_SHOW_FAV: string = 'isShowFAV';
   static readonly IS_SHOW_HISTORY: string = 'isShowHistory';
   static readonly IS_CUSTOMIZE_BG: string = 'is_customize_bg';
+  static readonly IS_GRID_MUSIC: string = 'is_grid_music';
   static readonly IS_CUSTOMIZE_BG_PATH: string = 'is_customize_bg_path';
   /** 当前断点类型（如大屏/小屏） */
   @StorageProp('currentBreakpoint') currentBreakpoint: string = BreakpointTypeEnum.MD;
@@ -177,12 +179,24 @@ export struct SettingPage {
     context.getApplicationContext().setColorMode(colorMode)
   }
 
+  //是不是手机横屏
+  isPhoneLan() {
+    if (DeviceUtil.getDeviceType() === resourceManager.DeviceType.DEVICE_TYPE_PHONE
+      && this.currentBreakpoint !== BreakpointTypeEnum.SM) {
+      if (DisplayUtil.getFoldStatus() === 0 || DisplayUtil.getFoldStatus() === 2) {
+        return true
+      }
+    }
+
+    return false
+  }
+
   build() {
     Column() {
       Column(){
         Line().width('100%').height('100%')
       }
-      .height(this.currentBreakpoint !== BreakpointTypeEnum.SM?0:px2vp(AppUtil.getStatusBarHeight()))
+      .height(this.isPhoneLan()?0:px2vp(AppUtil.getStatusBarHeight()))
       .backgroundColor($r('app.color.title_bar_bg'))
       .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP])
       TitleBar({ model: $titleBarModel })
@@ -261,6 +275,7 @@ export struct SettingPage {
                 .bindSheet($$this.isCustomizeBgSheet, this.customizeBgSheet(), {
                   height: '90%',
                   dragBar: true,
+                  preferType: this.currentBreakpoint!==BreakpointTypeEnum.SM?SheetType.CENTER:SheetType.BOTTOM,
                   showClose: true,
                   blurStyle: BlurStyle.Thin,
                   backgroundColor: Color.Transparent,
@@ -519,7 +534,7 @@ export struct SettingPage {
         .justifyContent(FlexAlign.Start)
       }
       .scrollBar(BarState.Auto)
-      .height('100%')
+      .height(px2vp(DisplayUtil.getHeight()-AppUtil.getStatusBarHeight()-AppUtil.getNavigationIndicatorHeight()))
       .width('100%')
       .margin({bottom:10})
       .backgroundColor($r('app.color.settings_background'))

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

@@ -5,7 +5,10 @@ import { CommonConstants } from '../common/constants/CommonConstants';
 import { AES,
   AppUtil,
   Base64Util,
-  CryptoHelper, DateUtil, FileUtil, LogUtil, PreferencesUtil,
+  CryptoHelper, DateUtil,
+  DeviceUtil,
+  DisplayUtil,
+  FileUtil, LogUtil, PreferencesUtil,
   RandomUtil,
   StrUtil,
   ToastUtil } from '@pura/harmony-utils';
@@ -28,6 +31,7 @@ import { bundleManager } from '@kit.AbilityKit';
 import { cryptoFramework } from '@kit.CryptoArchitectureKit';
 import { JSON } from '@kit.ArkTS';
 import { BreakpointTypeEnum } from '../common/util/BreakpointSystem';
+import { resourceManager } from '@kit.LocalizationKit';
 
 const context = getContext(this) as common.UIAbilityContext;
 @Preview
@@ -115,6 +119,19 @@ export  struct  VipPage{
     this.wxEventHandler.unregisterOnWXRespCallback(this.onWXResp)
   }
 
+
+  //是不是手机横屏
+  isPhoneLan() {
+    if (DeviceUtil.getDeviceType() === resourceManager.DeviceType.DEVICE_TYPE_PHONE
+      && this.currentBreakpoint !== BreakpointTypeEnum.SM) {
+      if (DisplayUtil.getFoldStatus() === 0 || DisplayUtil.getFoldStatus() === 2) {
+        return true
+      }
+    }
+
+    return false
+  }
+
   build() {
 
 
@@ -122,7 +139,7 @@ export  struct  VipPage{
       Column(){
         Line().width('100%').height('100%')
       }
-      .height(this.currentBreakpoint !== BreakpointTypeEnum.SM?0:px2vp(AppUtil.getStatusBarHeight()))
+      .height(this.isPhoneLan()?0:px2vp(AppUtil.getStatusBarHeight()))
       .backgroundColor($r('app.color.title_bar_bg'))
       .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP])
       TitleBar({ model: $titleBarModel })
@@ -451,6 +468,7 @@ export  struct  VipPage{
             height:'85%',
             dragBar: true,
             showClose: true,
+            preferType: this.currentBreakpoint!==BreakpointTypeEnum.SM?SheetType.CENTER:SheetType.BOTTOM,
             backgroundColor:Color.White,
             title: { title: $r('app.string.persion_duty') }
           })
@@ -485,7 +503,7 @@ export  struct  VipPage{
         right: this.currentBreakpoint !== BreakpointTypeEnum.SM?15:0 })
       }
       .scrollBar(BarState.Auto)
-      .height('100%')
+      .height(px2vp(DisplayUtil.getHeight()-AppUtil.getStatusBarHeight()-AppUtil.getNavigationIndicatorHeight()))
       .alignSelf(ItemAlign.Start)
       .width('100%')
     }

entry/src/main/ets/pages/WebIndex.ets

@@ -1,11 +1,12 @@
 import TitleBar from '../view/TitleBar'
 import { router } from '@kit.ArkUI'
 import { webview } from '@kit.ArkWeb';
-import { AppUtil, NetworkUtil, ToastUtil } from '@pura/harmony-utils';
+import { AppUtil, DeviceUtil, DisplayUtil, NetworkUtil, ToastUtil } from '@pura/harmony-utils';
 import { ConfigurationConstant } from '@kit.AbilityKit';
 import { Utility } from '../common/util/Utility';
 import { BreakpointTypeEnum } from '../common/util/BreakpointSystem';
 import { CommonConstants } from '../common/constants/CommonConstants';
+import { resourceManager } from '@kit.LocalizationKit';
 
 
 @Entry
@@ -62,12 +63,24 @@ struct  WebIndex{
     this.onColorModeChange()
   }
 
+  //是不是手机横屏
+  isPhoneLan() {
+    if (DeviceUtil.getDeviceType() === resourceManager.DeviceType.DEVICE_TYPE_PHONE
+      && this.currentBreakpoint !== BreakpointTypeEnum.SM) {
+      if (DisplayUtil.getFoldStatus() === 0 || DisplayUtil.getFoldStatus() === 2) {
+        return true
+      }
+    }
+
+    return false
+  }
+
   build() {
     Column(){
       Column(){
         Line().width('100%').height('100%')
       }
-      .height(this.currentBreakpoint !== BreakpointTypeEnum.SM?0:px2vp(AppUtil.getStatusBarHeight()))
+      .height(this.isPhoneLan()?0:px2vp(AppUtil.getStatusBarHeight()))
       .backgroundColor($r('app.color.title_bar_bg'))
       .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP])
       TitleBar({model:$titleBarModel})

entry/src/main/ets/view/LocalMusic.ets

@@ -170,6 +170,7 @@ export struct LocalMusic {
   @State isShowFAV:boolean = true //是否显示我的收藏
   @State isShowHistory:boolean = true //是否显示最近播放
   @State isCustomizeBg: boolean = false //自定义背景界面
+  @State isGridMusic: boolean = false //是否网格布局
   @State customizeBgPath: string | undefined = '';
   @State isDarkMode: boolean = false
   @StorageProp('currentColorMode') @Watch('onColorModeChange') currentMode: number =
@@ -362,6 +363,7 @@ export struct LocalMusic {
     this.sortType = PreferencesUtil.getNumberSync(SettingPage.SORT_TYPE, 4)
     this.isCustomizeBg  = PreferencesUtil.getBooleanSync(SettingPage.IS_CUSTOMIZE_BG, false)
     this.customizeBgPath  = PreferencesUtil.getStringSync(SettingPage.IS_CUSTOMIZE_BG_PATH, '')
+    this.isGridMusic = PreferencesUtil.getBooleanSync(SettingPage.IS_GRID_MUSIC, false)
     if(this.isCustomizeBg){
       this.titleBarModel.setRightTitleStateNormalStyleColor(Color.Transparent)
       this.titleBarModel.setTitleBarBackground(Color.Transparent)
@@ -718,10 +720,11 @@ export struct LocalMusic {
         let item: VideoItem =
           new VideoItem(this.fileList[i].toString(), this.fileList[i].toString(), path, CommonConstants.TYPE_IS_DIR, 0,
             '')
-
-        directories.push(item);
-        directories.sort((a, b) => a.cTime.localeCompare(b.cTime));
-        Utility.doSortListAscending(directories)
+        if(this.isShowDir(item.name)){
+          directories.push(item);
+        }
+        // directories.sort((a, b) => a.cTime.localeCompare(b.cTime));
+        // Utility.doSortListAscending(directories)
 
       } else {
         if (this.currentPath === this.lockPath) {
@@ -1411,7 +1414,7 @@ export struct LocalMusic {
   async callFilePickerSelectFile(): Promise<void> {
     try {
       let DocumentSelectOptions = new picker.DocumentSelectOptions();
-      // DocumentSelectOptions.multiAuthMode = true
+      DocumentSelectOptions.multiAuthMode = true
       DocumentSelectOptions.fileSuffixFilters = CommonConstants.MEDIA_FORMAT
       let documentPicker = new picker.DocumentViewPicker();
       documentPicker.select(DocumentSelectOptions).then((DocumentSelectResult) => {
@@ -1716,7 +1719,7 @@ export struct LocalMusic {
         Column(){
           Line().width('100%').height('100%')
         }
-        .height(this.currentBreakpoint !== BreakpointTypeEnum.SM?0:px2vp(AppUtil.getStatusBarHeight()))
+        .height(this.isPhoneLan()?0:px2vp(AppUtil.getStatusBarHeight()))
         .backgroundColor(this.isCustomizeBg?Color.Transparent:$r('app.color.title_bar_bg'))
         .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP])
         TitleBar({ model: $titleBarModel })
@@ -1752,6 +1755,7 @@ export struct LocalMusic {
           Column() {
             this.tabTitle()
             this.listViewTitle()
+            this.getGridView()
             this.getListView()
 
           }
@@ -2335,8 +2339,8 @@ export struct LocalMusic {
                 });
             }
             .layoutWeight(1)
-            .margin({ left: this.currentBreakpoint !== BreakpointTypeEnum.SM?35:5,
-              right: this.currentBreakpoint !== BreakpointTypeEnum.SM?35:5, bottom: 1 });
+            .margin({ left: this.currentBreakpoint !== BreakpointTypeEnum.SM?50:5,
+              right: this.currentBreakpoint !== BreakpointTypeEnum.SM?50:5, bottom: 1 });
           });
         }
         .width('100%')
@@ -2692,6 +2696,241 @@ export struct LocalMusic {
     this.dataSource.pushArrayData(this.videoLocalList)
   }
 
+  // Grid布局的开始
+  private dragRefOffSetX: number = 0;
+  private dragRefOffSetY: number = 0;
+  private FIX_VP_X: number = 180;
+  private FIX_VP_Y: number = 84;
+
+  isDraggable(index: number): boolean {
+    return index >= 0;
+  }
+  getRowEnd(item: number) {
+    if (item.toString() === '0') {
+      return 1;
+    } else {
+      return 0;
+    }
+  }
+
+  // [Start itemMove_start]
+  // itemMoveGrid(index: number, newIndex: number): void {
+  //   if (!this.isDraggable(newIndex)) {
+  //     return;
+  //   }
+  //   let tmp = this.videoLocalList.splice(index, 1);
+  //   this.videoLocalList.splice(newIndex, 0, tmp[0]);
+  //   // this.bigItemIndex = this.videoLocalList.findIndex((item) => item === 0);
+  // }
+
+  isInLeft(index: number) {
+    return index % 2 == 0;
+  }
+  down(index: number): void {
+    if ([this.videoLocalList.length - 1, this.videoLocalList.length - 2].includes(index)) {
+      return;
+    }
+
+    this.offsetY -= this.FIX_VP_Y;
+    this.dragRefOffSetY += this.FIX_VP_Y;
+    this.itemMove(index, index + 1);
+
+  }
+
+  up(index: number): void {
+    if (!this.isDraggable(index - 2)) {
+      return;
+    }
+    this.offsetY += this.FIX_VP_Y;
+    this.dragRefOffSetY -= this.FIX_VP_Y;
+    this.itemMove(index, index - 1);
+
+  }
+
+  left(index: number): void {
+
+    if (this.isInLeft(index)) {
+      return;
+    }
+    if (!this.isDraggable(index - 1)) {
+      return;
+    }
+    this.offsetX += this.FIX_VP_X;
+    this.dragRefOffSetX -= this.FIX_VP_X;
+    this.itemMove(index, index - 1)
+  }
+
+  right(index: number): void {
+    if (!this.isInLeft(index)) {
+      return;
+    }
+    if (!this.isDraggable(index + 1)) {
+      return;
+    }
+    this.offsetX -= this.FIX_VP_X;
+    this.dragRefOffSetX += this.FIX_VP_X;
+    this.itemMove(index, index + 1)
+  }
+
+  @Builder
+  getGridView(){
+
+    Grid() {
+      LazyForEach(this.dataSource, (item: VideoItem, index: number) => {
+        GridItem() {
+          Stack({ alignContent: Alignment.TopEnd }) {
+            this.MusicItemGrid(item,index)
+
+          }
+        }
+        .rowStart(0)
+        .rowEnd(this.getRowEnd(index))
+        .scale({ x: this.scaleItem === index ? 1.02 : 1, y: this.scaleItem === index ? 1.02 : 1 })
+        .zIndex(this.dragItem === index ? 1 : 0)
+        .translate(this.dragItem === index ? { x: this.offsetX, y: this.offsetY } : { x: 0, y: 0 })
+        .hitTestBehavior(this.isDraggable(this.videoLocalList.indexOf(item)) ? HitTestMode.Default : HitTestMode.None)
+        //长按拖动代码
+        .gesture(
+          GestureGroup(GestureMode.Sequence,
+            LongPressGesture({ repeat: true })
+              .onAction(() => {
+                this.getUIContext().animateTo({ curve: Curve.Friction, duration: 300 }, () => {
+                  this.scaleItem = index;
+                })
+              })
+              .onActionEnd(() => {
+                this.getUIContext().animateTo({ curve: Curve.Friction, duration: 300 }, () => {
+                  this.scaleItem = -1;
+                })
+              }),
+            PanGesture({ fingers: 1, direction: null, distance: 0 })
+              .onActionStart(() => {
+                this.dragItem = index;
+                this.dragRefOffSetX = 0;
+                this.dragRefOffSetY = 0;
+              })
+              .onActionUpdate((event: GestureEvent) => {
+                this.offsetX = event.offsetX - this.dragRefOffSetX;
+                this.offsetY = event.offsetY - this.dragRefOffSetY;
+                this.getUIContext().animateTo({ curve: curves.interpolatingSpring(0, 1, 400, 38) }, () => {
+                  let index = this.videoLocalList.indexOf(item);
+                  if (this.offsetY >= this.FIX_VP_Y / 2 && (this.offsetX <= 44 && this.offsetX >= -44)) {
+                    this.down(index);
+                  } else if (this.offsetY <= -this.FIX_VP_Y / 2 && (this.offsetX <= 44 && this.offsetX >= -44)) {
+                    this.up(index);
+                  } else if (this.offsetX >= this.FIX_VP_X / 2 && (this.offsetY <= 50 && this.offsetY >= -50)) {
+                    this.right(index);
+                  } else if (this.offsetX <= -this.FIX_VP_Y / 2 && (this.offsetY <= 50 && this.offsetY >= -50)) {
+                    this.left(index);
+                  }
+                })
+              })
+              .onActionEnd(() => {
+                this.getUIContext().animateTo({ curve: curves.interpolatingSpring(0, 1, 400, 38) }, () => {
+                  this.dragItem = -1;
+                })
+                this.getUIContext().animateTo({ curve: curves.interpolatingSpring(14, 1, 170, 17), delay: 150 }, () => {
+                  this.scaleItem = -1;
+                })
+              })
+          )
+            .onCancel(() => {
+              this.getUIContext().animateTo({ curve: curves.interpolatingSpring(0, 1, 400, 38) }, () => {
+                this.dragItem = -1;
+              })
+              this.getUIContext().animateTo({ curve: curves.interpolatingSpring(14, 1, 170, 17), delay: 150 }, () => {
+                this.scaleItem = -1;
+              })
+            })
+        )
+        // [End gesture_start]
+        // [EndExclude GridItem_start]
+      }, (item: VideoItem) => item.filePath)
+    }
+    .width('100%')
+    .height('100%')
+    .editMode(true)
+    .scrollBar(BarState.Off)
+    // .columnsTemplate('1fr 1fr')
+    .supportAnimation(true)
+    .columnsTemplate('1fr '.repeat(this.currentWidthBreakpoint === WidthBreakpoint.WIDTH_SM ? 2 : 4))
+    .columnsGap(12)
+    .rowsGap(12)
+    .visibility(this.isGridMusic?Visibility.Visible:Visibility.None)
+    .enableScrollInteraction(true)
+
+  }
+  @Builder
+  private MusicItemGrid(item: VideoItem, index?: number) {
+
+    Column() {
+      Image(StrUtil.isEmpty(item.pixelMapPath) ? $r('app.media.ic_avatar6') : item.pixelMapPath)
+        .height(150)
+        .width(150)
+        .alt($r('app.media.ic_avatar6'))
+        .borderRadius(20)
+        .clip(true)
+        .draggable(false)
+        .opacity(this.opacityItem)// 绑定透明度
+        .animation({ curve: Curve.Sharp, duration: 300 })
+        .margin({ left: this.currentBreakpoint !== BreakpointTypeEnum.SM?40:20 ,
+          right: this.currentBreakpoint !== BreakpointTypeEnum.SM?40:20})
+      Column() {
+
+        Column() {
+          Text(item.name)
+            .fontSize(14)
+            .maxLines(1)
+            .animation({
+              duration: 555,
+              curve: 'Linear',
+            })
+            .fontColor(this.currentSong?.filePath === item.filePath ? $r('app.color.title_bar_bg_text') :
+            $r('app.color.text_color'))
+            .margin({ left: 10 })
+          Row() {
+            Text(StrUtil.isEmpty(item.artist) ? item.cTime : item.artist + '  ' + item?.album)
+              .fontSize(11)
+              .padding({ top: 8 })
+              .fontColor(this.currentSong?.filePath === item.filePath ? $r('app.color.title_bar_bg_text') :
+              $r('app.color.text_color'))
+              .margin({ left: 10 })
+            Blank()
+            Text(item.size)
+              .fontSize(11)
+              .padding({ top: 8 })
+              .visibility(StrUtil.isEmpty(item.artist) ? Visibility.Visible : Visibility.None)
+              .fontColor(this.currentSong?.filePath === item.filePath ? $r('app.color.title_bar_bg_text') :
+              $r('app.color.text_color'))
+              .margin({ left: 10 })
+          }
+
+        }
+        .height('100%')
+        .width('100%')
+        .justifyContent(FlexAlign.Center)
+        .alignItems(HorizontalAlign.Start)
+
+      }
+      .layoutWeight(1)
+      .margin({ left: this.currentBreakpoint !== BreakpointTypeEnum.SM?40:20 ,
+        right: this.currentBreakpoint !== BreakpointTypeEnum.SM?40:20})
+    }
+    .width('100%')
+    .height(200)
+    .animation({ curve: Curve.Sharp, duration: 300 })
+    .justifyContent(FlexAlign.SpaceBetween)
+    .stateStyles({
+      pressed: { opacity: 0.6 } // 按压反馈
+    })
+    .onClick(() => {
+
+      this.doPlay(item, index)
+
+    })
+  }
+
+
   @Builder
   getListView() {
 
@@ -2850,6 +3089,7 @@ export struct LocalMusic {
     .cachedCount(30)
     .borderRadius(20)
     .layoutWeight(1)
+    .visibility(this.isGridMusic?Visibility.None:Visibility.Visible)
     .lanes(
       new BreakpointType<number>({
         sm: 1,
@@ -4214,7 +4454,8 @@ export struct LocalMusic {
           .width('100%')
           .margin({ top: 0 })
           .height(PlayConstants.HEIGHT)
-          .visibility(Visibility.None)
+          .visibility(DeviceUtil.getDeviceType()==resourceManager.DeviceType.DEVICE_TYPE_2IN1?
+              Visibility.Visible:Visibility.None)
 
           // .visibility(this.currentBreakpoint !== BreakpointTypeEnum.SM
           //   ?Visibility.Visible:Visibility.Visible)
@@ -4268,14 +4509,12 @@ export struct LocalMusic {
       .margin({ bottom: 8 })
 
     }
-    .backgroundImage(this.imageLabelBg)
-    .backgroundImageSize({ height: '150%', width: '100%' })
-
-    // .height('100%')
-    // .width('100%')
+    // .backgroundImage(this.imageLabelBg)
+    .backgroundImage(this.isPuraWP()?(StrUtil.isEmpty(this.cover) ? this.imageLabel : this.cover):this.imageLabelBg)
+    .backgroundImageSize(this.isPuraWP()?{ width: '100%' }:{ height: '150%', width: '100%' })
+    // .backgroundImagePosition(Alignment.Center)
     // .backgroundColor(this.imageColor)
-    // .backgroundBlurStyle(BlurStyle.BACKGROUND_REGULAR)
-    .backgroundBlurStyle(BlurStyle.BACKGROUND_ULTRA_THICK)
+    .backgroundBlurStyle(this.isPuraWP()?BlurStyle.NONE:BlurStyle.BACKGROUND_ULTRA_THICK)
 
     .hitTestBehavior(HitTestMode.Transparent)
     .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM])
@@ -4810,6 +5049,7 @@ export struct LocalMusic {
           .bindSheet($$this.isLyricSetting, this.lyricSettingSheet(), {
             height: this.isCoverOpacity() ? '95%' : '78%',
             dragBar: true,
+            preferType: this.currentBreakpoint!==BreakpointTypeEnum.SM?SheetType.CENTER:SheetType.BOTTOM,
             showClose: true,
             blurStyle: BlurStyle.Thin,
             backgroundColor: Color.Transparent,
@@ -4887,6 +5127,7 @@ export struct LocalMusic {
             .width(24)
             .bindSheet($$this.isShowMoreView, this.PlayMoreSheet(), {
               height: this.isCoverOpacity() ? '95%' : '93%',
+              preferType: this.currentBreakpoint!==BreakpointTypeEnum.SM?SheetType.CENTER:SheetType.BOTTOM,
               dragBar: true,
               showClose: true,
               blurStyle: BlurStyle.Thin,
@@ -5108,6 +5349,7 @@ export struct LocalMusic {
           .alt(this.imageLabel)
           .margin({ right: 30, left: 30, top: this.isCoverOpacity() || this.isCoverRectangle ? 0 : 10 })
           .aspectRatio(1)
+          .visibility(this.isPuraWP()?Visibility.None:Visibility.Visible)
           .borderRadius(this.isCoverRectangle ? 20 : '100%')
           .align(Alignment.Center)// .opacity(this.isCoverOpacity()||this.isCoverRectangle?0:1)
           .clip(true)
@@ -5131,14 +5373,15 @@ export struct LocalMusic {
 
         Column({ space: 8 }) {
           Text(this.name)
-            .fontSize(this.name.length >= 28 || this.isCoverOpacity() ? 18 : 22)
+            .fontSize(this.isPuraWP()?30:(this.name.length >= 28 || this.isCoverOpacity() ? 18 : 22))
             .fontWeight(FontWeight.Bold)
             .textOverflow({ overflow: TextOverflow.MARQUEE })//超长滚动
             .maxLines(1)
             .fontColor(Color.White)
           Text(this.artist)
-            .fontSize(this.isCoverOpacity() ? 12 : 15)
+            .fontSize(this.isPuraWP()?22:(this.isCoverOpacity() ? 12 : 15))
             .fontColor(Color.White)
+            .fontWeight(FontWeight.Bold)
         }
         .justifyContent(FlexAlign.Start)
         .zIndex(1)
@@ -5187,15 +5430,6 @@ export struct LocalMusic {
 
       })
 
-      // Text(this.multiple)
-      //   .fontSize(16)
-      //   .fontColor(Color.White)
-      //   .margin({ right:15 })
-      //   .visibility(this.isHide?Visibility.None:Visibility.Visible)
-      //   .id('xid')
-      //   .onClick(()=>{
-      //     this.showMultipleDialog('xid')
-      //   })
 
 
       Column() {
@@ -5728,8 +5962,9 @@ export struct LocalMusic {
                   this.doMore(more.id)
                 })
                 .bindSheet($$this.isShowDetailMore, this.detailSheet(), {
-                  height: this.isCoverOpacity() ? '95%' : '60%',
+                  height: this.isCoverOpacity() ? '95%' : '65%',
                   dragBar: true,
+                  preferType: this.currentBreakpoint!==BreakpointTypeEnum.SM?SheetType.CENTER:SheetType.BOTTOM,
                   showClose: true,
                   blurStyle: BlurStyle.Thin,
                   backgroundColor: Color.Transparent,
@@ -5753,9 +5988,10 @@ export struct LocalMusic {
                   this.doMore(more.id)
                 })
                 .bindSheet($$this.isShowEdit, this.editSheet(), {
-                  height: this.isCoverOpacity() ? '95%' : '88%',
+                  height: this.isCoverOpacity() ? '95%' : '93%',
                   dragBar: true,
                   showClose: true,
+                  preferType: this.currentBreakpoint!==BreakpointTypeEnum.SM?SheetType.CENTER:SheetType.BOTTOM,
                   // blurStyle:BlurStyle.Thin,
                   // backgroundColor:Color.Transparent,
                   title: { title: '编辑信息' }
@@ -5779,6 +6015,7 @@ export struct LocalMusic {
                 })
                 .bindSheet($$this.isShowTimeCloseMore, this.TimeCloseSheet(), {
                   height: this.isCoverOpacity() ? '95%' : '78%',
+                  preferType: this.currentBreakpoint!==BreakpointTypeEnum.SM?SheetType.CENTER:SheetType.BOTTOM,
                   dragBar: true,
                   showClose: true,
                   title: { title: $r('app.string.time_close') }
@@ -5816,6 +6053,7 @@ export struct LocalMusic {
                 .bindSheet($$this.isJumpSetting, this.JumpTopEndSheet(), {
                   height: this.isCoverOpacity() ? '95%' : '60%',
                   dragBar: true,
+                  preferType: this.currentBreakpoint!==BreakpointTypeEnum.SM?SheetType.CENTER:SheetType.BOTTOM,
                   showClose: true,
                   blurStyle: BlurStyle.Thin,
                   backgroundColor: Color.Transparent,