|
|
@@ -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)
|