david1465833828/TPSchedule
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Rebrand as TPSchedule and refine clear liquid glass dock

Browse Source
This commit is contained in:
Codex
2026-10-13 22:08:20 +08:00
parent 50fcc70e8e
commit 204e945b2e
45 changed files with 1155 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files
mobile/test/widgets/glass_material_test.dart
+270
View File
@@ -0,0 +1,270 @@
import 'dart:io';
import 'dart:typed_data';
import 'dart:ui' as ui;
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter_test/flutter_test.dart';
import 'package:hepan_everyday/widgets/glass_dock.dart';
import 'package:hepan_everyday/widgets/glass_refraction.dart';
void main() {
testWidgets(
'glass softens fine background detail without whitening its colour',
(tester) async {
final pixels = await _render(
tester,
const GlassRefraction(strength: 0.32, child: SizedBox.expand()),
stripes: true,
);
final reds = [for (var x = 110; x < 150; x++) _channel(pixels, x, 34, 0)];
final contrast =
reds.reduce((a, b) => a > b ? a : b) -
reds.reduce((a, b) => a < b ? a : b);
expect(contrast, lessThan(25));
expect(_channel(pixels, 132, 34, 0), closeTo(130, 15));
expect(_channel(pixels, 132, 34, 1), closeTo(120, 15));
expect(_channel(pixels, 132, 34, 2), closeTo(140, 15));
expect(_channel(pixels, 132, 34, 3), 255);
},
);
testWidgets(
'Dock lens preserves the backdrop colour through its neutral tint',
(tester) async {
final pixels = await _render(
tester,
GlassDock(selectedIndex: 0, onSelected: (_) {}),
);
// Below the symbol and away from the rim, the selected lens should retain
// most of this saturated cyan backdrop instead of painting a grey pill.
final red = _channel(pixels, 46, 52, 0);
final green = _channel(pixels, 46, 52, 1);
final blue = _channel(pixels, 46, 52, 2);
expect(red, lessThan(50));
expect(green - red, greaterThan(130));
expect(blue - red, greaterThan(165));
},
);
testWidgets('Dock base and selected lens both soften the live backdrop', (
tester,
) async {
final pixels = await _render(
tester,
GlassDock(selectedIndex: 0, onSelected: (_) {}),
stripes: true,
preview: true,
);
for (final start in [32, 160]) {
final reds = [
for (var x = start; x < start + 20; x++) _channel(pixels, x, 52, 0),
];
final contrast =
reds.reduce((a, b) => a > b ? a : b) -
reds.reduce((a, b) => a < b ? a : b);
expect(contrast, lessThan(30), reason: 'background at x=$start');
}
});
testWidgets(
'Dock keeps larger backdrop details recognizable through its glass',
(tester) async {
final pixels = await _render(
tester,
GlassDock(selectedIndex: 0, onSelected: (_) {}),
stripes: true,
stripeWidth: 12,
preview: true,
);
for (final start in [24, 160]) {
final reds = [
for (var x = start; x < start + 40; x++) _channel(pixels, x, 52, 0),
];
final contrast =
reds.reduce((a, b) => a > b ? a : b) -
reds.reduce((a, b) => a < b ? a : b);
// The original stripes have 180 levels of contrast. Both the base and
// selected lens retain over half, keeping these larger shapes readable.
expect(contrast, greaterThan(90), reason: 'background at x=$start');
}
},
);
testWidgets(
'composed diffusion keeps edge refraction aligned when glass moves',
(tester) async {
final plain = await _render(
tester,
const GlassRefraction(strength: 0, child: SizedBox.expand()),
gradient: true,
);
final refracted = await _render(
tester,
const GlassRefraction(strength: 1, child: SizedBox.expand()),
gradient: true,
);
final translated = await _render(
tester,
const GlassRefraction(strength: 1, child: SizedBox.expand()),
gradient: true,
offset: const Offset(23, -37),
);
expect(
(_channel(refracted, 15, 34, 0) - _channel(plain, 15, 34, 0)).abs(),
greaterThan(3),
);
expect(
_channel(refracted, 132, 34, 0),
closeTo(_channel(plain, 132, 34, 0), 2),
);
for (final x in [15, 132, 248]) {
expect(
_channel(translated, x, 34, 0),
closeTo(_channel(refracted, x, 34, 0), 2),
);
}
},
skip: !ui.ImageFilter.isShaderFilterSupported,
);
}
int _channel(ByteData pixels, int x, int y, int channel) =>
pixels.getUint8((y * 264 + x) * 4 + channel);
Future<ByteData> _render(
WidgetTester tester,
Widget glass, {
bool stripes = false,
double stripeWidth = 2,
bool gradient = false,
bool preview = false,
Offset offset = Offset.zero,
}) async {
tester.view.physicalSize = const Size(800, 600);
tester.view.devicePixelRatio = 1;
addTearDown(tester.view.resetPhysicalSize);
addTearDown(tester.view.resetDevicePixelRatio);
final key = GlobalKey(), glassKey = GlobalKey();
await tester.pumpWidget(
RepaintBoundary(
key: key,
child: MaterialApp(
home: Center(
child: Transform.translate(
offset: offset,
child: SizedBox(
key: glassKey,
width: 264,
height: 68,
child: Stack(
children: [
Positioned.fill(
child: CustomPaint(
painter: _Backdrop(stripes, gradient, stripeWidth),
),
),
Positioned.fill(child: glass),
],
),
),
),
),
),
),
);
if (ui.ImageFilter.isShaderFilterSupported) {
// Native shader loading completes outside the widget test's fake async zone.
await tester.runAsync(
() => ui.FragmentProgram.fromAsset('shaders/liquid_glass.frag'),
);
}
await tester.pumpAndSettle();
if (ui.ImageFilter.isShaderFilterSupported) {
expect(find.byType(BackdropFilter), findsNothing);
}
return (await tester.runAsync(() async {
final boundary =
key.currentContext!.findRenderObject()! as RenderRepaintBoundary;
final image = await boundary.toImage(pixelRatio: 1);
final data = (await image.toByteData(format: ui.ImageByteFormat.rawRgba))!;
final region = tester.getRect(find.byKey(glassKey));
if (preview && const bool.fromEnvironment('TP_BRAND_PREVIEW')) {
final recorder = ui.PictureRecorder();
ui.Canvas(recorder).drawImageRect(
image,
region,
const Rect.fromLTWH(0, 0, 792, 204),
Paint()..filterQuality = FilterQuality.high,
);
final picture = recorder.endRecording();
final previewImage = await picture.toImage(792, 204);
final png = (await previewImage.toByteData(
format: ui.ImageByteFormat.png,
))!;
final output = File('../dist/screenshots/glass-frosted-dock.png');
await output.parent.create(recursive: true);
await output.writeAsBytes(png.buffer.asUint8List());
previewImage.dispose();
picture.dispose();
}
final cropped = ByteData(264 * 68 * 4);
for (var y = 0; y < 68; y++) {
for (var x = 0; x < 264; x++) {
final source =
((region.top.round() + y) * image.width + region.left.round() + x) *
4;
for (var channel = 0; channel < 4; channel++) {
cropped.setUint8(
(y * 264 + x) * 4 + channel,
data.getUint8(source + channel),
);
}
}
}
image.dispose();
return cropped;
}))!;
}
class _Backdrop extends CustomPainter {
const _Backdrop(this.stripes, this.gradient, this.stripeWidth);
final bool stripes;
final bool gradient;
final double stripeWidth;
@override
void paint(Canvas canvas, Size size) {
if (gradient) {
for (var x = 0; x < size.width; x++) {
canvas.drawRect(
Rect.fromLTWH(x.toDouble(), 0, 1, size.height),
Paint()..color = Color.fromARGB(255, 40 + (x * 0.7).round(), 70, 90),
);
}
return;
}
if (!stripes) {
canvas.drawRect(
Offset.zero & size,
Paint()..color = const Color(0xFF14B4E6),
);
return;
}
for (var x = 0.0; x < size.width; x += stripeWidth) {
canvas.drawRect(
Rect.fromLTWH(x, 0, stripeWidth, size.height),
Paint()
..color = (x / stripeWidth).round().isEven
? const Color(0xFFDC3C3C)
: const Color(0xFF28B4DC),
);
}
}
@override
bool shouldRepaint(_Backdrop oldDelegate) =>
oldDelegate.stripes != stripes ||
oldDelegate.gradient != gradient ||
oldDelegate.stripeWidth != stripeWidth;
}