Grid网格功能的长按菜单实现

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

@@ -32,6 +32,7 @@ export struct SettingPage {
   @State isCustomizeBg: boolean = false //自定义背景界面
   @State isCustomizeBgSheet: boolean = false //自定义背景界面
   @State isGridMusic: boolean = false //是否网格布局
+  @State isScrollHide: boolean = false //是否滚动隐藏
   @State customizeBgPath: string | undefined = '';
   context = getContext(this);
 
@@ -59,6 +60,8 @@ export struct SettingPage {
   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';
+  static readonly IS_SCROLL_HIDE: string = 'isScrollHide';
+
   /** 当前断点类型（如大屏/小屏） */
   @StorageProp('currentBreakpoint') currentBreakpoint: string = BreakpointTypeEnum.MD;
 
@@ -149,6 +152,7 @@ export struct SettingPage {
     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)
+    this.isScrollHide = PreferencesUtil.getBooleanSync(SettingPage.IS_SCROLL_HIDE, false)
 
     // 只用 themeMode 控制主题
     this.themeMode = PreferencesUtil.getNumberSync(SettingPage.THEME_MODE, 0)
@@ -299,6 +303,30 @@ export struct SettingPage {
 
             Line().width('100%').height(0.3).backgroundColor($r('app.color.index_tab_unselected_font_color'))
 
+            // 滚动隐藏'
+            Row() {
+              Text('滚动隐藏')
+                .margin({ left: 18 })
+                .fontSize(15)
+                .fontColor(Color.Gray)
+                .fontWeight(480)
+                .layoutWeight(1)
+              Toggle({ type: ToggleType.Switch, isOn: this.isScrollHide })
+                .selectedColor($r('app.color.tab_item_bg'))
+                .switchPointColor(Color.White)
+                .margin({ right: 18 })
+                .onChange((checked: boolean) => {
+                  this.isScrollHide = checked;
+                  PreferencesUtil.put(SettingPage.IS_SCROLL_HIDE, this.isScrollHide)
+                  this.sendChangeEvent()
+                })
+                .width(50)
+                .height(30);
+            }
+            .height(55)
+
+            Line().width('100%').height(0.3).backgroundColor($r('app.color.index_tab_unselected_font_color'))
+
             // 显示私密音频
             Row() {
               Text('网格布局')

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

@@ -1,5 +1,5 @@
 import TitleBar from './TitleBar'
-import { Animator, curves, display, PromptAction, promptAction, router, window } from '@kit.ArkUI';
+import { Animator, curves, display, PromptAction, promptAction, router, SymbolGlyphModifier, window } from '@kit.ArkUI';
 import { VideoItem } from '../viewmodel/VideoItem';
 import {
   AppUtil,
@@ -2896,8 +2896,10 @@ export struct LocalMusic {
     })
 
   }
+
+  @State longItemFilePath:string=''
   @Builder
-  private MusicItemGrid(item: VideoItem, index?: number) {
+  private MusicItemGrid(item: VideoItem, index: number) {
 
     Stack() {
 
@@ -2934,17 +2936,19 @@ export struct LocalMusic {
           Column(){
             Text(`${this.artistMap.get(item.name)?.length ?? 0}首`)
               .fontSize(11)
-              .visibility(this.modeType===2?Visibility.Visible:Visibility.None)
+              .visibility(this.modeType===2&&!this.isCanBack?Visibility.Visible:Visibility.None)
               .fontColor($r('app.color.text_color'))
             Text(`${this.albumMap.get(item.name)?.length ?? 0}首`)
               .fontSize(11)
-              .visibility(this.modeType===3?Visibility.Visible:Visibility.None)
+              .visibility(this.modeType===3&&!this.isCanBack?Visibility.Visible:Visibility.None)
               .fontColor($r('app.color.text_color'))
             Text(StrUtil.isEmpty(item.artist) ? 'Unknown' : item.artist )
               .fontSize(11)
               .maxLines(1)
               .margin({top:2})
-              .visibility(item.type==CommonConstants.TYPE_IS_DIR?Visibility.None:Visibility.Visible)
+              .visibility(item.type==CommonConstants.TYPE_IS_ARTIST
+                ||item.type==CommonConstants.TYPE_IS_ALBUM
+                ||item.type==CommonConstants.TYPE_IS_DIR?Visibility.None:Visibility.Visible)
               .fontWeight(FontWeight.Medium)
               .fontColor(this.currentSong?.filePath === item.filePath ? $r('app.color.title_bar_bg_text') :
               $r('app.color.text_color'))
@@ -2953,6 +2957,29 @@ export struct LocalMusic {
           .alignItems(HorizontalAlign.Center) // 关键：使内容水平居中
 
         }
+        .bindPopup(this.longItemFilePath === item.filePath, {
+          builder: this.MenuBuilder(item,index,item.filePath),
+          placement: Placement.Top,
+          autoCancel: true,
+          mask: {color:'#33000000'},
+          // popupColor: Color.Yellow,
+          enableArrow: false,//是否显示箭头
+          showInSubWindow: true,
+          onStateChange: (e) => {
+            if (!e.isVisible) {
+              this.longItemFilePath = ''
+            }
+          }
+        })
+
+        .gesture(LongPressGesture()
+          .onAction(() => {
+            this.longItemFilePath = item.filePath
+        })
+          .onActionEnd((event: GestureEvent) => {
+
+          })
+        )
         .height(50)
         .width(150)
         .justifyContent(FlexAlign.Center)
@@ -2999,6 +3026,85 @@ export struct LocalMusic {
   }
 
 
+  @Builder
+  MenuBuilder(item: VideoItem,index: number,filePath:string) {
+    Flex({ direction: FlexDirection.Column, justifyContent: FlexAlign.Center, alignItems: ItemAlign.Center }) {
+      Menu() {
+        MenuItem({
+          symbolStartIcon: new SymbolGlyphModifier(Utility.getIsFav(this.favList,item)?$r('sys.symbol.heart_fill'):$r('sys.symbol.heart')),
+          // startIcon: Utility.getIsFav(this.favList,item)?$r('app.media.add_fac_light2'):$r('app.media.add_fac')
+          content: '收藏' })
+          .onClick(() => {
+            if(item){
+              this.doFav(item)
+            }
+            this.longItemFilePath = ''
+
+        })
+        MenuItem({ symbolStartIcon: new SymbolGlyphModifier($r('sys.symbol.forward_end_fill')),
+          content: '下一首播放' })
+          .onClick(() => {
+            this.addToNextPlay(item);
+            this.longItemFilePath = ''
+        })
+
+        MenuItem({
+          symbolStartIcon: new SymbolGlyphModifier($r('sys.symbol.picture_2')),
+          content: $r('app.string.copy')
+        })
+          .visibility(item.type === CommonConstants.TYPE_IS_DIR ? Visibility.None : Visibility.Visible)
+          .onClick(() => {
+            this.showCopyDialog(false, item, index, filePath + 'copy');
+            this.longItemFilePath = ''
+          })
+        MenuItem({
+          symbolStartIcon: new SymbolGlyphModifier($r('sys.symbol.cut')),
+          content: $r('app.string.cut')
+        })
+          .visibility(item.type === CommonConstants.TYPE_IS_DIR ? Visibility.None : Visibility.Visible)
+          .onClick(() => {
+            this.showCutDialog(false, item, index, filePath);
+            this.longItemFilePath = ''
+          })
+        MenuItem({
+          symbolStartIcon: new SymbolGlyphModifier($r('sys.symbol.rename')),
+          content: $r('app.string.rename')
+        })
+          .visibility(item.type === CommonConstants.TYPE_IS_DIR ?
+            (item.name === LocalMusic.STR_LOCK_VIDEO || item.name === LocalMusic.STR_FAC_VIDEO ||
+              item.name === LocalMusic.STR_HISTORY_MUSIC ? Visibility.None : Visibility.Visible) : Visibility.Visible)
+          .onClick(() => {
+            this.showReNameDialog(item, index + '', filePath)
+            this.longItemFilePath = ''
+          })
+        MenuItem({
+          symbolStartIcon: new SymbolGlyphModifier($r('sys.symbol.trash')),
+          content: $r('app.string.delete')
+        })
+          .visibility(item.type === CommonConstants.TYPE_IS_DIR ?
+            (item.name === LocalMusic.STR_LOCK_VIDEO || item.name === LocalMusic.STR_FAC_VIDEO ||
+              item.name === LocalMusic.STR_HISTORY_MUSIC ? Visibility.None : Visibility.Visible) : Visibility.Visible)
+          .onClick(() => {
+            this.showWarnIsDeleteFile(item, index + '', filePath)
+            this.longItemFilePath = ''
+          })
+        MenuItem({
+          symbolStartIcon: new SymbolGlyphModifier($r('sys.symbol.share')),
+          content: $r('app.string.share')
+        })
+          .visibility(item.type === CommonConstants.TYPE_IS_DIR ? Visibility.None : Visibility.Visible)
+          .onClick(() => {
+            Utility.doShareMusic(item, getContext(this) as common.UIAbilityContext)
+            this.longItemFilePath = ''
+          })
+      }.font({ size: 15, weight: FontWeight.Normal })
+    }
+    .width(180)
+    .height('40%')
+
+  }
+
+
   @Builder
   getListView() {
 

entry/src/main/module.json5

@@ -59,7 +59,12 @@
                 "utd": "general.audio",
                 "linkFeature": "FileOpen",
               },
-
+              {
+                "scheme": "file",
+                "type": "audio/*",
+                "linkFeature": "FileOpen",
+                "maxFileSupported": 1
+              }
             ],
             "entities": [
               "entity.system.home"

entry/src/main/resources/base/element/string.json

@@ -403,6 +403,30 @@
     {
       "name": "share_tt",
       "value": "分享应用"
+    },
+    {
+      "name": "copy",
+      "value": "复制"
+    },
+    {
+      "name": "next_to_play",
+      "value": "下一首播放"
+    },
+    {
+      "name": "cut",
+      "value": "剪切"
+    },
+    {
+      "name": "delete",
+      "value": "删除"
+    },
+    {
+      "name": "share",
+      "value": "分享"
+    },
+    {
+      "name": "rename",
+      "value": "重命名"
     }
   ]
 }