Skip to content

Commit

Permalink
Add fast forward control to mini and floating players.
Browse files Browse the repository at this point in the history
  • Loading branch information
@amugofjava
amugofjava committed Sep 24, 2023
1 parent bfffab9 commit 2ced7f7
Show file tree
Hide file tree
Showing 2 changed files with 210 additions and 165 deletions.
238 changes: 132 additions & 106 deletions lib/ui/podcast/mini_player.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -120,119 +120,145 @@ class _MiniPlayerBuilderState extends State<_MiniPlayerBuilder> with SingleTicke
top: Divider.createBorderSide(context, width: 1.0, color: Theme.of(context).dividerColor),
bottom: Divider.createBorderSide(context, width: 0.0, color: Theme.of(context).dividerColor),
)),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
StreamBuilder<Episode?>(
stream: audioBloc.nowPlaying,
builder: (context, snapshot) {
return Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
SizedBox(
height: 58.0,
width: 58.0,
child: ExcludeSemantics(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: snapshot.hasData
? PodcastImage(
key: Key('mini${snapshot.data!.imageUrl}'),
url: snapshot.data!.imageUrl!,
width: 58.0,
height: 58.0,
borderRadius: 4.0,
placeholder: placeholderBuilder != null
? placeholderBuilder.builder()(context)
: const Image(
image: AssetImage('assets/images/anytime-placeholder-logo.png')),
errorPlaceholder: placeholderBuilder != null
? placeholderBuilder.errorBuilder()(context)
: const Image(
image: AssetImage('assets/images/anytime-placeholder-logo.png')),
)
: Container(),
),
),
),
Expanded(
flex: 1,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
child: Padding(
padding: const EdgeInsets.only(left: 4.0, right: 4.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
StreamBuilder<Episode?>(
stream: audioBloc.nowPlaying,
builder: (context, snapshot) {
return StreamBuilder<AudioState>(
stream: audioBloc.playingState,
builder: (context, stateSnapshot) {
var playing = stateSnapshot.data == AudioState.playing;

return Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Text(
snapshot.data?.title ?? '',
overflow: TextOverflow.ellipsis,
style: textTheme.bodyMedium,
),
Padding(
padding: const EdgeInsets.only(top: 4.0),
child: Text(
snapshot.data?.author ?? '',
overflow: TextOverflow.ellipsis,
style: textTheme.bodySmall,
SizedBox(
height: 58.0,
width: 58.0,
child: ExcludeSemantics(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: snapshot.hasData
? PodcastImage(
key: Key('mini${snapshot.data!.imageUrl}'),
url: snapshot.data!.imageUrl!,
width: 58.0,
height: 58.0,
borderRadius: 4.0,
placeholder: placeholderBuilder != null
? placeholderBuilder.builder()(context)
: const Image(
image:
AssetImage('assets/images/anytime-placeholder-logo.png')),
errorPlaceholder: placeholderBuilder != null
? placeholderBuilder.errorBuilder()(context)
: const Image(
image:
AssetImage('assets/images/anytime-placeholder-logo.png')),
)
: Container(),
),
),
),
],
)),
SizedBox(
height: 52.0,
width: 52.0,
child: StreamBuilder<AudioState>(
stream: audioBloc.playingState,
builder: (context, snapshot) {
var playing = snapshot.data == AudioState.playing;

return TextButton(
style: TextButton.styleFrom(
padding: const EdgeInsets.symmetric(horizontal: 0.0),
shape: CircleBorder(
side:
BorderSide(color: Theme.of(context).colorScheme.background, width: 0.0)),
Expanded(
flex: 1,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text(
snapshot.data?.title ?? '',
overflow: TextOverflow.ellipsis,
style: textTheme.bodyMedium,
),
Padding(
padding: const EdgeInsets.only(top: 4.0),
child: Text(
snapshot.data?.author ?? '',
overflow: TextOverflow.ellipsis,
style: textTheme.bodySmall,
),
),
],
)),
SizedBox(
height: 52.0,
width: 52.0,
child: TextButton(
style: TextButton.styleFrom(
padding: const EdgeInsets.symmetric(horizontal: 0.0),
shape: CircleBorder(
side: BorderSide(
color: Theme.of(context).colorScheme.background, width: 0.0)),
),
onPressed: () {
if (playing) {
audioBloc.transitionState(TransitionState.fastforward);
}
},
child: const Icon(
Icons.forward_30,
size: 36.0,
),
),
onPressed: () {
if (playing) {
_pause(audioBloc);
} else {
_play(audioBloc);
}
},
child: AnimatedIcon(
semanticLabel: playing
? L.of(context)!.pause_button_label
: L.of(context)!.play_button_label,
size: 48.0,
icon: AnimatedIcons.play_pause,
color: Theme.of(context).iconTheme.color,
progress: _playPauseController,
),
SizedBox(
height: 52.0,
width: 52.0,
child: TextButton(
style: TextButton.styleFrom(
padding: const EdgeInsets.symmetric(horizontal: 0.0),
shape: CircleBorder(
side: BorderSide(
color: Theme.of(context).colorScheme.background, width: 0.0)),
),
onPressed: () {
if (playing) {
_pause(audioBloc);
} else {
_play(audioBloc);
}
},
child: AnimatedIcon(
semanticLabel: playing
? L.of(context)!.pause_button_label
: L.of(context)!.play_button_label,
size: 48.0,
icon: AnimatedIcons.play_pause,
color: Theme.of(context).iconTheme.color,
progress: _playPauseController,
),
),
);
}),
),
],
);
}),
StreamBuilder<PositionState>(
stream: audioBloc.playPosition,
builder: (context, snapshot) {
var cw = 0.0;
var position = snapshot.hasData ? snapshot.data!.position : const Duration(seconds: 0);
var length = snapshot.hasData ? snapshot.data!.length : const Duration(seconds: 0);
),
],
);
});
}),
StreamBuilder<PositionState>(
stream: audioBloc.playPosition,
builder: (context, snapshot) {
var cw = 0.0;
var position = snapshot.hasData ? snapshot.data!.position : const Duration(seconds: 0);
var length = snapshot.hasData ? snapshot.data!.length : const Duration(seconds: 0);

if (length.inSeconds > 0) {
final pc = length.inSeconds / position.inSeconds;
cw = width / pc;
}
if (length.inSeconds > 0) {
final pc = length.inSeconds / position.inSeconds;
cw = width / pc;
}

return Container(
width: cw,
height: 1.0,
color: Theme.of(context).primaryColor,
);
}),
],
return Container(
width: cw,
height: 1.0,
color: Theme.of(context).primaryColor,
);
}),
],
),
),
),
),
Expand Down
Loading

0 comments on commit 2ced7f7

Please sign in to comment.