material_progress_bar.dart 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182
  1. import 'package:flutter/material.dart';
  2. import 'package:flutter/widgets.dart';
  3. import 'package:video_player/video_player.dart';
  4. class MaterialVideoProgressBar extends StatefulWidget {
  5. final VideoPlayerController controller;
  6. final VideoProgressColors colors;
  7. final Function() onDragStart;
  8. final Function() onDragEnd;
  9. final Function() onDragUpdate;
  10. MaterialVideoProgressBar(
  11. this.controller, {
  12. VideoProgressColors colors,
  13. this.onDragEnd,
  14. this.onDragStart,
  15. this.onDragUpdate,
  16. })
  17. : colors = colors ?? new VideoProgressColors();
  18. @override
  19. _VideoProgressBarState createState() {
  20. return new _VideoProgressBarState();
  21. }
  22. }
  23. class _VideoProgressBarState extends State<MaterialVideoProgressBar> {
  24. VoidCallback listener;
  25. bool _controllerWasPlaying = false;
  26. _VideoProgressBarState() {
  27. listener = () {
  28. setState(() {});
  29. };
  30. }
  31. VideoPlayerController get controller => widget.controller;
  32. @override
  33. void initState() {
  34. super.initState();
  35. controller.addListener(listener);
  36. }
  37. @override
  38. void deactivate() {
  39. controller.removeListener(listener);
  40. super.deactivate();
  41. }
  42. @override
  43. Widget build(BuildContext context) {
  44. void seekToRelativePosition(Offset globalPosition) {
  45. final RenderBox box = context.findRenderObject();
  46. final Offset tapPos = box.globalToLocal(globalPosition);
  47. final double relative = tapPos.dx / box.size.width;
  48. final Duration position = controller.value.duration * relative;
  49. controller.seekTo(position);
  50. }
  51. return new GestureDetector(
  52. child: (controller.value.isErroneous)
  53. ? new Text(controller.value.errorDescription)
  54. : new Center(
  55. child: new Container(
  56. height: MediaQuery.of(context).size.height / 2,
  57. width: MediaQuery.of(context).size.width,
  58. color: Colors.transparent,
  59. child: new CustomPaint(
  60. painter: new _ProgressBarPainter(
  61. controller.value,
  62. widget.colors,
  63. ),
  64. ),
  65. ),
  66. ),
  67. onHorizontalDragStart: (DragStartDetails details) {
  68. if (!controller.value.initialized) {
  69. return;
  70. }
  71. _controllerWasPlaying = controller.value.isPlaying;
  72. if (_controllerWasPlaying) {
  73. controller.pause();
  74. }
  75. if (widget.onDragStart != null) {
  76. widget.onDragStart();
  77. }
  78. },
  79. onHorizontalDragUpdate: (DragUpdateDetails details) {
  80. if (!controller.value.initialized) {
  81. return;
  82. }
  83. seekToRelativePosition(details.globalPosition);
  84. if (widget.onDragUpdate != null) {
  85. widget.onDragUpdate();
  86. }
  87. },
  88. onHorizontalDragEnd: (DragEndDetails details) {
  89. if (_controllerWasPlaying) {
  90. controller.play();
  91. }
  92. if (widget.onDragEnd != null) {
  93. widget.onDragEnd();
  94. }
  95. },
  96. onTapDown: (TapDownDetails details) {
  97. if (!controller.value.initialized) {
  98. return;
  99. }
  100. seekToRelativePosition(details.globalPosition);
  101. },
  102. );
  103. }
  104. }
  105. class _ProgressBarPainter extends CustomPainter {
  106. VideoPlayerValue value;
  107. VideoProgressColors colors;
  108. _ProgressBarPainter(this.value, this.colors);
  109. @override
  110. bool shouldRepaint(CustomPainter painter) {
  111. return true;
  112. }
  113. @override
  114. void paint(Canvas canvas, Size size) {
  115. final height = 2.0;
  116. canvas.drawRRect(
  117. new RRect.fromRectAndRadius(
  118. new Rect.fromPoints(
  119. new Offset(0.0, size.height / 2),
  120. new Offset(size.width, size.height / 2 + height),
  121. ),
  122. new Radius.circular(4.0),
  123. ),
  124. colors.disabledPaint,
  125. );
  126. if (!value.initialized) {
  127. return;
  128. }
  129. final double playedPart = value.position.inMilliseconds /
  130. value.duration.inMilliseconds *
  131. size.width;
  132. for (DurationRange range in value.buffered) {
  133. final double start = range.startFraction(value.duration) * size.width;
  134. final double end = range.endFraction(value.duration) * size.width;
  135. canvas.drawRRect(
  136. new RRect.fromRectAndRadius(
  137. new Rect.fromPoints(
  138. new Offset(start, size.height / 2),
  139. new Offset(end, size.height / 2 + height),
  140. ),
  141. new Radius.circular(4.0),
  142. ),
  143. colors.bufferedPaint,
  144. );
  145. }
  146. canvas.drawRRect(
  147. new RRect.fromRectAndRadius(
  148. new Rect.fromPoints(
  149. new Offset(0.0, size.height / 2),
  150. new Offset(playedPart, size.height / 2 + height),
  151. ),
  152. new Radius.circular(4.0),
  153. ),
  154. colors.playedPaint,
  155. );
  156. canvas.drawCircle(
  157. new Offset(playedPart, size.height / 2 + height / 2),
  158. height * 3,
  159. colors.handlePaint,
  160. );
  161. }
  162. }