diff --git a/lib/screens/now_playing_screen.dart b/lib/screens/now_playing_screen.dart index 0ea9055b..c7d63510 100644 --- a/lib/screens/now_playing_screen.dart +++ b/lib/screens/now_playing_screen.dart @@ -2552,6 +2552,9 @@ class _PlaybackControls extends ConsumerWidget { final mornye = context.isMornye; final isPlaying = ref.watch(playbackPlayingProvider); final isLoading = ref.watch(playbackLoadingProvider); + final playPauseSize = compact + ? (isPlaying ? 44.0 : 40.0) + : (isPlaying ? 60.0 : 54.0); final timeStyle = Theme.of( context, ).textTheme.bodySmall?.copyWith(color: colorScheme.onSurfaceVariant); @@ -2694,10 +2697,10 @@ class _PlaybackControls extends ConsumerWidget { ? context.l10n.actionPause : context.l10n.tooltipPlay, color: colorScheme.onSurface, - iconSize: compact ? 44 : 60, - // Keep the button's height stable as the glyph grows, so the - // timeline and artwork retain their existing positions. - padding: EdgeInsets.all(compact ? 12 : 4), + iconSize: playPauseSize, + // A smaller play glyph keeps the same 68dp touch target and + // does not move the timeline, artwork or adjacent buttons. + padding: EdgeInsets.all((68 - playPauseSize) / 2), loading: isLoading, onPressed: () => controller.togglePlayPause(isPlaying), ) diff --git a/test/now_playing_lyrics_transition_test.dart b/test/now_playing_lyrics_transition_test.dart index 94f2a976..3924996d 100644 --- a/test/now_playing_lyrics_transition_test.dart +++ b/test/now_playing_lyrics_transition_test.dart @@ -1097,6 +1097,61 @@ void main() { }, ); + for (final landscape in [false, true]) { + testWidgets( + 'paused play glyph is smaller without moving controls (landscape: $landscape)', + (tester) async { + final playback = StreamController(); + addTearDown(playback.close); + await pumpNowPlaying( + tester, + theme: MornyeTheme.build(Brightness.dark), + size: landscape ? const Size(852, 393) : const Size(393, 852), + playbackEvents: playback.stream, + ); + playback.add(PlaybackState(playing: true)); + mediaItems.add(item('first')); + await tester.pumpAndSettle(); + final pause = find.widgetWithIcon( + MornyePlaybackButton, + CupertinoIcons.pause_fill, + ); + final pauseBounds = tester.getRect(pause); + final pauseSize = tester.getSize( + find.byIcon(CupertinoIcons.pause_fill), + ); + final previous = find.byIcon(CupertinoIcons.backward_fill); + final next = find.byIcon(CupertinoIcons.forward_fill); + final previousBounds = tester.getRect(previous); + final nextBounds = tester.getRect(next); + final volumeBounds = tester.getRect(find.byType(MornyeVolumeControl)); + + playback.add(PlaybackState(playing: false)); + await tester.pumpAndSettle(); + final play = find.widgetWithIcon( + MornyePlaybackButton, + CupertinoIcons.play_fill, + ); + final playSize = tester.getSize(find.byIcon(CupertinoIcons.play_fill)); + expect(playSize.width, lessThan(pauseSize.width)); + expect(playSize.width / pauseSize.width, inInclusiveRange(0.85, 0.95)); + expect(tester.getRect(play), pauseBounds); + expect(tester.getRect(previous), previousBounds); + expect(tester.getRect(next), nextBounds); + expect(tester.getRect(find.byType(MornyeVolumeControl)), volumeBounds); + + playback.add(PlaybackState(playing: true)); + await tester.pumpAndSettle(); + expect( + tester.getSize(find.byIcon(CupertinoIcons.pause_fill)), + pauseSize, + ); + expect(tester.getRect(pause), pauseBounds); + expect(tester.takeException(), isNull); + }, + ); + } + testWidgets('Mornye player renders Apple-style transport controls', ( tester, ) async {