The Gallery component

The Gallery component enables the user to scroll horizontally or vertically through pages. The gallery can contain any kind of content: images, shapes, texts and even other components.

💡 Tip: the Gallery component is also useful to add a "slide" effect between screens. In this case, set the gallery to full screen and insert all the content of your screens inside.

Insert a Gallery

Click on Components and insert the Gallery component.

Double click on the area to edit and add pages.

Here are the properties of the Gallery component:

User interaction: this option allows you to take into account the interactivities defined on and in the component.
Orientation: choose between horizontal and vertical scrolling
User scrolling: enable or disable the scrolling of pages by the user
Scroll bar: choose to display the scroll bar or not
Pagination: display pagination dots to indicate the number of pages to the user and choose their design. These points appear in the Objects window as an independent object under the name: PageControl

⚠️ Please note that pagination points are only visible on iOS devices.

Default page: select the page that is automatically displayed when the gallery is loaded. By default the gallery keeps the last page.

Trigger an action with the Gallery

You can use the Gallery component to trigger an action.

Select your component and open the Actions window. Click on + New Action to display the list of triggers:

Display Page
Tap/Click
Double tap/click
Touch down
Touch up
Swipe up/down/right/left
Mouser over/out

Create an action with the Gallery

You can also create an action on the Gallery component.

Choose the trigger of your choice and the action Act on a component. Select the Gallery component and here is the list of available actions:

Go to selected page
Go to next page
Go to previous page

Faire défiler la galerie automatiquement

To scroll your gallery automatically you can add a Timer component and a Synchronization component to synchronize the time values with the gallery pages.

You can synchronize your gallery with any other component.