Loading Screen Customize

Hello,

I’m looking for guidance on how to animate 2D objects on the loading screen or make modifications to our current loading screen in Unity. Any tips or resources on achieving this would be greatly appreciated.

Thank you!

Original Post on Discord

by user 328144332622266369

Hi, with a pro license you can for example create your custom loading screen if you need custom behaviour and want full control over how it looks using the <needle-engine loadstart="..." progress="..." loadfinished="..."></needle-engine> attributes. By calling evt.preventDefault() in the loadstart callback the default overlay will not be shown.
You can more information in the docs docs here: Needle Engine Attributes | Needle Engine Documentation

Let me know if that helps

Thank you, and to make it load a pre scene for loading, What should I do? I use loadstart and what?

by user 328144332622266369

What do you mean by a pre scene ?

I want this to appear while loading, and disappear when finished loading

by user 328144332622266369

It is a scene

by user 328144332622266369

Ah ok and this is a 3d scene?

yes

by user 328144332622266369

Ok. So I think one way to do it would be

  • Use your loading scene that you have there as your base entry point scene (meaning it has the ExportInfo and a SceneSwitcher that references your main scene). Then you can subscribe to loadstart on the <needle-engine> web component (see comment above) and you overlay everything with an HTML element that just contains your logo + a grey background + when loadfinished is called you just hide the grey background to show your 3d scene. Then you also have a component that listens to the sceneSwitcher loadscene-finished to remove both the logo and the bricks animation (and perhaps the camera animation, it depends a bit on how the scene there is setup and how you imagine the transition to be)

Ok, thanks, I will try to follow your instructions and see what could I do. Thank you very much!

by user 328144332622266369

No problem, let me know if anything is unclear - we want to add a sample for custom loading so your question comes at a good time (will link it internally as well)

Okay, I added the ExportInfo and the sceneSwitcher. I have the loading scene named ForRecording, and the other one Website. Is the setup correct ?

by user 328144332622266369

The scene ForRecording is appearing on the screen, but I have to add something to this script. Am I right?:classyblobthink:

by user 328144332622266369

And do I need to install Vue.js for this scene too?

by user 328144332622266369

The Sceneswitcher should be part of your export (ExportInfo is usually tagged with EditorOnly so make sure you move it into your scene if you want to use it)

You dont need to use vue for this no. You can just edit the index.html in your web project for example. Or is your project using vuejs?

The website scene is using vue.js

by user 328144332622266369

Okay, the sceneSwitcher is working, but it freeze my current scene while loading the other. Where could I find the script with loadStart ()

by user 328144332622266369

You add it as a global function (see the linked docs page above, it has a code snippet with loadfinished but its the same for loadstart. There’s also a Stackblitz example online, one second

I tried this and had this output.
image.png

by user 328144332622266369