Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
35 changes: 29 additions & 6 deletions mobile/lib/widgets/asset_viewer/animated_play_pause.dart
Original file line number Diff line number Diff line change
@@ -1,12 +1,15 @@
import 'dart:ui';

import 'package:flutter/material.dart';

/// A widget that animates implicitly between a play and a pause icon.
class AnimatedPlayPause extends StatefulWidget {
const AnimatedPlayPause({super.key, required this.playing, this.size, this.color});
const AnimatedPlayPause({super.key, required this.playing, this.size, this.color, this.shadows});

final double? size;
final bool playing;
final Color? color;
final List<Shadow>? shadows;

@override
State<StatefulWidget> createState() => AnimatedPlayPauseState();
Expand Down Expand Up @@ -39,12 +42,32 @@ class AnimatedPlayPauseState extends State<AnimatedPlayPause> with SingleTickerP

@override
Widget build(BuildContext context) {
final icon = AnimatedIcon(
color: widget.color,
size: widget.size,
icon: AnimatedIcons.play_pause,
progress: animationController,
);

return Center(
child: AnimatedIcon(
color: widget.color,
size: widget.size,
icon: AnimatedIcons.play_pause,
progress: animationController,
child: Stack(
alignment: Alignment.center,
children: [
for (final shadow in widget.shadows ?? const <Shadow>[])
Transform.translate(
offset: shadow.offset,
child: ImageFiltered(
imageFilter: ImageFilter.blur(sigmaX: shadow.blurRadius / 2, sigmaY: shadow.blurRadius / 2),
child: AnimatedIcon(
color: shadow.color,
size: widget.size,
icon: AnimatedIcons.play_pause,
progress: animationController,
),
),
),
icon,
],
),
);
}
Expand Down
19 changes: 8 additions & 11 deletions mobile/lib/widgets/asset_viewer/video_controls.dart
Original file line number Diff line number Diff line change
Expand Up @@ -72,17 +72,14 @@ class VideoControls extends HookConsumerWidget {
children: [
Row(
children: [
IconTheme(
data: const IconThemeData(shadows: _controlShadows),
child: IconButton(
iconSize: 32,
padding: const EdgeInsets.all(12),
constraints: const BoxConstraints(),
icon: isFinished
? const Icon(Icons.replay, color: Colors.white, size: 32)
: AnimatedPlayPause(color: Colors.white, size: 32, playing: isPlaying),
onPressed: () => _toggle(ref, isCasting),
),
IconButton(
iconSize: 32,
padding: const EdgeInsets.all(12),
constraints: const BoxConstraints(),
icon: isFinished
? const Icon(Icons.replay, color: Colors.white, size: 32, shadows: _controlShadows)
: AnimatedPlayPause(color: Colors.white, size: 32, playing: isPlaying, shadows: _controlShadows),
onPressed: () => _toggle(ref, isCasting),
),
const Spacer(),
Text(
Expand Down
Loading