--- title: Adding A Splash Screen order: 85 layout: page --- [[adding-a-splash-sreen]] Adding a splash screen ---------------------- When a Vaadin application is loading a loading indicator is automatically shown so the user knows something is happening. But what if we want to show something else, like a custom splash screen for our product? Or just customize the loading indicator? Let's have a look. During the Vaadin bootstrap there are a couple of div elements added to the page which we can use for our custom splash screen. The DOM for a servlet application looks the like the following when starting up: [source,html] ....
.... In this example _splash_ is the name of our theme. The _v-app-loading_ div is meant for styling the loading screen. It will only exist in the DOM until the widget set has been loaded and the application starts. At that point the _v-app-loading_ div is removed and replaced by the actual components for the application. Styling the loading screen is then as simple as adding some rules for _v-app-loading_, for example: [source,scss] .... .v-generated-body &.v-app .v-app-loading { height: 100%; width: 100%; background-image: url(http://archive.eclipse.org/eclipse/downloads/drops/R-3.3-200706251500/whatsnew/images/splash.png); background-repeat: no-repeat; background-position: 50%; } .... This will use an Eclipse logo as your splash screen - change the background image to your own splash screen or redesign the css completely to your liking. *Note that Vaadin 7.0 incorrectly does not add the theme name during bootstrap. You must therefore use a rule without the theme name, e.g. `.v-generated-body .v-app .v-app-loading` and move it out of the @mixin. You also need to ensure the v-app div has a height using `.v-app {height:100%;}`* e='changelog-8.27.1'>changelog-8.27.1 Vaadin 6, 7, 8 is a Java framework for modern Java web applications: https://github.com/vaadin/frameworkwww-data
aboutsummaryrefslogtreecommitdiffstats
path: root/documentation/articles/UsingServerInitiatedEvents.asciidoc
blob: 26221e9ac2fd586dcfd2ffde0555b8d9d59e2c1e (plain) 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130