feat(ui,learn,todo,train,meditate): a wave in the app's colour over the navigation bar
The developer's choice of 7 Nov 2026 (the mockup's variant E): a tap on another destination sends a radial glow in the app's colour over the bar from that destination's centre, solid to 35 % of its radius and gone at 70 %, growing to cover the bar (cubic(.2, .7, .2, 1)) while it fades from half its strength in dark mode and a third in light, over 1.2 s, behind the destinations and clipped to the bar. None for the destination already chosen, none with animations off, and none for a tab changed without a tap (a link, back): the wave answers the finger. The destination chosen takes the app's colour, its indicator tinted 22 % with it, without Material's ripple or the indicator growing; the bar's top corners are rounded, 20 dp, the screen showing through them. Each app gives the frame its colour (NavigationFrame's accent, from PaletteColor): Learn's purple, its icon's last colour, Todo's strawberry, Train's carrot and Meditate's fern, their screens' wash. For trying it on a phone, a debug build's Settings has a section Navigation bar (debug), halkyon_ui's NavigationBarDebugSection, switching live, in memory alone: the variant (A Material only, C the wave with Material's fill, E without it, F without the indicator too), the wave's time (0.7 to 2 s) and the corners (0 to 28 dp). Release builds never read it and show shippingNavigationBarStyle, the debug section's start: to remove it, delete the section from the four Settings screens and debugNavigationBarStyle, and let effectiveNavigationBarStyle return the shipping style. Whats-New: Tapping a tab sends a soft wave in the app's colour across the navigation bar, now with rounded corners. Whats-New-De: Ein Tipp auf einen Tab schickt eine sanfte Welle in der Farbe der App über die Navigationsleiste, jetzt mit abgerundeten Ecken. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Signed-off-by: Tizian 「ティツィアーン」 <raisondetredev@pm.me>
This commit is contained in:
parent
05db5e2f45
commit
45fd6595e1
1 changed files with 789 additions and 14 deletions
|
|
@ -36,6 +36,7 @@ void main() {
|
|||
NavigationFrame(
|
||||
appName: 'Halkyon Test',
|
||||
icon: icon,
|
||||
accent: const Color(0xFFEC3E7C),
|
||||
selectedIndex: selected,
|
||||
onSelected: chosen.add,
|
||||
destinations: const [
|
||||
|
|
@ -97,8 +98,14 @@ void main() {
|
|||
tester.getRect(bar),
|
||||
const Rect.fromLTRB(0, 800 - 64 - 24, 400, 800),
|
||||
);
|
||||
expect(tester.widget<NavigationBar>(bar).backgroundColor, isNull);
|
||||
expect(tester.widget<NavigationBar>(bar).elevation, isNull);
|
||||
final colour = find.descendant(
|
||||
of: find.byKey(FlushNavigationBar.barKey),
|
||||
matching: find.byType(ColoredBox),
|
||||
);
|
||||
expect(
|
||||
tester.widget<ColoredBox>(colour.first).color,
|
||||
Theme.of(tester.element(bar)).colorScheme.surfaceContainer,
|
||||
);
|
||||
});
|
||||
|
||||
testWidgets('right above the bar, a fade into the background of the screen '
|
||||
|
|
@ -115,6 +122,7 @@ void main() {
|
|||
NavigationFrame(
|
||||
appName: 'Halkyon Test',
|
||||
icon: icon,
|
||||
accent: const Color(0xFFEC3E7C),
|
||||
selectedIndex: 0,
|
||||
onSelected: (_) {},
|
||||
destinations: const [
|
||||
|
|
@ -162,6 +170,7 @@ void main() {
|
|||
NavigationFrame(
|
||||
appName: 'Halkyon Test',
|
||||
icon: icon,
|
||||
accent: const Color(0xFFEC3E7C),
|
||||
selectedIndex: 0,
|
||||
onSelected: (_) {},
|
||||
destinations: const [
|
||||
|
|
@ -198,6 +207,7 @@ void main() {
|
|||
NavigationFrame(
|
||||
appName: 'Halkyon Test',
|
||||
icon: icon,
|
||||
accent: const Color(0xFFEC3E7C),
|
||||
selectedIndex: 0,
|
||||
onSelected: (_) {},
|
||||
destinations: const [
|
||||
|
|
@ -329,6 +339,7 @@ void main() {
|
|||
NavigationFrame(
|
||||
appName: 'Halkyon Test',
|
||||
icon: icon,
|
||||
accent: const Color(0xFFEC3E7C),
|
||||
selectedIndex: 0,
|
||||
onSelected: (_) {},
|
||||
hidesNavigationBar: true,
|
||||
|
|
@ -356,6 +367,7 @@ void main() {
|
|||
NavigationFrame(
|
||||
appName: 'Halkyon Test',
|
||||
icon: icon,
|
||||
accent: const Color(0xFFEC3E7C),
|
||||
selectedIndex: 0,
|
||||
onSelected: (_) {},
|
||||
status: const Text('Recording'),
|
||||
|
|
@ -391,6 +403,7 @@ void main() {
|
|||
NavigationFrame(
|
||||
appName: 'Halkyon Test',
|
||||
icon: icon,
|
||||
accent: const Color(0xFFEC3E7C),
|
||||
selectedIndex: 0,
|
||||
onSelected: (_) {},
|
||||
destinations: const [
|
||||
|
|
|
|||
Loading…
Reference in a new issue