当用户点击正在播放的视频时,如何在 Flutter 中显示“暂停图标”?

问题描述 投票:0回答:0

我使用以下代码向用户展示视频并让他们能够暂停、重播视频:

import 'package:flutter/material.dart';
import 'package:video_player/video_player.dart';

class BasicOverlayWidget extends StatelessWidget {
  final VideoPlayerController? controller;
  const BasicOverlayWidget({
    Key? key,
    @override this.controller,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: () => controller!.value.isPlaying
          ? controller!.pause()
          : controller!.play(),
      child: Stack(children: [
        buildPlay(),
        Positioned(
          left: 0,
          right: 0,
          bottom: 0,
          child: buildIndicator(),
        )
      ]),
    );
  }

  Widget buildIndicator() =>
      VideoProgressIndicator(controller!, allowScrubbing: true);

  Widget buildPlay() => controller!.value.isPlaying
      ? Container()
      : Container(
          alignment: Alignment.center,
          color: Colors.black26,
          child: Container(
            alignment: Alignment.center,
            color: Colors.black26,
            child: Icon(
              Icons.play_arrow,
              color: Colors.white,
              size: 80,
            ),
          ),
        );
}

我想做的是当用户点击已经播放的视频时,显示暂停图标半秒钟,然后显示播放按钮,直到用户再次点击视频再次开始播放按钮消失(类似每个视频播放器都在做什么)。

上面的代码很好地完成了第二个工作,但我不知道如何显示暂停图标半秒,然后暂停视频并显示播放图标?

import 'package:flutter/material.dart';

import 'package:video_player/video_player.dart';
import 'basic_overlay_widget.dart';

class VideoPlayerBaseWidget extends StatelessWidget {
  final VideoPlayerController? controller;

  const VideoPlayerBaseWidget({
    Key? key,
    @override this.controller,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return controller != null && controller!.value.isInitialized
        ? AspectRatio(
            aspectRatio: 16 / 9,
            child: Container(
              alignment: Alignment.center,
              child: buildVideo(),
            ),
          )
        : Container(
            height: 200,
            child: const Center(child: CircularProgressIndicator()),
          );
  }

  Widget buildVideo() => Stack(children: [
        buildVideoPlayer(),
        Positioned.fill(child: BasicOverlayWidget(controller: controller)),
      ]);
  Widget buildVideoPlayer() => VideoPlayer(controller!);
}
flutter controller video-player
© www.soinside.com 2019 - 2024. All rights reserved.