flutter -- 自定义音乐播放器/视频播放器

最新推荐文章于 2024-08-21 09:45:48 发布

小呆呆咯

最新推荐文章于 2024-08-21 09:45:48 发布

阅读量1k

点赞数 1

分类专栏：自定义音视频播放器文章标签： flutter

本文链接：https://blog.csdn.net/qq7295199/article/details/118694306

版权

本文介绍了在Flutter中自定义音乐播放器并实现倍速播放的需求。通过引入第三方视频播放器库，详细讲解了实现倍速播放的步骤，包括引入库、初始化播放器、设置倍速进度条、自定义进度条组件以及播放控制功能的代码示例。总结中提到，整体实现简单，适合熟悉Flutter组件的开发者参考。

摘要由CSDN通过智能技术生成

写在前头

flutter 自定义实现音乐播放的文章挺多的，但是在开发中还是碰见了超级无语的情况，没想到需求竟然要音频的1倍到2倍的播放倍速，我一度质疑这个功能的实际用途，但是既然提出来了，开发就得撅屁股实现，这里采用了第三方的视频播放器来实现倍速效果，具体如下

一、实现效果

在这里插入图片描述

二、使用步骤

1.引入库

代码如下（示例）：

just_audio: ^0.8.0//视频播放器
/*flutter_seekbar 方便实现进度条分多节的效果， 其他seekbar也能实现,可以不引入*/
flutter_seekbar:
    git: https://github.com/LiuC520/flutter_seekbar.git

2.关键代码

1. 初始化播放器关键代码如下（示例）：

class _audioplayerState extends State<audioplayer> {
   
  //初始化播放器
  AudioPlayer audioPlayer = AudioPlayer();

  //异步获取流
  Stream<PositionData> get _positionDataStream =>
      Rx.combineLatest3<Duration, Duration, Duration?, PositionData>(
          audioPlayer.positionStream,
          audioPlayer.bufferedPositionStream,
          audioPlayer.durationStream,
              (position, bufferedPosition, duration) =>
              PositionData(
                  position, bufferedPosition, duration ?? Duration.zero));


  @override
  void initState() {
   
    super.initState();
    //设置播放参数
    _init();
  }

  Future<void> _init() async {
   
    //通知操作系统我们的应用程序的音频属性等。
    //我们为播放speech.speech的应用程序选择一个合理的默认值。
    final session = await AudioSession.instance;
    await session.configure(AudioSessionConfiguration.speech());
    //播放时收听错误。
    audioPlayer.playbackEventStream.listen((event) {
   },
        onError: (Object e, StackTrace stackTrace) {
   
          print('发生流错误: $e');
        });
    // 尝试从源加载音频并捕获任何错误。
    try {
   
      await audioPlayer.setAudioSource(AudioSource.uri(Uri.parse(
          "https://demo.dj63.com//2019/user_up/dj1523281909/20201103/01363f2c17b7119f023aa17c20f1be5f.mp3")));
    } catch (e) {
   
      print("加载音频源时出错： $e");
    }
  }


  @override
  void dispose() {
   
    //页面关闭处理
    audioPlayer.dispose();
    super.dispose();
  }
}

2. 倍速进度条关键代码如下（示例）：

Expanded(
            child: Container(
                padding: EdgeInsets.fromLTRB(10, 6, 0, 6),
                width: 60,
                child: SeekBar(
                  progresseight: 2,
                  min: 0,
                  max: 2,
                  //value,设置滑动条值, 从Provider取值
                  value: AudioPlayerinfo.speed_progress,
                  sectionCount: 4,
                  indicatorRadius: 8.0,
                  //sectionUnSelecteColor: Colors.white,
                  backgroundColor: Colors.white,
                  //bubbleColor: Colors.white,
                  progressColor: Colors.white,


                  onValueChanged: (v) async {
   
                    //用Provider去记录滑动条倍速，
                    AudioPlayerinfo.setspeed_progress<