Skip to content

feat(bolt): white-core glow pulse for in-flight zap#573

Open
dmnyc wants to merge 1 commit into
barrydeen:mainfrom
dmnyc:feat/zap-bolt-glow-pulse
Open

feat(bolt): white-core glow pulse for in-flight zap#573
dmnyc wants to merge 1 commit into
barrydeen:mainfrom
dmnyc:feat/zap-bolt-glow-pulse

Conversation

@dmnyc

@dmnyc dmnyc commented May 26, 2026

Copy link
Copy Markdown
Contributor

Slim carve-out from #556. Single-file animation rewrite of the action-bar bolt for in-flight zaps. Ports iOS commit #6 from feat/one-tap-zap.

What changes

Replaces the existing alpha+scale LightningAnimation (tween(600) reverse-repeat) with a sin-eased single-oscillator on a 0.9s period:

  • sine ∈ [-1, 1], phase ∈ [0, 1] = (sine + 1) / 2
  • iconScale = 1.0 + 0.10 * sine (0.90 → 1.10)
  • verticalOffset = -0.5 * sine (±0.5dp, centered on baseline — kept tight so the bolt doesn't lift off the action-bar baseline and misalign with neighbouring glyphs)

The silhouette stays solid white; three stacked stroked shadows behind it do the warm-glow work:

  • Inner stroke1.5dp, constant width, holds the white core's outline
  • Medium glow4 + 3·phase dp, breathes with the phase
  • Outer halo8 + 6·phase dp, widest bleed, breathes with the phase, alpha 0.3 → 0.8

All three shadows tint with WispThemeColors.zapColor.

Note for reviewer

Main already has WispThemeColors.zapAnimationColor (added by #558) — a vivid-floored variant of zapColor specifically for animations so the burst never reads muddy on light backgrounds. The bolt animation still tints with zapColor in this PR to keep the carve-out faithful to the original commit; we can swap to zapAnimationColor here in a follow-up if that's preferred.

Files

  • app/src/main/kotlin/com/wisp/app/ui/component/ActionBar.kt (+52 / −35)

Test plan

  • Trigger an in-flight zap (any send-zap action) → bolt pulses with a soft warm halo around a solid white core
  • Light mode: glow reads as warm orange against the near-white background, not as a flat alpha smear
  • Dark mode: glow reads as vivid orange against the near-black background
  • Bolt stays anchored on the action-bar baseline — no vertical wobble visible against neighbouring icons

Carve-out context

PRs in the series so far: #570 (wallet setup polish), #571 (wallet dashboard polish), #572 (drop relay-backup status list).

Ports iOS commit barrydeen#6 from feat/one-tap-zap. Replaces the multi-layer
Canvas bolt animation that was smearing the silhouette at scale
peaks. New approach: always-white silhouette + three stacked
zap-color shadows underneath, driven by a single sin-eased
oscillator.

Math (period 0.9s):
  sine    ∈ [-1, 1]
  phase   ∈ [0, 1]      = (sine + 1) / 2
  iconScale       = 1.0 + 0.10 * sine   (0.90 → 1.10)
  verticalOffset  = -0.5 * sine          (±0.5dp centered on baseline)

Shadow layers (Canvas strokes — drawn outer → inner so the white
core sits on top):
  outer  — radius 8 + 6*phase dp,  α = 0.30 + 0.50*phase
  medium — radius 4 + 3*phase dp,  α = 0.55 + 0.45*phase
  inner  — radius 1.5dp constant,  α = 0.95
  core   — solid white silhouette, untinted

Vertical motion held to ±0.5dp so the icon doesn't lift off the
action-bar baseline and misalign with neighbouring glyphs. The
white IS the luminous core; the warm halos do the heat work.

LinearEasing on the sineAngle (not FastOutSlowInEasing) — the
sine function itself supplies the easing curve. Wrapping with
another easing would double-stack and visibly stutter.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant