Skip to content

fix: align DayAnimated sticky header with inline separators (Telegram-style push)#2749

Closed
kesha-antonov wants to merge 1 commit into
masterfrom
fix/dayanimated-telegram-push
Closed

fix: align DayAnimated sticky header with inline separators (Telegram-style push)#2749
kesha-antonov wants to merge 1 commit into
masterfrom
fix/dayanimated-telegram-push

Conversation

@kesha-antonov

Copy link
Copy Markdown
Collaborator

Problem

The animated day header (DayAnimated) is a floating overlay, while the day separators are rendered inline in the list. For the effect to read as a single iOS-Telegram-style sticky header, the two must hand off at the exact same screen line. They didn't:

  • The floating header pins at DAY_PIN_OFFSET, but an inline separator's pill sits DAY_MARGIN_TOP lower (the Day container's marginTop), while the floating header overrides that margin to 0.
  • The handoff used the wrong threshold, so the inline separator stayed fully visible until it had scrolled well past the floating header.

Result, visible at every day boundary while scrolling: a brief duplicate date badge (same date shown twice) and a vertical jump as the date switched.

Fix

Introduce a shared DAY_HANDOFF_OFFSET = DAY_PIN_OFFSET - DAY_MARGIN_TOP used by both sides so they hand off at the same pixel:

  • Floating header picks the stuck day at separatorScreenTop <= DAY_HANDOFF_OFFSET, and the next (newer) day's separator pushes it up: top = min(DAY_PIN_OFFSET, nextSeparatorScreenTop + DAY_MARGIN_TOP - headerHeight), so the floating pill's bottom rests exactly on the rising separator's pill. The outgoing date slides up and off as the incoming arrives - a single clean push.
  • Inline separator fades out across [DAY_HANDOFF_OFFSET, DAY_HANDOFF_OFFSET + fade], i.e. exactly as it reaches the line where the floating header takes over. No duplicate, no gap, no jump.

Fade timing tightened to match Telegram (fast fade-in, short idle delay, then fade-out), behind a DEBUG_TIME_SCALE constant (=1) for future frame-by-frame tuning. Also dropped the now-unused messages prop from DayAnimated.

Validation

Validated on the Android simulator with a 7-day data set, stepping through day boundaries frame-by-frame:

  • Floating header shows the correct top day, pinned.
  • At a boundary the outgoing date is pushed up and off while the incoming arrives at the same line - no duplicate badge, no jump.
  • At rest the header fades out (Telegram shows the date only while scrolling).

…-style push)

The floating day header is an overlay while the day separators are rendered
inline in the list, so the two must hand off at exactly the same screen line
to read as a single sticky header. They were misaligned: the floating header
pinned at DAY_PIN_OFFSET but the inline separator's pill sits DAY_MARGIN_TOP
lower (Day's container marginTop), while the floating overrides that margin to
0. The handoff used the wrong threshold (the inline stayed fully visible until
it scrolled well past the floating), producing a brief duplicate date badge
and a vertical jump at every day boundary.

Introduce a shared DAY_HANDOFF_OFFSET (= DAY_PIN_OFFSET - DAY_MARGIN_TOP) used
by both the floating header (which day is stuck, and the push offset) and the
inline separator's fade-out, so the incoming inline separator fades out at the
exact pixel the floating header takes over. The push now rests the floating
pill's bottom on the rising separator's pill (top = min(DAY_PIN_OFFSET,
nextSeparatorScreenTop + DAY_MARGIN_TOP - headerHeight)) so the outgoing date
slides up and off as the incoming arrives - a single clean sticky push.

Also tighten the fade timing to match Telegram (fast fade-in, short idle delay
then fade-out) behind a DEBUG_TIME_SCALE knob for future frame-by-frame tuning,
and drop the now-unused messages prop from DayAnimated.
@kesha-antonov kesha-antonov deleted the fix/dayanimated-telegram-push branch June 18, 2026 20:59
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