The viewer's top/bottom bars still used the pre-rework FrostedGlassContainer verbatim: a floating inset pill with a Material colorScheme tint, an outline border and a drop shadow (violating the design system's no-shadow rule), and theme-derived icon colors that went near-invisible against the new dark panel in light mode. The video transport controls were a second, separate floating pill above the action bar instead of one continuous panel. - FrostedGlassContainer: drop the shadow/border/ColorScheme tint for a fixed dark translucent fill matching the approved design canvas: no shadow anywhere in this screen now. - file_viewer_screen.dart: top/bottom bars sit flush edge-to-edge (no floating-pill inset) with a gradient scrim behind each, and use fixed white (not theme-derived) text/icon color, since this chrome always sits over a black media stage regardless of app theme. - ViewerIconButton: same fix - fixed white by default instead of colors.fg1. - MediaActionBar: takes an optional transportControls slot so video's transport row renders inside the same panel as the action row, above a thin divider, instead of as a separate floating pill. - MediaVideoPreview: renders only the video surface now; reports its controller up via onController (only when active, so a neighboring PageView page can't steal the transport row) instead of owning a floating panel. VideoTransportControls is the extracted, chrome-less transport row content, rendered by the parent via MediaActionBar's new slot. Verified live on device: photo and video viewing, favorite/delete coloring, and the merged transport+action panel all match the approved canvas (https://claude.ai/artifact/3AGPqqMdkLSC2ypCh2CQs4). Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
49 lines
1.6 KiB
Dart
49 lines
1.6 KiB
Dart
import 'package:flutter/material.dart';
|
|
|
|
/// Icon-only action button for the media viewer's floating chrome (top bar,
|
|
/// bottom action bar, video transport controls) - a fixed 22px icon in a
|
|
/// round hit box. Colored white by default, not from [NooColors]/
|
|
/// [ColorScheme]: this chrome always sits on the dark translucent panel
|
|
/// over a black media stage (see `FrostedGlassContainer`'s doc comment),
|
|
/// regardless of the app's light/dark theme, so a theme-derived color would
|
|
/// go near-invisible in light mode. Kept as one small widget so every
|
|
/// floating control in this screen looks the same instead of drifting
|
|
/// apart across the three call sites that need one.
|
|
class ViewerIconButton extends StatelessWidget {
|
|
final IconData icon;
|
|
final String tooltip;
|
|
final VoidCallback? onTap;
|
|
|
|
/// Overrides the default white (e.g. `danger` for delete, `accent-text`
|
|
/// for a favorited state). Ignored while [onTap] is null - a disabled
|
|
/// button always dims to faded white regardless of its normal color.
|
|
final Color? color;
|
|
|
|
const ViewerIconButton({
|
|
super.key,
|
|
required this.icon,
|
|
required this.tooltip,
|
|
required this.onTap,
|
|
this.color,
|
|
});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final fg = onTap == null
|
|
? Colors.white.withValues(alpha: 0.4)
|
|
: (color ?? Colors.white);
|
|
|
|
return Tooltip(
|
|
message: tooltip,
|
|
child: InkWell(
|
|
onTap: onTap,
|
|
customBorder: const CircleBorder(),
|
|
child: Padding(
|
|
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 12),
|
|
child: Icon(icon, color: fg, size: 22),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|