Image Slides to show multiple images

I wan to show an array of images in slides in a mobile app. How can we achieve it in Retool ?

Hello @JawadAzizFarhad

To achieve the desired effect, you can pass the array as the data source to a Card Collection Component and use the URL field within the media section to display the images.

  1. Set the Data Source:
    In your Card Collection Component, set the data source to the array of image URLs. For instance, if your array is urlArray, bind it to the data source.

  2. Configure the Card Component:
    In the Card Component, use {{item}} to dynamically insert each image URL. This will reference each URL from the array.

  3. Enable Horizontal Scrolling:
    In the appearance section of the Card Collection Component, enable horizontal scrolling to create the slider effect.
    Screenshot 2024-06-24 at 10.46.30

Final Result:
You should see a slider effect where you can scroll through the images horizontally.
sliderMobileRetool

I hope this helps!