To create a Photo gallery in Mobincube we have 3 options available:
- We can create a gallery in a DETAILS SCREEN by following these steps:
- Insert a Table with as many cells as the number of pictures we want to show in the gallery (In the following example: 5) .
- Assign 100% width to each cell.
- Insert an IMAGE element in each cell and upload an image of the gallery to each one.
- When all the pictures have been uploaded, our Photo Gallery will be ready.
If we download the preview of the App, we can slide the images with our finger from the right to left side of the screen.
2. We can create a Gallery in a DATA VIEW SCREEN through the following steps:
- First we open a data view screen where we will create a Database.
- As in the example, we will create 2 Columns with 2 fields:
-“Title” , type text
- “Images” type Image
NOTE: THE GALLERY ONLY WORKS WITH LOCAL IMAGES TYPE.
- Then we can click on the EDIT button of the database and fill in the fields by inserting the titles and by uploading the images from the PC.
- Once we have edited our database, we then only need to create a Gallery View in the Data Visualization.
- Once opened, the Gallery View will show us a screen with a Key Field where we insert the field related to the gallery. In our example, we have only 1 Image field so it will be shown automatically in the Key field.
- Finally we can choose an action to execute. If for example we want to share the pictures with the device, we can use the action: SHARE and in the destination put the field of the images in round brackets .
In our example it will be: (Images).
Now the simulator will display the gallery on the screen to see what it looks like, and we can try it in the simulator by sliding the images with the finger from the right to left side of the screen.
3. HOW TO USE IMAGES FROM THE CLOUD IN A VIEW.
As we have already explained above, we can use the Gallery View only with local Images content.
If we want to use remote pictures, we will do that by using the CLOUD.
- We will connect the database to the Cloud.
- We will upload the pictures we want in our gallery, from the Cloud.
- Let’s click on PUBLISH to publish the changes done to the database.
- Now we can create a DETAIL VIEW in which we can insert the Images field.
- To insert the Image field we have to drag the pink Images icon onto the screen.
- The next step is to create, below the Image field element, 2 buttons to show us the image.
- Let’s create a table with 5 cells and in the 2nd and the 4th we are going to upload 2 images of 2 buttons.
- We can now assign to the first button, the action: “Previous”:
And to the second button the action: “Next”
Now in the simulator, if we click on one of the buttons, we will be able to see all the images of the gallery.
