Flutter音频波形显示问题：提升振幅及flutter_sound波形实现

一、修复audio_waveforms波形振幅低的问题 #

1. 调整内置振幅增益参数 #

audio_waveforms的RecorderController和PlayerController都提供了amplitudeGain参数，直接设置该值就能放大波形显示的振幅，建议尝试10-30之间的数值：

// 录制控制器设置
final recorderController = RecorderController()
  ..amplitudeGain = 25.0;

// 播放控制器设置
final playerController = PlayerController()
  ..amplitudeGain = 25.0;

这个参数仅影响波形显示，不会修改原始音频文件的音量。

2. 手动归一化振幅数据 #

如果内置增益不够灵活，你可以监听原始振幅数据并手动做范围映射：

// 监听录制时的实时振幅
recorderController.onCurrentAmplitude.listen((rawAmplitude) {
  // 将原始振幅（通常0-1区间）映射到0-50的显示范围
  double normalizedAmp = rawAmplitude * 50;
  // 把处理后的数据存入列表，用于自定义绘制或传给波形组件
});

这种方式可以精准控制波形的波动幅度，避免出现振幅饱和或过低的情况。

3. 检查录音基础配置 #

确保已获取录音权限，并且选择了高增益的输入源（比如设备内置麦克风，而非低增益的蓝牙音频设备）：

recorderController.inputSource = InputSource.microphone;

同时检查设备系统录音音量，过低的系统音量会导致采集到的原始音频振幅偏小。

二、flutter_sound显示音频波形的方法 #

flutter_sound本身没有内置波形UI组件，但可以通过获取实时音频数据实现波形显示：

1. 获取实时振幅数据 #

在录制或播放时，通过进度回调获取分贝值，转换为适合显示的振幅数值：

// 录制时监听振幅
flutterSoundRecorder.onProgress.listen((disposition) {
  // 分贝值通常为负数，转换为0-200的显示范围
  double displayAmplitude = (disposition.decibels + 100) * 2;
  // 将数据添加到波形数据列表
  waveformData.add(displayAmplitude);
  // 触发UI刷新
  setState(() {});
});

2. 自定义绘制波形 #

使用CustomPaint组件手动绘制波形，示例代码：

// 界面中使用CustomPaint
CustomPaint(
  size: const Size(double.infinity, 100),
  painter: WaveformPainter(waveformData),
)

// 自定义波形绘制器
class WaveformPainter extends CustomPainter {
  final List<double> waveformData;
  WaveformPainter(this.waveformData);

  @override
  void paint(Canvas canvas, Size size) {
    final paint = Paint()..color = Colors.blue..strokeWidth = 2;
    final step = size.width / waveformData.length;
    for (int i = 0; i < waveformData.length - 1; i++) {
      canvas.drawLine(
        Offset(i * step, size.height / 2 - waveformData[i]),
        Offset((i+1)*step, size.height /2 - waveformData[i+1]),
        paint,
      );
    }
  }

  @override
  bool shouldRepaint(covariant WaveformPainter oldDelegate) => true;
}

3. 搭配第三方波形组件 #

也可以将flutter_sound获取的振幅数据传给audio_waveforms这类现成组件，复用其UI样式来显示波形。

三、替代的音频波形包 #

• waveform_slider：支持自定义波形样式，可绑定音频播放进度，提供振幅缩放参数，适合需要交互的波形场景。
• flutter_audio_waveforms：提供柱状、线条等多种波形样式，支持录制和播放时的实时显示，可调整振幅增益。
• just_audio_waveform：配合just_audio播放器使用，支持预生成波形数据和实时显示，可自定义振幅范围。

内容的提问来源于stack exchange，提问作者Harshit