refine: add milky translucency and curved reflections to Dock

This commit is contained in:
Codex
2026-10-24 20:16:34 +08:00
parent 8abb132bc3
commit db953b8b3d
8 changed files with 84 additions and 32 deletions
+34 -10
View File
@@ -9,6 +9,25 @@ import 'package:hepan_everyday/widgets/glass_dock.dart';
import 'package:hepan_everyday/widgets/glass_refraction.dart';
void main() {
testWidgets(
'Dock has a milky white body while transmitting a dark backdrop',
(tester) async {
final pixels = await _render(
tester,
GlassDock(selectedIndex: 0, onSelected: (_) {}),
backdropColor: const Color(0xFF162536),
preview: true,
previewName: 'liquid-glass-milky-dark.png',
);
// Away from icons and the bevel: white glass lifts the dark background,
// while its original cool colour remains visible through the material.
final red = _channel(pixels, 160, 43, 0);
final green = _channel(pixels, 160, 43, 1);
expect(red, greaterThan(45));
expect(red, lessThan(90));
expect(green - red, closeTo(13, 6));
},
);
testWidgets('resting cursor is neutral grey and clears while held', (
tester,
) async {
@@ -21,6 +40,8 @@ void main() {
// Sample beside the visible label, away from icon glow and glass rims.
final selected = _channel(resting, 16, 43, 0);
final base = _channel(resting, 160, 43, 0);
// On a white page the white glass must not turn into a grey veil.
expect(base, greaterThanOrEqualTo(240));
expect(base - selected, greaterThan(20));
expect((_channel(resting, 16, 43, 2) - selected).abs(), lessThan(12));
final held = await _render(
@@ -64,11 +85,11 @@ void main() {
final red = _channel(pixels, 16, 40, 0);
final green = _channel(pixels, 16, 40, 1);
final blue = _channel(pixels, 16, 40, 2);
expect(red, lessThan(85));
expect(green - red, greaterThan(95));
// The strongest resting tint (34%) and base veil (5%) retain about 63%
// of the source's 210-level blue/red contrast, including the shorter rim.
expect(blue - red, greaterThan(130));
expect(red, lessThan(115));
expect(green - red, greaterThanOrEqualTo(80));
// The milky base and resting grey lens still transmit over half of the
// cyan source's 210-level blue/red contrast rather than becoming opaque.
expect(blue - red, greaterThan(105));
},
);
@@ -166,6 +187,7 @@ Future<ByteData> _render(
double stripeWidth = 2,
bool gradient = false,
bool preview = false,
String? previewName,
Offset offset = Offset.zero,
Color backdropColor = const Color(0xFF14B4E6),
bool held = false,
@@ -246,11 +268,13 @@ Future<ByteData> _render(
final png = (await previewImage.toByteData(
format: ui.ImageByteFormat.png,
))!;
final name = backdropColor == Colors.white
? held
? 'liquid-glass-held.png'
: 'liquid-glass-rest.png'
: 'liquid-glass-detail.png';
final name =
previewName ??
(backdropColor == Colors.white
? held
? 'liquid-glass-held.png'
: 'liquid-glass-rest.png'
: 'liquid-glass-detail.png');
final output = File('../dist/screenshots/$name');
await output.parent.create(recursive: true);
await output.writeAsBytes(png.buffer.asUint8List());