cancel
Showing results for 
Search instead for 
Did you mean: 

Scroll animation

heyo
Senior

Does in the TouchGFX is scrollable container animation? I use doScroll() function but it would be nicer if it scrolls automatically with animation or smoothly.

1 ACCEPTED SOLUTION

Accepted Solutions

Hello @heyo ,

Scrollable container does not provide a function for animation directly, however, you can use Easing Equations to calculate the deltas to have a smoother scroll. You can use a method similar to this:

#include "touchgfx/EasingEquations.hpp" //To have Easing Equations //If new item is inserted, set the animationIsRunning to true void Screen1View::handleTickEvent() { if (animationIsRunning) { scrollWithAnimation(); } } void Screen1View::scrollWithAnimation() { const int duration = 50; if (animationCounter <= duration) { int16_t delta = EasingEquations::linearEaseIn(animationCounter, 0, /* The final scroll value */, duration); scrollableContainer1.doScroll(0, delta); //If scrolling vertically scrollableContainer1.invalidate(); animCounter++; } else { animationCounter = 0; animationIsRunning = false; } }

 

I hope this helps you!

Mohammad MORADI
ST Software Developer | TouchGFX

View solution in original post

3 REPLIES 3

Hello @heyo ,

Scrollable container does not provide a function for animation directly, however, you can use Easing Equations to calculate the deltas to have a smoother scroll. You can use a method similar to this:

#include "touchgfx/EasingEquations.hpp" //To have Easing Equations //If new item is inserted, set the animationIsRunning to true void Screen1View::handleTickEvent() { if (animationIsRunning) { scrollWithAnimation(); } } void Screen1View::scrollWithAnimation() { const int duration = 50; if (animationCounter <= duration) { int16_t delta = EasingEquations::linearEaseIn(animationCounter, 0, /* The final scroll value */, duration); scrollableContainer1.doScroll(0, delta); //If scrolling vertically scrollableContainer1.invalidate(); animCounter++; } else { animationCounter = 0; animationIsRunning = false; } }

 

I hope this helps you!

Mohammad MORADI
ST Software Developer | TouchGFX

Sorry but it's working like doScroll() function..

If you press insert new item rapidly, there might be a chance that the animation is not ended yet and the new item is added quickly. You have to allow the animation steps to end before adding a new item

Mohammad MORADI
ST Software Developer | TouchGFX