Flutter音频处理插件flutter_echo的使用

简介

flutter_echo 是一个用于在音乐播放器中添加回声效果的新插件，支持 iOS 和 Android 平台。通过该插件，您可以轻松实现多音轨音频播放，并为每个音轨设置速度、音调和音量。

使用步骤

1. 添加依赖

首先，在项目的 pubspec.yaml 文件中添加 flutter_echo 依赖：

dependencies:
  flutter_echo: ^版本号

然后运行以下命令安装依赖：

flutter pub add flutter_echo

2. 初始化插件

创建 AudioPlayer 对象并加载音频文件路径。以下是一个完整的示例代码：

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_echo/flutter_echo.dart';
import 'package:just_audio/just_audio.dart';

class AudioPlayerScreen extends StatefulWidget {
  final String? path;
  const AudioPlayerScreen({Key? key, this.path}) : super(key: key);

  [@override](/user/override)
  AudioPlayerScreenState createState() => AudioPlayerScreenState();
}

class AudioPlayerScreenState extends State<AudioPlayerScreen> {
  late final AudioPlayer _player = AudioPlayer();
  late final AudioPlayer _player2 = AudioPlayer();
  late final AudioPlayer _player3 = AudioPlayer();

  [@override](/user/override)
  void initState() {
    super.initState();
    SystemChrome.setSystemUIOverlayStyle(const SystemUiOverlayStyle(
      statusBarColor: Colors.black,
    ));
    _init();
  }

  Future<void> _init() async {
    try {
      await _player.setFilePath(widget.path ?? "");
      await _player2.setFilePath(widget.path ?? "");
      await _player3.setFilePath(widget.path ?? "");

      // 如果关闭回声效果，则将其他两个音轨静音
      if (!showEcho) {
        _player2.setVolume(0.0);
        _player3.setVolume(0.0);
      }
      setState(() {});
    } catch (e) {
      print("Error loading audio source: $e");
    }
  }

  [@override](/user/override)
  void dispose() {
    _player.dispose();
    _player2.dispose();
    _player3.dispose();
    super.dispose();
  }

  var showEcho = false;

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("音频播放器")),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          SwitchListTile(
            title: const Text('应用回声效果'),
            value: showEcho,
            onChanged: (value) {
              showEcho = value;
              setState(() {});
            },
          ),
          if (showEcho)
            Column(
              children: [
                Row(
                  children: [
                    // 第一音轨控制
                    Expanded(
                      child: StreamBuilder<double>(
                        stream: _player.speedStream,
                        builder: (context, snapshot) {
                          return GestureDetector(
                            onTap: () {
                              showSliderDialog(
                                context: context,
                                title: "调整速度",
                                divisions: 270,
                                min: 0.3,
                                max: 3.0,
                                value: _player.speed,
                                stream: _player.speedStream,
                                onChanged: (value) {
                                  setState(() {
                                    _player.setSpeed(value);
                                  });
                                },
                              );
                            },
                            child: Column(
                              children: [
                                Text("${snapshot.data?.toStringAsFixed(1)}x"),
                                const Text("音轨1速度"),
                              ],
                            ),
                          );
                        },
                      ),
                    ),
                    const SizedBox(width: 10),
                    // 第二音轨控制
                    Expanded(
                      child: StreamBuilder<double>(
                        stream: _player2.speedStream,
                        builder: (context, snapshot) {
                          return GestureDetector(
                            onTap: () {
                              showSliderDialog(
                                context: context,
                                title: "调整速度",
                                divisions: 270,
                                min: 0.3,
                                max: 3.0,
                                value: _player2.speed,
                                stream: _player2.speedStream,
                                onChanged: (value) {
                                  setState(() {
                                    _player2.setSpeed(value);
                                  });
                                },
                              );
                            },
                            child: Column(
                              children: [
                                Text("${snapshot.data?.toStringAsFixed(1)}x"),
                                const Text("音轨2速度"),
                              ],
                            ),
                          );
                        },
                      ),
                    ),
                    const SizedBox(width: 10),
                    // 第三音轨控制
                    Expanded(
                      child: StreamBuilder<double>(
                        stream: _player3.speedStream,
                        builder: (context, snapshot) {
                          return GestureDetector(
                            onTap: () {
                              showSliderDialog(
                                context: context,
                                title: "调整速度",
                                divisions: 270,
                                min: 0.3,
                                max: 3.0,
                                value: _player3.speed,
                                stream: _player3.speedStream,
                                onChanged: (value) {
                                  setState(() {
                                    _player3.setSpeed(value);
                                  });
                                },
                              );
                            },
                            child: Column(
                              children: [
                                Text("${snapshot.data?.toStringAsFixed(1)}x"),
                                const Text("音轨3速度"),
                              ],
                            ),
                          );
                        },
                      ),
                    ),
                  ],
                ),
                // 其他控件...
              ],
            ),
          // 播放/暂停按钮
          Row(
            children: [
              ControlButtons(_player, _player2, _player3, showEcho: showEcho),
              Expanded(
                child: StreamBuilder<PositionData>(
                  stream: Rx.combineLatest3(
                    _player.positionStream,
                    _player.bufferedPositionStream,
                    _player.durationStream,
                    (position, bufferedPosition, duration) =>
                        PositionData(position, bufferedPosition, duration!),
                  ),
                  builder: (context, snapshot) {
                    final positionData = snapshot.data;
                    return SeekBar(
                      duration: positionData?.duration ?? Duration.zero,
                      position: positionData?.position ?? Duration.zero,
                      bufferedPosition: positionData?.bufferedPosition ?? Duration.zero,
                      onChangeEnd: (duration) {
                        _player.seek(duration);
                        _player2.seek(duration);
                        _player3.seek(duration);
                      },
                    );
                  },
                ),
              ),
            ],
          ),
        ],
      ),
    );
  }
}

