What's On Prepare for Display, simply put?

Reading documentation, Scene Actions:
On Prepare for Display — Triggered before scene transitions but after the scene’s DOM structure has been created.

is it possible to explain On Prepare for Display
for a non-coding person?

  1. On Scene Unload (it has been determined that we’re about to exit this scene)
  2. At this point, the dom structure of next scene is ready to go: the elements, their initial starting positions, and their CSS properties are all part of the structure of the page, just not visible yet.
  3. On Prepare for Display (we can do anything here that should affect that structure, position, or property of the elements setup in #2.
  4. Scene transition (optional)
  5. Scene is loaded (and shown)

So If you ever wanted to change elements on the scene before it is shown, or get something else ready for that scene, this is the place to do it.

1 Like

Thank you @Daniel for under-the-hood explanation on Prepare for Display.
Furthermore on Scene Actions, I don’t see Page Turn listed under On Swipe drop-down Action menu, why?

1 Like

It is only under 'On Swipe Left/Right/Up/Down, since it is handled by those gestures.

It’s three levels deep: On Swipe Left > Jump to Scene > Page Turn


1 Like

An interesting question is … and I can’t test it as I am on the road… does Hype already hold references to said DOM at that stage? Can I still move and wrap elements without breaking these…

DOM elements are created very early on, before HypeDocumentLoad.

Just before being displayed, they will get their initial values from the Hype runtime; this includes when a page turn drag is initiated. Immediately after getting their initial values, the On Prepare For Display (HypeScenePrepareForDisplay) is called.

Feel free to elaborate on what you’re trying to do and what might not be working this way.

1 Like