Update
The tutorial below shows a trick to "mask" the preloading time. Since I wrote this tutorial I experimented a lot and I finally managed to make a plugin which does the real layout preloading. You can see how it works in the video added to the plugin's store item here: MM_Preloader (layout preloader)
---------------------------------------------------------------------------
The problem
When we have a lot of objects in the layout we are jumping to, we can clearly feel some lag while switching from one to another. The reason is simple and well known - game engine has to load and render all objects on the layout. This can take from less then a second up to 10 (or maybe even more) seconds on weaker devices.
The solutions idea
The nice workaround for that is using loading screens. It simply means that you show some "loading" message (or black fade in/out - whatever fits your project better) just before you go to another layout and hide it after everything gets loaded.
Alright! But that's not that simple. When next layout starts to appear on the screen it doesn't mean everything is loaded already. It is still being loaded in the background while you already see the layout. The result is that first several seconds can be really laggy which gives users a feeling that your app is very heavy.
The solution I use is to keep the loading screen as long as the background loading is in progress and once everything is loaded, hide the loading screen.
Step by step
Ok! Let's go through this step by step:
1. create a global layer "Layout Loader" as a top layer (it can be a blank layer or layer with pretty sprite saying "loading in progress" - whatever suits your app)
2. set its "initial visibility" to "visible" by default
3. just before jumping to the next layout set its "initial visibility" to "visible" (no it's not a mistake, yes I know I just wrote that in point 2, but just keep on reading)
4. On start of layout (every layout) loading screen is still visible because "Layout Loader" is visible by default. Thanks to this user won't even notice when the layout switches. At this time C2 engine loads everything what's below the loading screen (so it basically loads a layout).
Now the good question is "when should I hide the loading screen?". Well you can set some static time using wait function and hide it after - let's say - 6 seconds.
OR
You can be a bit smarter and check when the loading process is done. There is no built in solution to check that (at least I am not aware of it), but you may use the "fps" value. On start of every layout FPS drops drastically because of loading and rendering initial objects.
So you can do something like:
Every 0.3 seconds -> add 1 to "timesChecked" (this is some local static variable)
if FPS >= 30 (let's assume 30 FPS as a minimum fine framerate)
OR
timesChecked >= 20 -> hide "Layout Loader"
Wrap-up
So the "Layout Loader" will be hidden as soon as the FPS will get high enough to play game smothly OR after 6 seconds (timesChecked*0.3s). Second condition is important because some devices (older mobiles for instance) might never get 30 FPS even if everything gets loaded and would be stuck with loading screen forever.
This is of course a short example and you can upgrade it a bit in a various ways, but I believe you get the point now.
Here is the example I use in my project.
As you can see it is a separate event sheet which I import to every main event sheet or to my common event sheet.