Sfoglia il codice sorgente

增加均衡器的 编辑自定义均衡器的功能

onecold 6 mesi fa
parent
commit
3896170903
1 ha cambiato i file con 314 aggiunte e 2 eliminazioni
  1. 314 2
      entry/src/main/ets/view/EqualizerView.ets

+ 314 - 2
entry/src/main/ets/view/EqualizerView.ets

@@ -342,6 +342,9 @@ export struct EqualizerViewWithCallback {
   @State private gains: number[] = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
   @State private presets: EqualizerPreset[] = [];
   @State private selectedPresetIndex: number = 0;
+  @State private showCustomPresets: boolean = false;  // 是否显示自定义预设列表
+  @State private isEditMode: boolean = false;  // 是否处于编辑模式
+  @State private selectedPresets: Set<string> = new Set<string>();  // 选中的预设ID集合
 
   // 回调函数
   onEqualizerChanged: () => void = () => {};
@@ -469,6 +472,275 @@ export struct EqualizerViewWithCallback {
     return '正常';
   }
 
+  // 获取自定义预设列表
+  private getCustomPresets(): EqualizerPreset[] {
+    const customPresets: EqualizerPreset[] = [];
+    for (let i = 0; i < this.presets.length; i++) {
+      if (this.presets[i].isCustom) {
+        customPresets.push(this.presets[i]);
+      }
+    }
+    return customPresets;
+  }
+
+  // 切换自定义预设列表显示
+  private toggleCustomPresets(): void {
+    this.showCustomPresets = !this.showCustomPresets;
+    // 切换显示时退出编辑模式
+    if (!this.showCustomPresets) {
+      this.isEditMode = false;
+      this.selectedPresets.clear();
+    }
+  }
+
+  // 切换编辑模式
+  private toggleEditMode(): void {
+    this.isEditMode = !this.isEditMode;
+    if (!this.isEditMode) {
+      this.selectedPresets.clear();
+    }
+  }
+
+  // 切换预设选中状态
+  private togglePresetSelection(presetId: string): void {
+    if (this.selectedPresets.has(presetId)) {
+      this.selectedPresets.delete(presetId);
+    } else {
+      this.selectedPresets.add(presetId);
+    }
+    // 触发UI更新
+    this.selectedPresets = new Set(this.selectedPresets);
+  }
+
+  // 删除选中的预设
+  private deleteSelectedPresets(): void {
+    const that = this;
+    if (this.selectedPresets.size === 0) {
+      ToastUtil.showToast('请先选择要删除的预设');
+      return;
+    }
+
+    const deleteCount = this.selectedPresets.size;
+
+    // 显示确认对话框
+    DialogHelper.showAlertDialog({
+      title: '确认删除',
+      content: `确定要删除选中的 ${deleteCount} 个自定义预设吗?`,
+      primaryButton: '取消',
+      secondaryButton: '删除',
+      maskColor: Color.Transparent,
+      onAction: (action: DialogAction) => {
+        if (action === DialogAction.TWO) {
+          // 执行删除
+          const presetIds = Array.from(that.selectedPresets);
+          let successCount = 0;
+
+          for (let i = 0; i < presetIds.length; i++) {
+            if (that.equalizerManager.deleteCustomPreset(presetIds[i])) {
+              successCount++;
+            }
+          }
+
+          // 刷新预设列表
+          that.presets = that.equalizerManager.getAllPresets();
+          that.selectedPresets.clear();
+          that.isEditMode = false;
+
+          // 如果删除的是当前预设,切换到正常预设
+          const currentPreset = that.presets.find((preset: EqualizerPreset) => preset.id === that.currentPresetId);
+          if (!currentPreset) {
+            that.equalizerManager.setPreset('normal');
+            that.currentPresetId = 'normal';
+            that.gains = that.equalizerManager.getCurrentGains();
+            that.updateSelectedPresetIndex();
+          }
+
+          that.notifyChange();
+          ToastUtil.showToast(`已删除 ${successCount} 个预设`);
+        }
+      }
+    });
+  }
+
+  // 应用自定义预设
+  private applyCustomPreset(preset: EqualizerPreset): void {
+    this.currentPresetId = preset.id;
+    this.equalizerManager.setPreset(preset.id);
+    this.gains = this.equalizerManager.getCurrentGains();
+    this.updateSelectedPresetIndex();
+    this.notifyChange();
+    ToastUtil.showToast(`已应用: ${preset.name}`);
+  }
+
+  @Builder
+  private CustomPresetsList(): void {
+    Column() {
+      // 标题栏
+      Row() {
+        Text(`自定义预设 (${this.getCustomPresets().length})`)
+          .fontSize(14)
+          .fontColor($r('app.color.text_color'))
+          .fontWeight(500)
+
+        Blank()
+
+        // 编辑按钮
+        if (this.getCustomPresets().length > 0) {
+          if (this.isEditMode) {
+            // 完成按钮
+            Button('完成')
+              .fontSize(13)
+              .fontColor(this.themeColor)
+              .backgroundColor(Color.Transparent)
+              .height(32)
+              .padding({ left: 12, right: 12 })
+              .onClick(() => this.toggleEditMode())
+          } else {
+            // 编辑按钮
+            Button('编辑')
+              .fontSize(13)
+              .fontColor(this.themeColor)
+              .backgroundColor(Color.Transparent)
+              .height(32)
+              .padding({ left: 12, right: 12 })
+              .onClick(() => this.toggleEditMode())
+          }
+        }
+      }
+      .width('100%')
+      .padding({ left: 16, right: 16, top: 12, bottom: 12 })
+
+      // 列表内容
+      if (this.getCustomPresets().length > 0) {
+        ForEach(this.getCustomPresets(), (preset: EqualizerPreset) => {
+          Button({ type: ButtonType.Capsule, stateEffect: true }) {
+            Row() {
+              // 选中状态指示器
+              if (this.isEditMode) {
+                Checkbox()
+                  .select(this.selectedPresets.has(preset.id))
+                  .selectedColor(this.themeColor)
+                  .onChange((isSelected: boolean) => {
+                    this.togglePresetSelection(preset.id);
+                  })
+                  .margin({ right: 12 })
+              } else {
+                SymbolGlyph($r('sys.symbol.slider_horizontal_2'))
+                  .fontSize(20)
+                  .fontColor([this.themeColor])
+                  .margin({ right: 12 })
+              }
+
+              // 预设名称
+              Text(preset.name)
+                .fontSize(14)
+                .fontColor($r('app.color.text_color'))
+                .layoutWeight(1)
+
+              // 当前预设标记
+              if (this.currentPresetId === preset.id) {
+                Text('当前')
+                  .fontSize(11)
+                  .fontColor(this.themeColor)
+                  .padding({ left: 8, right: 8, top: 2, bottom: 2 })
+                  .borderRadius(4)
+                  .backgroundColor(this.isDarkMode ? '#1A1A1A' : '#F5F5F5')
+                  .margin({ right: 8 })
+              }
+
+              // 应用按钮
+              if (!this.isEditMode) {
+                Button('应用')
+                  .fontSize(12)
+                  .fontColor(this.themeColor)
+                  .backgroundColor(Color.Transparent)
+                  .border({ width: 1, color: this.themeColor, radius: 12 })
+                  .height(28)
+                  .padding({ left: 16, right: 16 })
+                  .onClick(() => this.applyCustomPreset(preset))
+              }
+            }
+            .padding({ left: 16, right: 16, top: 10, bottom: 10 })
+            .backgroundColor(this.selectedPresets.has(preset.id) && this.isEditMode ?
+              (this.isDarkMode ? '#2A2A2A' : '#F0F0F0') : Color.Transparent)
+          }
+          .backgroundColor(Color.Transparent)
+          .clickEffect({ level: ClickEffectLevel.MIDDLE,scale:0.8 })
+          .width('100%')
+          .gesture(
+            LongPressGesture({ repeat: false })
+              .onAction(() => {
+                if (!this.isEditMode) {
+                  this.toggleEditMode();
+                }
+              })
+          )
+          .margin({ left: 16, right: 16, bottom: 8 })
+        })
+
+        // 删除按钮和取消按钮
+        if (this.isEditMode) {
+          Row() {
+            // 取消按钮
+            Button('取消', { type: ButtonType.Capsule, stateEffect: true })
+              .fontSize(14)
+              .fontColor(this.themeColor)
+              .backgroundColor(Color.Transparent)
+              .border({ width: 1, color: this.themeColor, radius: 20 })
+              .height(40)
+              .layoutWeight(1)
+              .onClick(() => {
+                this.isEditMode = false;
+                this.selectedPresets.clear();
+              })
+
+            Blank().width(12)
+
+            // 删除按钮
+            Button(`删除${this.selectedPresets.size > 0 ? ` (${this.selectedPresets.size})` : ''}`, { type: ButtonType.Capsule, stateEffect: true })
+              .fontSize(14)
+              .fontColor(Color.White)
+              .backgroundColor(Color.Red)
+              .borderRadius(20)
+              .height(40)
+              .layoutWeight(1)
+              .enabled(this.selectedPresets.size > 0)
+              .opacity(this.selectedPresets.size > 0 ? 1 : 0.5)
+              .onClick(() => this.deleteSelectedPresets())
+          }
+          .width('100%')
+          .padding({ left: 16, right: 16, top: 12, bottom: 16 })
+        }
+      } else {
+        // 空状态
+        Column() {
+          SymbolGlyph($r('sys.symbol.music_note_phone'))
+            .fontSize(40)
+            .fontColor([Color.Gray])
+            .margin({ bottom: 12 })
+
+          Text('暂无自定义预设')
+            .fontSize(14)
+            .fontColor(Color.Gray)
+
+          Text('保存当前的均衡器设置后即可显示')
+            .fontSize(12)
+            .fontColor(Color.Gray)
+            .margin({ top: 4 })
+        }
+        .width('100%')
+        .padding({ top: 40, bottom: 40 })
+        .alignItems(HorizontalAlign.Center)
+      }
+    }
+    .animation({
+      duration: 500,
+      curve: Curve.Friction  // 可选动画曲线
+    })
+    .visibility(this.showCustomPresets?Visibility.Visible:Visibility.None)
+    .width('100%')
+  }
+
   @Builder
   private PresetSelector(): void {
     Row() {
@@ -512,7 +784,7 @@ export struct EqualizerViewWithCallback {
           reverse: true
         })
           .width(24)
-          .height(120)
+          .height(140)
           .selectedColor(this.themeColor)
           .trackColor(this.isDarkMode ? '#333333' : '#E0E0E0')
           .blockColor(this.themeColor)
@@ -522,7 +794,7 @@ export struct EqualizerViewWithCallback {
             this.onGainChange(index, Math.round(value));
           })
       }
-      .height(130)
+      .height(150)
 
       Text(band.label)
         .fontSize(9)
@@ -632,6 +904,46 @@ export struct EqualizerViewWithCallback {
         this.EqualizerSliders()
 
         this.ActionButtons()
+
+        // 编辑自定义均衡器按钮
+        Row() {
+          Button({ type: ButtonType.Capsule, stateEffect: true }) {
+            Row() {
+              SymbolGlyph($r('sys.symbol.slider_vertical_3'))// .size({ width: 22, height: 22 })
+                .fontSize(22)
+                .fontColor([this.themeColor])
+                .effectStrategy(SymbolEffectStrategy.HIERARCHICAL)
+                .alignSelf(ItemAlign.Center)
+                .margin({ left: 15 })
+              Text('编辑自定义均衡器')
+                .margin({ left: 10, right: 20 })
+                .fontSize(15)
+                .fontColor( this.themeColor)
+                .fontWeight(480)
+              Blank()
+              // 右侧箭头
+              Image($r('app.media.arrow_right'))
+                .width(22)
+                .height(22)
+                .margin({ left: 12, right: 15 })
+                .align(Alignment.Center)
+            }
+            .width('100%')
+            .height(50)
+          }
+          .backgroundColor(Color.Transparent)
+          .border({ width: 1, color: this.themeColor, radius: 10 })
+          .height(50)
+          .width('100%')
+          .onClick(() => this.toggleCustomPresets())
+        }
+        .width('100%')
+        .padding({ left: 12, right: 12, bottom: 12 })
+
+        // 自定义预设列表
+
+        this.CustomPresetsList()
+
       } else {
         Text('开启均衡器后可调节音效')
           .fontSize(13)