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
- 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.