double_tap_player_view 2.0.3 copy "double_tap_player_view: ^2.0.3" to clipboard
double_tap_player_view: ^2.0.3 copied to clipboard

a widget to handle fast forward/rewind behavior by double tap and horizontal drag like a video player.

example/lib/main.dart

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

void main() {
  runApp(ProviderScope(child: MyApp()));
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  late VideoPlayerController _controller;

  @override
  void initState() {
    super.initState();
    _controller = VideoPlayerController.network(
        'http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4')
      ..initialize().then((_) => setState(() {}));
    WidgetsBinding.instance
        .addPostFrameCallback((_) async => _controller.play());
  }

  @override
  void dispose() {
    super.dispose();
    _controller.dispose();
  }

  @override
  Widget build(BuildContext context) => MaterialApp(
        home: Scaffold(
          appBar: AppBar(
            title: const Text('Plugin example app'),
          ),
          body: Center(
            child: AspectRatio(
              aspectRatio: 16 / 9,
              child: DoubleTapPlayerView(
                doubleTapConfig: DoubleTapConfig.create(onDoubleTap: (lr) {
                  debugPrint('double tapped: $lr');
                }),
                swipeConfig: SwipeConfig.create(overlayBuilder: _overlay),
                child: VideoPlayer(_controller),
              ),
            ),
          ),
        ),
      );

  Widget _overlay(SwipeData data) {
    final dxDiff = (data.currentDx - data.startDx).toInt();
    final diffDuration = Duration(seconds: dxDiff);
    final prefix = diffDuration.isNegative ? '-' : '+';
    final positionText = '$prefix${diffDuration.printDuration()}';
    final aimedDuration = diffDuration + const Duration(minutes: 5);
    final diffText = aimedDuration.printDuration();

    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Text(
            positionText,
            style: const TextStyle(
              fontSize: 30,
              color: Colors.white,
            ),
          ),
          const SizedBox(height: 4),
          Text(
            diffText,
            style: const TextStyle(
              fontSize: 20,
              color: Colors.white,
            ),
          ),
        ],
      ),
    );
  }
}

extension on Duration {
  /// ref: https://stackoverflow.com/a/54775297/8183034
  String printDuration() {
    String twoDigits(int n) => n.toString().padLeft(2, '0');
    final twoDigitMinutes = twoDigits(inMinutes.abs().remainder(60));
    final twoDigitSeconds = twoDigits(inSeconds.abs().remainder(60));
    return '$twoDigitMinutes:$twoDigitSeconds';
  }
}
44
likes
130
pub points
58%
popularity

Publisher

unverified uploader

a widget to handle fast forward/rewind behavior by double tap and horizontal drag like a video player.

Repository (GitHub)
View/report issues

Documentation

API reference

License

Apache-2.0 (license)

Dependencies

circular_reveal_animation, flutter, flutter_hooks, freezed_annotation, hooks_riverpod, uuid

More

Packages that depend on double_tap_player_view