// 回声按钮组件
class ControlButtons extends StatelessWidget {
  final AudioPlayer player;
  final AudioPlayer player2;
  final AudioPlayer player3;
  final bool? showEcho;

  const ControlButtons(this.player, this.player2, this.player3, {Key? key, this.showEcho = false})
      : super(key: key);

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Row(
      mainAxisSize: MainAxisSize.min,
      children: [
        StreamBuilder<PlayerState>(
          stream: player.playerStateStream,
          builder: (context, snapshot) {
            final playerState = snapshot.data;
            final processingState = playerState?.processingState;
            final playing = playerState?.playing;

            if (processingState == ProcessingState.loading || processingState == ProcessingState.buffering) {
              return const CircularProgressIndicator();
            } else if (!playing!) {
              return IconButton(
                icon: const Icon(Icons.play_arrow),
                onPressed: () {
                  player.play();
                  if (showEcho ?? false) {
                    player2.play();
                    player3.play();
                  }
                },
              );
            } else if (processingState != ProcessingState.completed) {
              return IconButton(
                icon: const Icon(Icons.pause),
                onPressed: () {
                  player.pause();
                  if (showEcho ?? false) {
                    player2.pause();
                    player3.pause();
                  }
                },
              );
            } else {
              return IconButton(
                icon: const Icon(Icons.replay),
                onPressed: () {
                  player.seek(Duration.zero);
                  if (showEcho ?? false) {
                    player2.seek(Duration.zero);
                    player3.seek(Duration.zero);
                  }
                  player.play();
                },
              );
            }
          },
        ),
      ],
    );
  }
}

更多关于Flutter音频处理插件flutter_echo的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

htzhanglong 1楼

更多关于Flutter音频处理插件flutter_echo的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

flutter_echo 是一个用于音频处理的 Flutter 插件，主要用于在音频中添加回声效果。虽然截至 2023 年，flutter_echo 并不是官方或广泛使用的插件，但如果你找到了这个插件并希望使用它，以下是一些基本的使用步骤和注意事项。

1. 添加依赖

首先，你需要在 pubspec.yaml 文件中添加 flutter_echo 插件的依赖。假设你已经找到了该插件的包名和版本号，可以像这样添加：

dependencies:
  flutter:
    sdk: flutter
  flutter_echo: ^1.0.0  # 请根据实际情况替换版本号

然后运行 flutter pub get 来获取依赖。

2. 导入插件

在你的 Dart 文件中导入 flutter_echo 插件：

import 'package:flutter_echo/flutter_echo.dart';

3. 初始化插件

在使用插件之前，通常需要初始化它。你可以通过调用 FlutterEcho.initialize() 来初始化插件：

await FlutterEcho.initialize();

4. 添加回声效果

假设你有一个音频文件路径，你可以使用 flutter_echo 来为音频添加回声效果。以下是一个简单的示例：

String inputFilePath = 'path/to/your/input/audio.mp3';
String outputFilePath = 'path/to/your/output/audio_with_echo.mp3';

await FlutterEcho.addEcho(
  inputFilePath: inputFilePath,
  outputFilePath: outputFilePath,
  delay: 500,  // 回声延迟时间（毫秒）
  decay: 0.5,  // 回声衰减系数
);

5. 播放处理后的音频

处理后的音频文件将保存在 outputFilePath 指定的路径中。你可以使用 audioplayers 或其他音频播放插件来播放处理后的音频：

import 'package:audioplayers/audioplayers.dart';

final player = AudioPlayer();
await player.play(DeviceFileSource(outputFilePath));

6. 处理错误

在实际使用中，可能会遇到各种错误，例如文件路径错误、权限问题等。建议在使用时添加错误处理：

try {
  await FlutterEcho.addEcho(
    inputFilePath: inputFilePath,
    outputFilePath: outputFilePath,
    delay: 500,
    decay: 0.5,
  );
} catch (e) {
  print('Error adding echo: $e');
}

7. 释放资源

如果你不再需要使用 flutter_echo 插件，可以释放相关资源：

await FlutterEcho.dispose();