Load next screen after the welcome screen animation

How to
1

What do you want to achieve?

I have a welcome screen with an animation. I want to go to the next screen once the animation is finished

What have you tried so far?

I have tried to add different events, get confused on which trigger to select

Screenshot or video

Others

  • SquareLine Studio version: 1.5.3
  • Operating system:
  • Target hardware:
2

Squareline catch this only as delayed event. As trigger i preffer SCREEN LOADED. Sum all animation time and set load next screen delay.

1 Like
3

For both the events (animation of the welcome screen and for going to next screen) trigger to be screen loaded?

4

Hi. yes, as you say, the two actions should be placed on one event. The point is to give the screen change a delay value that is as long as your animation. I made a video for it.

anim

5

Hello,

So, the graphics is done. It works really great in squareline but that is not the case when it is flashed to the display. The smooth graphics is now jumpy and jittery. I’m trying to solve it as of now. I’m using ESP32 S3 Touch LCD, much appreciated if you could help.

This video shows the design in SquareLine https://youtube.com/shorts/AoRvanjku5E?feature=share

This video shows how it is in the hardware https://youtube.com/shorts/DhY1YH9xStQ?feature=share

Thank you

6

Your hardware is probably not powerful enough to play this animation, or your LVGL memory settings are not set correctly, or if you are driving the display with SPI, you should increase the SPI bus frequency. Try starting only the screen where the blue and red panels are animated, see how much it hangs and what happens.

7

Is your screen 800x480 ? Then little match course for full screen frame change is required transfer 800x480x2 bytes for RGB16bit. = around 800000 B
For crossfade x2 on every render phase read and calc 1.6MB plus transfer 0,8MB , smooth anim require 20FPS minim result memory trafic is 20x2,4MBPS = 48MBPS. Internal RAM can do this speed, but for example QSPI flash stored images can read only 20MBPS top = half of and result is half FPS on display . Next slow down is bad sw and hw … result is your video.
Some hints : A. dont crossfade fullscreen
B. dont mix big objects and animation.
C. reduce animated areas to max 300x300 pixels
…

8

Totally agree, crossfading full-screen frames kills performance fast, especially when assets are in external flash.