Cycle animation for loading

Anfänger

Dienstag, 2. September 2014, 18:13

Cycle animation for loading

Heoll everyone
The Krpano default skin loading is static text "Loading...", If I want to"..." The three dots made cycle animation, then the code should be
how to write? To make these three points can be repeatedly show hidden.
As shown in Fig.

»zjcxfeng« hat folgendes Bild angehängt:

Zum Seitenanfang

tmhok

Fortgeschrittener

Beiträge: 171

Mittwoch, 3. September 2014, 06:23

Zitat von »zjcxfeng«

The Krpano default skin loading is static text "Loading...", If I want to"..." The three dots made cycle animation, then the code should be
how to write? To make these three points can be repeatedly show hidden.

http://www.krpano.com/examples/117/examp…s/progress.html

Zum Seitenanfang

klaus.krpano

Administrator

Beiträge: 13 499

Montag, 8. September 2014, 18:38

Hi,

that would be possible this way:

1. look in the vtourskin.xml for the 'skin_showloading' <action> and change it to this one:

Quellcode

<action name="skin_showloading">
    set(layer[skin_loadingtext].visible, %1);
    copy(lasttick, timertick);
    asyncloop(layer[skin_loadingtext].visible,
        copy(tick, timertick);
        sub(tt, tick, lasttick);
        if(tt GT 200,
            copy(lasttick, tick);
            switch(layer[skin_loadingtext].html, 'loading', 'loading.', 'loading..', 'loading...');
          );
       );
</action>

This action will start an asynchronous loop as long as the loading text is visible - and inside the loop it will measure if 200ms are elapsed - and once they are elapsed, the text will be changed step by step from 'loading' to 'loading...'.

2. By default the loading text element is 'autosized' to it's text content - so to avoid a moving text during the text changes, set a fixed width for the 'skin_loadingtext' <layer> element - e.g. width="100" should work: