|
|
@@ -0,0 +1,646 @@
|
|
|
+/**
|
|
|
+ * 均衡器视图组件
|
|
|
+ * 提供均衡器设置的 UI 界面
|
|
|
+ */
|
|
|
+import { ToastUtil } from '@pura/harmony-utils';
|
|
|
+import { emitter } from '@kit.BasicServicesKit';
|
|
|
+import { EqualizerManager, EqualizerBand, EqualizerPreset } from '../common/util/EqualizerManager';
|
|
|
+import { EventConstants } from '../common/constants/EventConstants';
|
|
|
+import { AnimationHelper, DialogAction, DialogHelper } from '@pura/harmony-dialog';
|
|
|
+import Logger from '../common/util/Logger';
|
|
|
+import { CommonConstants } from '../common/constants/CommonConstants';
|
|
|
+
|
|
|
+@Component
|
|
|
+export struct EqualizerView {
|
|
|
+ @StorageProp('themeColor') themeColor: string = CommonConstants.DEFAULT_THEME_COLOR;
|
|
|
+ @StorageProp('isDarkMode') isDarkMode: boolean = false;
|
|
|
+
|
|
|
+ @State private equalizerEnabled: boolean = false;
|
|
|
+ @State private currentPresetId: string = 'normal';
|
|
|
+ @State private gains: number[] = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
|
|
|
+ @State private presets: EqualizerPreset[] = [];
|
|
|
+ @State private selectedPresetIndex: number = 0;
|
|
|
+
|
|
|
+ private equalizerManager: EqualizerManager = EqualizerManager.getInstance();
|
|
|
+ private bands: EqualizerBand[] = EqualizerManager.BANDS;
|
|
|
+ private static readonly TAG: string = 'heanup EqualizerView';
|
|
|
+
|
|
|
+ aboutToAppear(): void {
|
|
|
+ this.loadState();
|
|
|
+ }
|
|
|
+
|
|
|
+ private loadState(): void {
|
|
|
+ this.equalizerEnabled = this.equalizerManager.enabled;
|
|
|
+ this.currentPresetId = this.equalizerManager.currentPresetId;
|
|
|
+ this.gains = this.equalizerManager.getCurrentGains();
|
|
|
+ this.presets = this.equalizerManager.getAllPresets();
|
|
|
+ this.updateSelectedPresetIndex();
|
|
|
+ }
|
|
|
+
|
|
|
+ private updateSelectedPresetIndex(): void {
|
|
|
+ for (let i = 0; i < this.presets.length; i++) {
|
|
|
+ if (this.presets[i].id === this.currentPresetId) {
|
|
|
+ this.selectedPresetIndex = i;
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 如果是自定义,设为 -1
|
|
|
+ if (this.currentPresetId === 'custom') {
|
|
|
+ this.selectedPresetIndex = -1;
|
|
|
+ } else {
|
|
|
+ this.selectedPresetIndex = 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ private notifyEqualizerChanged(): void {
|
|
|
+ // 发送均衡器变更事件
|
|
|
+ const eventData: emitter.EventData = {
|
|
|
+ data: {
|
|
|
+ enabled: this.equalizerEnabled,
|
|
|
+ presetId: this.currentPresetId
|
|
|
+ }
|
|
|
+ };
|
|
|
+ emitter.emit({ eventId: EventConstants.EVENT_EQUALIZER_CHANGED }, eventData);
|
|
|
+ }
|
|
|
+
|
|
|
+ private onEnabledChange(enabled: boolean): void {
|
|
|
+ this.equalizerEnabled = enabled;
|
|
|
+ this.equalizerManager.enabled = enabled;
|
|
|
+ this.notifyEqualizerChanged();
|
|
|
+ Logger.info(EqualizerView.TAG, `均衡器 ${enabled ? '已启用' : '已禁用'}`);
|
|
|
+ }
|
|
|
+
|
|
|
+ private onPresetSelect(index: number): void {
|
|
|
+ if (index >= 0 && index < this.presets.length) {
|
|
|
+ const preset = this.presets[index];
|
|
|
+ this.currentPresetId = preset.id;
|
|
|
+ this.selectedPresetIndex = index;
|
|
|
+ this.equalizerManager.setPreset(preset.id);
|
|
|
+ this.gains = this.equalizerManager.getCurrentGains();
|
|
|
+ this.notifyEqualizerChanged();
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ private onGainChange(bandIndex: number, gain: number): void {
|
|
|
+ const newGains = this.gains.slice();
|
|
|
+ newGains[bandIndex] = gain;
|
|
|
+ this.gains = newGains;
|
|
|
+ this.equalizerManager.setCustomGain(bandIndex, gain);
|
|
|
+ this.currentPresetId = 'custom';
|
|
|
+ this.selectedPresetIndex = -1;
|
|
|
+ this.notifyEqualizerChanged();
|
|
|
+ }
|
|
|
+
|
|
|
+ private onResetClick(): void {
|
|
|
+ this.equalizerManager.resetToFlat();
|
|
|
+ this.loadState();
|
|
|
+ this.notifyEqualizerChanged();
|
|
|
+ ToastUtil.showToast('已重置为平坦');
|
|
|
+ }
|
|
|
+
|
|
|
+ private onSavePresetClick(): void {
|
|
|
+ const that = this;
|
|
|
+ // 显示保存预设对话框
|
|
|
+ DialogHelper.showTextInputDialog({
|
|
|
+ title: '保存预设',
|
|
|
+ text: '',
|
|
|
+ maskColor: Color.Transparent,
|
|
|
+ transition: AnimationHelper.transitionInDown(300),
|
|
|
+ onAction: (action: DialogAction, dialogId: string, content: string) => {
|
|
|
+ if (action === DialogAction.TWO) {
|
|
|
+ const name = content.trim();
|
|
|
+ if (name.length > 0) {
|
|
|
+ that.equalizerManager.saveAsPreset(name);
|
|
|
+ that.presets = that.equalizerManager.getAllPresets();
|
|
|
+ that.currentPresetId = that.equalizerManager.currentPresetId;
|
|
|
+ that.updateSelectedPresetIndex();
|
|
|
+ ToastUtil.showToast('预设已保存');
|
|
|
+ } else {
|
|
|
+ ToastUtil.showToast('请输入预设名称');
|
|
|
+ }
|
|
|
+ }
|
|
|
+ DialogHelper.closeDialog(dialogId);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ private getPresetSelectOptions(): SelectOption[] {
|
|
|
+ const options: SelectOption[] = [];
|
|
|
+ for (let i = 0; i < this.presets.length; i++) {
|
|
|
+ options.push({ value: this.presets[i].name });
|
|
|
+ }
|
|
|
+ return options;
|
|
|
+ }
|
|
|
+
|
|
|
+ private getCurrentPresetName(): string {
|
|
|
+ if (this.currentPresetId === 'custom') {
|
|
|
+ return '自定义';
|
|
|
+ }
|
|
|
+ for (let i = 0; i < this.presets.length; i++) {
|
|
|
+ if (this.presets[i].id === this.currentPresetId) {
|
|
|
+ return this.presets[i].name;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return '正常';
|
|
|
+ }
|
|
|
+
|
|
|
+ @Builder
|
|
|
+ private PresetSelector(): void {
|
|
|
+ Row() {
|
|
|
+ Text('预设')
|
|
|
+ .fontSize(15)
|
|
|
+ .fontColor($r('app.color.text_color'))
|
|
|
+ .fontWeight(500)
|
|
|
+ Blank()
|
|
|
+ Select(this.getPresetSelectOptions())
|
|
|
+ .selected(this.selectedPresetIndex >= 0 ? this.selectedPresetIndex : 0)
|
|
|
+ .value(this.getCurrentPresetName())
|
|
|
+ .font({ size: 14 })
|
|
|
+ .fontColor(this.themeColor)
|
|
|
+ .selectedOptionFont({ size: 14, weight: FontWeight.Medium })
|
|
|
+ .selectedOptionFontColor(this.themeColor)
|
|
|
+ .onSelect((index: number) => {
|
|
|
+ this.onPresetSelect(index);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ .width('100%')
|
|
|
+ .padding({ left: 16, right: 16, top: 12, bottom: 12 })
|
|
|
+ }
|
|
|
+
|
|
|
+ @Builder
|
|
|
+ private BandSlider(band: EqualizerBand, index: number): void {
|
|
|
+ Column() {
|
|
|
+ // 增益值显示
|
|
|
+ Text(`${this.gains[index] > 0 ? '+' : ''}${this.gains[index]}`)
|
|
|
+ .fontSize(11)
|
|
|
+ .fontColor(this.themeColor)
|
|
|
+ .fontWeight(500)
|
|
|
+ .margin({ bottom: 4 })
|
|
|
+
|
|
|
+ // 垂直滑块
|
|
|
+ Column() {
|
|
|
+ Slider({
|
|
|
+ value: this.gains[index],
|
|
|
+ min: -12,
|
|
|
+ max: 12,
|
|
|
+ step: 1,
|
|
|
+ style: SliderStyle.OutSet,
|
|
|
+ direction: Axis.Vertical,
|
|
|
+ reverse: true
|
|
|
+ })
|
|
|
+ .width(24)
|
|
|
+ .height(120)
|
|
|
+ .selectedColor(this.themeColor)
|
|
|
+ .trackColor(this.isDarkMode ? '#333333' : '#E0E0E0')
|
|
|
+ .blockColor(this.themeColor)
|
|
|
+ .trackThickness(4)
|
|
|
+ .blockSize({ width: 16, height: 16 })
|
|
|
+ .onChange((value: number) => {
|
|
|
+ this.onGainChange(index, Math.round(value));
|
|
|
+ })
|
|
|
+ }
|
|
|
+ .height(130)
|
|
|
+
|
|
|
+ // 频率标签
|
|
|
+ Text(band.label)
|
|
|
+ .fontSize(9)
|
|
|
+ .fontColor(Color.Gray)
|
|
|
+ .margin({ top: 4 })
|
|
|
+ }
|
|
|
+ .alignItems(HorizontalAlign.Center)
|
|
|
+ .width('10%')
|
|
|
+ }
|
|
|
+
|
|
|
+ @Builder
|
|
|
+ private EqualizerSliders(): void {
|
|
|
+ Column() {
|
|
|
+ // 刻度标签
|
|
|
+ Row() {
|
|
|
+ Text('+12')
|
|
|
+ .fontSize(10)
|
|
|
+ .fontColor(Color.Gray)
|
|
|
+ Blank()
|
|
|
+ Text('0')
|
|
|
+ .fontSize(10)
|
|
|
+ .fontColor(Color.Gray)
|
|
|
+ Blank()
|
|
|
+ Text('-12')
|
|
|
+ .fontSize(10)
|
|
|
+ .fontColor(Color.Gray)
|
|
|
+ }
|
|
|
+ .width('100%')
|
|
|
+ .padding({ left: 8, right: 8 })
|
|
|
+ .justifyContent(FlexAlign.SpaceBetween)
|
|
|
+
|
|
|
+ // 滑块区域
|
|
|
+ Row() {
|
|
|
+ ForEach(this.bands, (band: EqualizerBand, index: number) => {
|
|
|
+ this.BandSlider(band, index)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ .width('100%')
|
|
|
+ .justifyContent(FlexAlign.SpaceEvenly)
|
|
|
+ .padding({ top: 8, bottom: 8 })
|
|
|
+ }
|
|
|
+ .width('100%')
|
|
|
+ .padding(12)
|
|
|
+ }
|
|
|
+
|
|
|
+ @Builder
|
|
|
+ private ActionButtons(): void {
|
|
|
+ Row() {
|
|
|
+ Button('重置')
|
|
|
+ .fontSize(14)
|
|
|
+ .fontColor(this.themeColor)
|
|
|
+ .backgroundColor(Color.Transparent)
|
|
|
+ .border({ width: 1, color: this.themeColor, radius: 20 })
|
|
|
+ .height(36)
|
|
|
+ .padding({ left: 24, right: 24 })
|
|
|
+ .onClick(() => this.onResetClick())
|
|
|
+
|
|
|
+ Blank().width(20)
|
|
|
+
|
|
|
+ Button('保存预设')
|
|
|
+ .fontSize(14)
|
|
|
+ .fontColor(Color.White)
|
|
|
+ .backgroundColor(this.themeColor)
|
|
|
+ .borderRadius(20)
|
|
|
+ .height(36)
|
|
|
+ .padding({ left: 24, right: 24 })
|
|
|
+ .onClick(() => this.onSavePresetClick())
|
|
|
+ }
|
|
|
+ .width('100%')
|
|
|
+ .justifyContent(FlexAlign.Center)
|
|
|
+ .padding({ top: 16, bottom: 20 })
|
|
|
+ }
|
|
|
+
|
|
|
+ build() {
|
|
|
+ Column() {
|
|
|
+ // 启用开关
|
|
|
+ Row() {
|
|
|
+ SymbolGlyph($r('sys.symbol.waveform'))
|
|
|
+ .fontSize(22)
|
|
|
+ .fontColor([this.themeColor])
|
|
|
+ Text('均衡器')
|
|
|
+ .fontSize(16)
|
|
|
+ .fontWeight(500)
|
|
|
+ .fontColor($r('app.color.text_color'))
|
|
|
+ .margin({ left: 10 })
|
|
|
+ Blank()
|
|
|
+ Toggle({ type: ToggleType.Switch, isOn: this.equalizerEnabled })
|
|
|
+ .selectedColor(this.themeColor)
|
|
|
+ .switchPointColor(Color.White)
|
|
|
+ .onChange((isOn: boolean) => this.onEnabledChange(isOn))
|
|
|
+ .width(50)
|
|
|
+ .height(28)
|
|
|
+ }
|
|
|
+ .width('100%')
|
|
|
+ .padding({ left: 16, right: 16, top: 16, bottom: 8 })
|
|
|
+
|
|
|
+ // 内容区域(仅在启用时显示)
|
|
|
+ if (this.equalizerEnabled) {
|
|
|
+ Line()
|
|
|
+ .width('90%')
|
|
|
+ .height(0.5)
|
|
|
+ .backgroundColor($r('app.color.divider_color'))
|
|
|
+
|
|
|
+ this.PresetSelector()
|
|
|
+
|
|
|
+ Line()
|
|
|
+ .width('90%')
|
|
|
+ .height(0.5)
|
|
|
+ .backgroundColor($r('app.color.divider_color'))
|
|
|
+
|
|
|
+ this.EqualizerSliders()
|
|
|
+
|
|
|
+ this.ActionButtons()
|
|
|
+ } else {
|
|
|
+ // 禁用时显示提示
|
|
|
+ Text('开启均衡器后可调节音效')
|
|
|
+ .fontSize(13)
|
|
|
+ .fontColor(Color.Gray)
|
|
|
+ .margin({ top: 12, bottom: 20 })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .width('100%')
|
|
|
+ .backgroundColor($r('app.color.settings_background_main'))
|
|
|
+ .borderRadius(16)
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * 带回调的均衡器视图组件
|
|
|
+ * 用于在播放页面实时应用均衡器效果
|
|
|
+ */
|
|
|
+@Component
|
|
|
+export struct EqualizerViewWithCallback {
|
|
|
+ @StorageProp('themeColor') themeColor: string = CommonConstants.DEFAULT_THEME_COLOR;
|
|
|
+ @StorageProp('isDarkMode') isDarkMode: boolean = false;
|
|
|
+
|
|
|
+ @State private equalizerEnabled: boolean = false;
|
|
|
+ @State private currentPresetId: string = 'normal';
|
|
|
+ @State private gains: number[] = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
|
|
|
+ @State private presets: EqualizerPreset[] = [];
|
|
|
+ @State private selectedPresetIndex: number = 0;
|
|
|
+
|
|
|
+ // 回调函数
|
|
|
+ onEqualizerChanged: () => void = () => {};
|
|
|
+
|
|
|
+ private equalizerManager: EqualizerManager = EqualizerManager.getInstance();
|
|
|
+ private bands: EqualizerBand[] = EqualizerManager.BANDS;
|
|
|
+ private static readonly TAG: string = 'heanup EqualizerViewWithCallback';
|
|
|
+
|
|
|
+ aboutToAppear(): void {
|
|
|
+ this.loadState();
|
|
|
+ }
|
|
|
+
|
|
|
+ private loadState(): void {
|
|
|
+ this.equalizerEnabled = this.equalizerManager.enabled;
|
|
|
+ this.currentPresetId = this.equalizerManager.currentPresetId;
|
|
|
+ this.gains = this.equalizerManager.getCurrentGains();
|
|
|
+ this.presets = this.equalizerManager.getAllPresets();
|
|
|
+ this.updateSelectedPresetIndex();
|
|
|
+ }
|
|
|
+
|
|
|
+ private updateSelectedPresetIndex(): void {
|
|
|
+ for (let i = 0; i < this.presets.length; i++) {
|
|
|
+ if (this.presets[i].id === this.currentPresetId) {
|
|
|
+ this.selectedPresetIndex = i;
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (this.currentPresetId === 'custom') {
|
|
|
+ this.selectedPresetIndex = -1;
|
|
|
+ } else {
|
|
|
+ this.selectedPresetIndex = 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ private notifyChange(): void {
|
|
|
+ // 发送事件
|
|
|
+ const eventData: emitter.EventData = {
|
|
|
+ data: {
|
|
|
+ enabled: this.equalizerEnabled,
|
|
|
+ presetId: this.currentPresetId
|
|
|
+ }
|
|
|
+ };
|
|
|
+ emitter.emit({ eventId: EventConstants.EVENT_EQUALIZER_CHANGED }, eventData);
|
|
|
+ // 调用回调
|
|
|
+ this.onEqualizerChanged();
|
|
|
+ }
|
|
|
+
|
|
|
+ private onEnabledChange(enabled: boolean): void {
|
|
|
+ this.equalizerEnabled = enabled;
|
|
|
+ this.equalizerManager.enabled = enabled;
|
|
|
+ this.notifyChange();
|
|
|
+ Logger.info(EqualizerViewWithCallback.TAG, `均衡器 ${enabled ? '已启用' : '已禁用'}`);
|
|
|
+ }
|
|
|
+
|
|
|
+ private onPresetSelect(index: number): void {
|
|
|
+ if (index >= 0 && index < this.presets.length) {
|
|
|
+ const preset = this.presets[index];
|
|
|
+ this.currentPresetId = preset.id;
|
|
|
+ this.selectedPresetIndex = index;
|
|
|
+ this.equalizerManager.setPreset(preset.id);
|
|
|
+ this.gains = this.equalizerManager.getCurrentGains();
|
|
|
+ this.notifyChange();
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ private onGainChange(bandIndex: number, gain: number): void {
|
|
|
+ const newGains = this.gains.slice();
|
|
|
+ newGains[bandIndex] = gain;
|
|
|
+ this.gains = newGains;
|
|
|
+ this.equalizerManager.setCustomGain(bandIndex, gain);
|
|
|
+ this.currentPresetId = 'custom';
|
|
|
+ this.selectedPresetIndex = -1;
|
|
|
+ this.notifyChange();
|
|
|
+ }
|
|
|
+
|
|
|
+ private onResetClick(): void {
|
|
|
+ this.equalizerManager.resetToFlat();
|
|
|
+ this.loadState();
|
|
|
+ this.notifyChange();
|
|
|
+ ToastUtil.showToast('已重置为平坦');
|
|
|
+ }
|
|
|
+
|
|
|
+ private onSavePresetClick(): void {
|
|
|
+ const that = this;
|
|
|
+ DialogHelper.showTextInputDialog({
|
|
|
+ title: '保存预设',
|
|
|
+ text: '',
|
|
|
+ maskColor: Color.Transparent,
|
|
|
+ transition: AnimationHelper.transitionInDown(300),
|
|
|
+ onAction: (action: DialogAction, dialogId: string, content: string) => {
|
|
|
+ if (action === DialogAction.TWO) {
|
|
|
+ const name = content.trim();
|
|
|
+ if (name.length > 0) {
|
|
|
+ that.equalizerManager.saveAsPreset(name);
|
|
|
+ that.presets = that.equalizerManager.getAllPresets();
|
|
|
+ that.currentPresetId = that.equalizerManager.currentPresetId;
|
|
|
+ that.updateSelectedPresetIndex();
|
|
|
+ ToastUtil.showToast('预设已保存');
|
|
|
+ } else {
|
|
|
+ ToastUtil.showToast('请输入预设名称');
|
|
|
+ }
|
|
|
+ }
|
|
|
+ DialogHelper.closeDialog(dialogId);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ private getPresetSelectOptions(): SelectOption[] {
|
|
|
+ const options: SelectOption[] = [];
|
|
|
+ for (let i = 0; i < this.presets.length; i++) {
|
|
|
+ options.push({ value: this.presets[i].name });
|
|
|
+ }
|
|
|
+ return options;
|
|
|
+ }
|
|
|
+
|
|
|
+ private getCurrentPresetName(): string {
|
|
|
+ if (this.currentPresetId === 'custom') {
|
|
|
+ return '自定义';
|
|
|
+ }
|
|
|
+ for (let i = 0; i < this.presets.length; i++) {
|
|
|
+ if (this.presets[i].id === this.currentPresetId) {
|
|
|
+ return this.presets[i].name;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return '正常';
|
|
|
+ }
|
|
|
+
|
|
|
+ @Builder
|
|
|
+ private PresetSelector(): void {
|
|
|
+ Row() {
|
|
|
+ Text('预设')
|
|
|
+ .fontSize(15)
|
|
|
+ .fontColor($r('app.color.text_color'))
|
|
|
+ .fontWeight(500)
|
|
|
+ Blank()
|
|
|
+ Select(this.getPresetSelectOptions())
|
|
|
+ .selected(this.selectedPresetIndex >= 0 ? this.selectedPresetIndex : 0)
|
|
|
+ .value(this.getCurrentPresetName())
|
|
|
+ .font({ size: 14 })
|
|
|
+ .fontColor(this.themeColor)
|
|
|
+ .selectedOptionFont({ size: 14, weight: FontWeight.Medium })
|
|
|
+ .selectedOptionFontColor(this.themeColor)
|
|
|
+ .onSelect((index: number) => {
|
|
|
+ this.onPresetSelect(index);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ .width('100%')
|
|
|
+ .padding({ left: 16, right: 16, top: 12, bottom: 12 })
|
|
|
+ }
|
|
|
+
|
|
|
+ @Builder
|
|
|
+ private BandSlider(band: EqualizerBand, index: number): void {
|
|
|
+ Column() {
|
|
|
+ Text(`${this.gains[index] > 0 ? '+' : ''}${this.gains[index]}`)
|
|
|
+ .fontSize(11)
|
|
|
+ .fontColor(this.themeColor)
|
|
|
+ .fontWeight(500)
|
|
|
+ .margin({ bottom: 4 })
|
|
|
+
|
|
|
+ Column() {
|
|
|
+ Slider({
|
|
|
+ value: this.gains[index],
|
|
|
+ min: -12,
|
|
|
+ max: 12,
|
|
|
+ step: 1,
|
|
|
+ style: SliderStyle.OutSet,
|
|
|
+ direction: Axis.Vertical,
|
|
|
+ reverse: true
|
|
|
+ })
|
|
|
+ .width(24)
|
|
|
+ .height(120)
|
|
|
+ .selectedColor(this.themeColor)
|
|
|
+ .trackColor(this.isDarkMode ? '#333333' : '#E0E0E0')
|
|
|
+ .blockColor(this.themeColor)
|
|
|
+ .trackThickness(4)
|
|
|
+ .blockSize({ width: 16, height: 16 })
|
|
|
+ .onChange((value: number) => {
|
|
|
+ this.onGainChange(index, Math.round(value));
|
|
|
+ })
|
|
|
+ }
|
|
|
+ .height(130)
|
|
|
+
|
|
|
+ Text(band.label)
|
|
|
+ .fontSize(9)
|
|
|
+ .fontColor(Color.Gray)
|
|
|
+ .margin({ top: 4 })
|
|
|
+ }
|
|
|
+ .alignItems(HorizontalAlign.Center)
|
|
|
+ .width('10%')
|
|
|
+ }
|
|
|
+
|
|
|
+ @Builder
|
|
|
+ private EqualizerSliders(): void {
|
|
|
+ Column() {
|
|
|
+ Row() {
|
|
|
+ Text('+12')
|
|
|
+ .fontSize(10)
|
|
|
+ .fontColor(Color.Gray)
|
|
|
+ Blank()
|
|
|
+ Text('0')
|
|
|
+ .fontSize(10)
|
|
|
+ .fontColor(Color.Gray)
|
|
|
+ Blank()
|
|
|
+ Text('-12')
|
|
|
+ .fontSize(10)
|
|
|
+ .fontColor(Color.Gray)
|
|
|
+ }
|
|
|
+ .width('100%')
|
|
|
+ .padding({ left: 8, right: 8 })
|
|
|
+ .justifyContent(FlexAlign.SpaceBetween)
|
|
|
+
|
|
|
+ Row() {
|
|
|
+ ForEach(this.bands, (band: EqualizerBand, index: number) => {
|
|
|
+ this.BandSlider(band, index)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ .width('100%')
|
|
|
+ .justifyContent(FlexAlign.SpaceEvenly)
|
|
|
+ .padding({ top: 8, bottom: 8 })
|
|
|
+ }
|
|
|
+ .width('100%')
|
|
|
+ .padding(12)
|
|
|
+ }
|
|
|
+
|
|
|
+ @Builder
|
|
|
+ private ActionButtons(): void {
|
|
|
+ Row() {
|
|
|
+ Button('重置')
|
|
|
+ .fontSize(14)
|
|
|
+ .fontColor(this.themeColor)
|
|
|
+ .backgroundColor(Color.Transparent)
|
|
|
+ .border({ width: 1, color: this.themeColor, radius: 20 })
|
|
|
+ .height(36)
|
|
|
+ .padding({ left: 24, right: 24 })
|
|
|
+ .onClick(() => this.onResetClick())
|
|
|
+
|
|
|
+ Blank().width(20)
|
|
|
+
|
|
|
+ Button('保存预设')
|
|
|
+ .fontSize(14)
|
|
|
+ .fontColor(Color.White)
|
|
|
+ .backgroundColor(this.themeColor)
|
|
|
+ .borderRadius(20)
|
|
|
+ .height(36)
|
|
|
+ .padding({ left: 24, right: 24 })
|
|
|
+ .onClick(() => this.onSavePresetClick())
|
|
|
+ }
|
|
|
+ .width('100%')
|
|
|
+ .justifyContent(FlexAlign.Center)
|
|
|
+ .padding({ top: 16, bottom: 20 })
|
|
|
+ }
|
|
|
+
|
|
|
+ build() {
|
|
|
+ Column() {
|
|
|
+ Row() {
|
|
|
+ SymbolGlyph($r('sys.symbol.waveform'))
|
|
|
+ .fontSize(22)
|
|
|
+ .fontColor([this.themeColor])
|
|
|
+ Text('均衡器')
|
|
|
+ .fontSize(16)
|
|
|
+ .fontWeight(500)
|
|
|
+ .fontColor($r('app.color.text_color'))
|
|
|
+ .margin({ left: 10 })
|
|
|
+ Blank()
|
|
|
+ Toggle({ type: ToggleType.Switch, isOn: this.equalizerEnabled })
|
|
|
+ .selectedColor(this.themeColor)
|
|
|
+ .switchPointColor(Color.White)
|
|
|
+ .onChange((isOn: boolean) => this.onEnabledChange(isOn))
|
|
|
+ .width(50)
|
|
|
+ .height(28)
|
|
|
+ }
|
|
|
+ .width('100%')
|
|
|
+ .padding({ left: 16, right: 16, top: 16, bottom: 8 })
|
|
|
+
|
|
|
+ if (this.equalizerEnabled) {
|
|
|
+ Line()
|
|
|
+ .width('90%')
|
|
|
+ .height(0.5)
|
|
|
+ .backgroundColor($r('app.color.divider_color'))
|
|
|
+
|
|
|
+ this.PresetSelector()
|
|
|
+
|
|
|
+ Line()
|
|
|
+ .width('90%')
|
|
|
+ .height(0.5)
|
|
|
+ .backgroundColor($r('app.color.divider_color'))
|
|
|
+
|
|
|
+ this.EqualizerSliders()
|
|
|
+
|
|
|
+ this.ActionButtons()
|
|
|
+ } else {
|
|
|
+ Text('开启均衡器后可调节音效')
|
|
|
+ .fontSize(13)
|
|
|
+ .fontColor(Color.Gray)
|
|
|
+ .margin({ top: 12, bottom: 20 })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .width('100%')
|
|
|
+ .backgroundColor($r('app.color.settings_background_main'))
|
|
|
+ .borderRadius(16)
|
|
|
+ }
|
|
|
+}
|