flutter -- 自定义音乐播放器/视频播放器_flutter 音乐播放进度条

写在前头

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

一、实现效果

二、使用步骤

1.引入库

代码如下（示例）：

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

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();
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58

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<
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21