Page

Used as the root node of a Component to mark it as a Page to be used with a Pages node.

Has all the properties of a Group with the additional properties below.

Inputs

Title
The title of the page. The title of the current page is available as an output in the Pages node. Useful for creating a header that shows the current page title.

Transition
The animation that will play when going to or from this page.

  • Default - A standard horizontal page animation.
  • None - Don't play an animation at all
  • Custom - Define your own transition. See additional information below.

Transition Duration
Available when Transition is set to Custom. This defines how long the Transition Position output animation is.

Outputs

Page

Transition Position
Where the Page is in it's transition, can be in one of four different states:

When navigating forward from Page A to Page B

  • Page A: The Transition position goes from 0 to -1.
  • Page B: The Transition position goes from 1 to 0.

When navigating back from Page B to Page A

  • Page A: The Transition position goes from -1 to 0.
  • Page B: The Transition position goes from 0 to 1.

This value is useful when creating custom page transitions, or adding additional animations to the Default animation.

Page Signals

Page Showing
This signal is sent when the page is starting to show. The Transition Position is <1 or >-1.

Page Hiding
This signal is sent when the page is starting to hide. The Transition Position is <0 or >0.

Page Shown
This signal is sent when the page has completed its transition. The Transition Position is 0.

Page Hidden
This signal is sent when the page has completed its transition and is completely hidden. The Transition Position is exactly -1 or 1.

Sign up to noodl newsletter

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.