Skip to main content
heyo
Associate III
January 16, 2024
Solved

Scroll animation

  • January 16, 2024
  • 3 replies
  • 1938 views

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.

This topic has been closed for replies.
Best answer by Mohammad MORADI ESFAHANIASL

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!

3 replies

ST Employee
January 26, 2024

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 MORADIST Software Developer | TouchGFX
heyo
heyoAuthor
Associate III
February 2, 2024

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

ST Employee
February 2, 2024

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 MORADIST Software Developer | TouchGFX