Skip to content

Commit

Permalink
Improve layout animation
Browse files Browse the repository at this point in the history
This adds an improvement to layout animation. When updating layout bounds (for example when a parent layout resizes), we were initially setting elapsedSeconds to 0. This restarts the animation, however in cases when the layout bounds is constantly updating (see attached videos), the animation would never progress until the layout bounds stopped updating. An alternative was to not reset elapsedSeconds which was also tested, but in that case the result was odd visual issues like snapping to the new layout bounds (in cases where elapsedSeconds was close to the animation duration).

An interim solution (until we find a better one) is to only reset elapsedSeconds to 0 if it is greater than some arbitrary time, thus the animation will continue to progress relatively smoothly.

Here are the scenarios. This PR implements the 3rd option.

**Always set elapsedSeconds to 0 when updating layout bounds**

https://github.com/user-attachments/assets/d430edba-37f4-408d-843f-9f67abfb101d

**Never set elapsedSeconds to 0 when updating layout bounds**

https://github.com/user-attachments/assets/a8abae5b-647a-437e-9c0f-09d681d6716e

**Set elapsedSeconds to 0 after some time has elapsed**

https://github.com/user-attachments/assets/3d63cb14-2977-4ea5-b38d-3fcca1f1a666

Diffs=
4732c37b5 Improve layout animation (#7712)

Co-authored-by: Philip Chung <philterdesign@gmail.com>
  • Loading branch information
philter and philter committed Jul 29, 2024
1 parent 7b2347c commit 2e513d2
Show file tree
Hide file tree
Showing 2 changed files with 5 additions and 2 deletions.
2 changes: 1 addition & 1 deletion .rive_head
Original file line number Diff line number Diff line change
@@ -1 +1 @@
a56419984ccdd39989f7c059a8af2ebbceb379a0
4732c37b5e8afae84ec54d662682380598292ac3
5 changes: 4 additions & 1 deletion src/layout_component.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -532,12 +532,15 @@ void LayoutComponent::updateLayoutBounds()
if (left != toBounds.left() || top != toBounds.top() || width != toBounds.width() ||
height != toBounds.height())
{
m_animationData.elapsedSeconds = 0;
m_animationData.fromBounds = AABB(m_layoutLocationX,
m_layoutLocationY,
m_layoutLocationX + this->width(),
m_layoutLocationY + this->height());
m_animationData.toBounds = AABB(left, top, left + width, top + height);
if (m_animationData.elapsedSeconds > 0.1)
{
m_animationData.elapsedSeconds = 0;
}
propagateSize();
markWorldTransformDirty();
}
Expand Down

0 comments on commit 2e513d2

Please sign in to comment.