diff --git a/apps/desktop/lib/src/controls/minimal/timeline.dart b/apps/desktop/lib/src/controls/minimal/timeline.dart index 4e654cf..02e2a77 100644 --- a/apps/desktop/lib/src/controls/minimal/timeline.dart +++ b/apps/desktop/lib/src/controls/minimal/timeline.dart @@ -28,6 +28,9 @@ abstract final class MinimalTimelineSpec { /// What is left of it while they are hidden. static const lineSize = 3.0; + /// The played part's accent tint. + static const played = 0.4; + /// The position line. static const lineWidth = 2.0; static const fontSize = 15.0; @@ -467,13 +470,10 @@ class MinimalTimelinePainter extends CustomPainter { final w = size.width, h = size.height; final x = lineX(w); final band = Offset.zero & size; - // The band, darker as it grows; hidden, a faint track. - canvas.drawRect(band, Paint()..color = Color.lerp(const Color(0x40FFFFFF), MinimalStyle.band, visibility)!); - // Played: an accent tint, solid once the band is a line. - canvas.drawRect( - Rect.fromLTRB(0, 0, x, h), - Paint()..color = accent.withValues(alpha: 0.28 + 0.72 * (1 - visibility)), - ); + // The same colours shown and hidden: hidden, it is the band shrunk to + // a line, so growing and shrinking never switches colour. + canvas.drawRect(band, Paint()..color = MinimalStyle.band); + canvas.drawRect(Rect.fromLTRB(0, 0, x, h), Paint()..color = accent.withValues(alpha: MinimalTimelineSpec.played)); _stripes(canvas, w, h); _chapters(canvas, w, h); if (visibility > 0) { @@ -500,7 +500,8 @@ class MinimalTimelinePainter extends CustomPainter { canvas.save(); canvas.clipRect(Rect.fromLTRB(ax, 0, w, h)); final paint = Paint() - ..color = Colors.white.withValues(alpha: 0.10 + 0.08 * (1 - visibility)) + // Stronger on the line, where only a few pixels of each show. + ..color = Colors.white.withValues(alpha: 0.12 + 0.22 * (1 - visibility)) ..strokeWidth = 1.5 * scale; for (var c = (ax / period).floorToDouble() * period - h; c <= w; c += period) { canvas.drawLine(Offset(c, h), Offset(c + h, 0), paint); @@ -509,7 +510,7 @@ class MinimalTimelinePainter extends CustomPainter { } void _chapters(Canvas canvas, double w, double h) { - final cut = Paint()..color = Colors.black.withValues(alpha: 0.55); + final cut = Paint()..color = Colors.black.withValues(alpha: 0.3); for (final f in chapters) { if (f <= 0) continue; final cx = w * f; diff --git a/docs/ARCHITECTURE.md b/docs/ARCHITECTURE.md index 668ff77..edfb046 100644 --- a/docs/ARCHITECTURE.md +++ b/docs/ARCHITECTURE.md @@ -2204,7 +2204,7 @@ Player controls (`lib/src/controls/`): one controls model, two skins. glass capsules (`MinimalCapsule`, the pills' tint and hairline; `MinimalButton` rounded squares, the play button a filled accent circle) above `MinimalTimeline`, a 36 px band across the bottom: the - played part tinted in the theme's primary, the position a white line, + played part tinted in the theme's primary (40 %), the position a white line, the part not downloaded yet (from `buffered`, or the position when that is behind, to the end) in thin stripes, chapter starts as dots on the top edge with a dark cut through the band (a press within reach of @@ -2214,7 +2214,11 @@ Player controls (`lib/src/controls/`): one controls model, two skins. not reach the end). Hover: a faint line and a glass tip with the time (the chapter title above it). A press seeks, every drag move seeks, after release the line stays at the target until the position catches - up (at most 2 s). Hidden, it shrinks (120 ms) to a 3 px progress line. + up (at most 2 s). Hidden, it shrinks (120 ms) to a 3 px progress line +that is the band itself, smaller: the same dark band, the same played +tint (40 % of the accent), so growing or shrinking never changes colour; +the stripes are stronger on the line (a few pixels of each show) so the +part not downloaded still reads; chapter cuts are a light dark line. We know only the end of mpv's cache, so a dropped back buffer is not shown. - **Settings** (`AppSettings`, `model/controls_prefs.dart`, all live):