fix(layers): anchor timeline scale animation on layer visual center#843
Merged
Conversation
A layer combining a slide-in (e.g. from the top) with a scale-in drifted in diagonally instead of straight down. Transform.scale used the default center alignment (the layout-box center), but the layer content is painted shifted by _fractionalOffset (default -0.5,-0.5), placing its visual center at the box top-left. Scaling around the box center pulled the shrinking layer toward the center (down-right), which combined with the slide read as entering from the top-right. Anchor the scale on the layer's visual center via Alignment(2*fo.dx, 2*fo.dy), plumbing the layer's fractional offset into LayerTimelineVisibility. Adds regression tests covering the anchor for the default and centered offsets.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Problem
A layer whose video-timeline animation combines a slide-in (e.g. from the top) with a scale-in did not enter straight — it drifted in diagonally, appearing to come "from the top-right".
Root cause
The scale was applied with
Transform.scale's defaultalignment: Alignment.center, which scales around the layout-box center. But the layer content is painted shifted by_fractionalOffset(default(-0.5, -0.5)), so the layer's visual center actually sits at the box's top-left corner. Scaling around the box center pulls the shrunk layer toward the center — down and to the right — decaying to zero as scale reaches 1. Combined with the slide-from-top, this reads as entering from the top-right instead of straight down.This also meant the in-editor preview disagreed with the natively rendered export, which scales around the true center.
Fix
Anchor the scale on the layer's visual center. With fractional offset
fo, the visual center is at box fraction(0.5+fo.dx, 0.5+fo.dy), i.e.Transform.scalealignmentAlignment(2·fo.dx, 2·fo.dy)—Alignment.topLeftfor the default(-0.5,-0.5). The layer's fractional offset is plumbed intoLayerTimelineVisibility.With the anchor fixed, scaling introduces no horizontal (or vertical) drift, so a slide-from-top brings the layer straight down.
Tests
Two regression tests added covering the scale anchor for the default
(-0.5,-0.5)offset (→topLeft) and a centered(0,0)offset (→center). All 14 tests in the suite pass anddart analyzeis clean.