Splash Screen when web page is loading

Flow
1

Hello :slight_smile:

I’m new in vaadin and I see, that when user goes to my webpage, there’s a moment where page loads and it’s blank (few seconds).
When you go to vaadin.com, there’s a splash sceen (loading Vaadin logo).

I searched the forum and I did not find a solution how to implement something like this, so that the user knows that something is happening and page works.

Is there a way to quick setup this? Like put an img “Loading…” or any gif?

Thanks!

2

have a look at PageConfigurator.configurePage(InitialPageSettings settings);
You may want to disable the default theme of the LoadingIndicator using

LoadingIndicatorConfiguration conf = settings.getLoadingIndicatorConfiguration();
conf.setApplyDefaultTheme(false);

and then apply CSS to it.

3

I am really struggling with this. I am very new to Vaadin; I am using flow (14) and have a MainView class (extends Composite) and an Application class running an embedded Jetty server.

Please can you help to show me how to integrate a splashscreen using PageConfigurator.configurePage(InitialPageSettings settings)?

Thanks
Jim

4

Have a look here for splash screen:

https://vaadin.com/forum/thread/18285600/how-to-implement-initial-page-loading-animation-like-on-vaadin-com