13. Resize During Animation Must Be Handled Explicitly
Resize can happen during animation.
For example, completion overlay shows title and progress label near the artwork. If the screen changes during reveal, target coordinates become stale.
In LevelCompletionOverlayComponent:
this.unsubscribeScreenChanged = this.node.events.on(SharedUiEvents.ScreenChanged, () => {
this.completeActiveRevealStateOnResize();
this.syncDimmerLayout();
void this.trackTask(this.syncTextLayoutAfterResize());
});
If reveal is active, I complete it into a valid state:
if (this.titleRevealActive) {
void this.getRequiredTitle().runAction('completionTitleReveal', {
mode: 'complete',
targetX: this.resolveArtworkCenterX(),
targetY: this.resolveTitleY(),
});
this.titleRevealActive = false;
}
Then text layout is recalculated using the new bounds.
LevelCompletionButtonComponent uses a similar idea: if resize happens during reveal, the tween is stopped, the button is moved to final scale, and idle animation is restarted.