flutter - 无法在Flutter中向计时器添加音频

Question

我在flutter中建立了一个计时器，并找到了一个音频flutter包来为计时器添加音频。我正在努力使声音自动播放，就像我按下“暂停”按钮时一样，就像计时器和“暂停”一样。到目前为止，我所做的只是将音频添加到LoopOnce方法“sound.mp3”中，但是当我打开计时器时，声音不会播放。

import 'package:App1/main.dart';
import 'package:flutter/material.dart';
import 'dart:math' as math;
import 'nav_draw.dart';
import 'package:audioplayers/audio_cache.dart';
import 'package:audioplayers/audioplayers.dart';

class CountDownTimer extends StatefulWidget {
  @override
  _CountDownTimerState createState() => _CountDownTimerState();
}

class _CountDownTimerState extends State<CountDownTimer>
    with TickerProviderStateMixin {

  AudioPlayer advancedPlayer;
  AudioCache audioCache;

  AnimationController controller;

  final appTitle = 'Timer';
  bool isRunning = false;

  String get timerString {
    Duration duration = controller.duration * controller.value;
    return '${duration.inMinutes}:${(duration.inSeconds % 60)
        .toString()
        .padLeft(2, "0")
    }';
  }

  String LocalPathFile;

  @override
  void initState() {
    super.initState();
    advancedPlayer = AudioPlayer();
    audioCache = AudioCache(fixedPlayer: advancedPlayer);

    controller = AnimationController(
      vsync: this,
      duration: Duration(minutes: 5, seconds: 1),
    );

    WidgetsBinding.instance.addPostFrameCallback(
            (_) => loopOnce(context)); //i add this to access the context safely.
  }

  Future<void> loopOnce(BuildContext context) async {
    // await Future.delayed(Duration(seconds: 1));
       audioCache.play('sound.mp3');
       advancedPlayer.pause();
       advancedPlayer.stop();
    await controller.stop();
    await controller.reverse(
        from: controller.value == 0.0
            ? 1.0
            : controller.value);    //we can add duration here
    await Future.delayed(Duration(seconds: 0));
    Navigator.of(context).push(MaterialPageRoute( // since this triggers when the animation is done, no duration is needed
      builder: (context) => MyApp(),
    ));
  }

  @override
  Widget build(BuildContext context) {

    ThemeData themeData = Theme.of(context);
    return Scaffold(
      backgroundColor: Color(0xff7A8ECD),
      appBar: AppBar(title: Text('Timer'),
        actions: <Widget>[
          IconButton(
            icon: const Icon(Icons.volume_up),
            onPressed: () {
            },
          ),
        ],
        backgroundColor: Color(0xff7A8ECD),
        elevation: 0.0,
      ),
      body:
      AnimatedBuilder(
          animation: controller,
          builder: (context, child) {
            return Stack(
              children: <Widget>[
                Padding(
                  padding: EdgeInsets.all(35.0),
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      Expanded(
                        child: Align(
                          alignment: FractionalOffset.center,
                          child: AspectRatio(
                            aspectRatio: 1.0,
                            child: Stack(
                              children: <Widget>[
                                Positioned.fill(
                                  child: CustomPaint(
                                      painter: CustomTimerPainter(
                                        animation: controller,
                                        backgroundColor: Colors.white,
                                        color: themeData.indicatorColor,
                                      )),
                                ),
                                Align(
                                  alignment: FractionalOffset.center,
                                  child: Column(
                                    mainAxisAlignment:
                                    MainAxisAlignment.spaceEvenly,
                                    crossAxisAlignment:
                                    CrossAxisAlignment.center,
                                    children: <Widget>[
                                      Text(
                                        timerString,
                                        style: TextStyle(
                                            fontSize: 80,
                                            color: Colors.white),
                                      ),
                                    ],
                                  ),
                                ),
                              ],
                            ),
                          ),
                        ),
                      ),
                      AnimatedBuilder(
                        animation: controller,
                        builder: (BuildContext context, Widget child) {
            return GestureDetector(
            child: Stack(
            children: <Widget> [
            Container(
            width: 105,
            height: 105,
            decoration: BoxDecoration(
            color: Colors.transparent,
            image: DecorationImage(
            image: AssetImage("images/pause.png"),
            fit: BoxFit.cover
            ),
            ),
            ),
            ],
            ), onTap: () {
            if (controller.isAnimating)
            controller.stop();
            else {
              controller.reverse(
            from: controller.value == 0.0
            ? 1.0
                : controller.value);
            };
            },
            );
            },
                          ),
                    ],
                  ),
                ),
              ],
            );
          }),
      drawer: NavDraw(),
    );
  }
}

class CustomTimerPainter extends CustomPainter {
  CustomTimerPainter({
    this.animation,
    this.backgroundColor,
    this.color,
  }) : super(repaint: animation);

  final Animation<double> animation;
  final Color backgroundColor, color;

  @override
  void paint(Canvas canvas, Size size) {
    Paint paint = Paint()
      ..color = Color(0xff4D6BCB)
      ..strokeWidth = 5.0
      ..strokeCap = StrokeCap.butt
      ..style = PaintingStyle.stroke;

    canvas.drawCircle(size.center(Offset.zero), size.width / 2.0, paint);
    paint.color = color;
    double progress = (1.0 - animation.value) * 2 * math.pi;
    canvas.drawArc(Offset.zero & size, math.pi * 1.5, -progress, false, paint);
  }

  @override
  bool shouldRepaint(CustomTimerPainter old) {
    return animation.value != old.animation.value ||
        color != old.color ||
        backgroundColor != old.backgroundColor;
  }
}

Answer 1

我对此做了很多研究，并且使用了更易于使用的Flutter软件包:https://pub.dev/packages/assets_audio_player
在此之后，我创建了:

final assetsAudioPlayer = AssetsAudioPlayer();

然后在状态内部调用final，以便它可以自动运行:

   assetsAudioPlayer.open(Audio('audios/sound.mp3'),
      autoStart: true,
    );

并将暂停和播放添加到onTap上:

onTap: () {
              assetsAudioPlayer.pause();
              if (controller.isAnimating)
            controller.stop();
            else {
              assetsAudioPlayer.play();
              controller.reverse(
            from: controller.value == 0.0
            ? 1.0
                : controller.value);
            };
            },

另外我还记得要进行Dispose，所以当我离开屏幕时，声音会自动删除:

  @override
  void dispose() {
    assetsAudioPlayer.dispose();
    print("dispose");
    super.dispose();
  }