Create Horizontal Scroll (Swipe Like) Row

Hi again Guys,

After 2days of trying finally I came up with an idea! (Special Thanks to my GF :stuck_out_tongue_closed_eyes::grin:)

  1. First of all I created a Row which contains a Column which follow with 5 additional Colums (Which is our Scroll items)

  2. We name The first Row as Scroll Row

  3. The following Column will be called as Scroll Container

  4. And each Colum inside that Container will be called as Scroll Item1, 2, 3, 4…

  5. Now we set the Height & Width of our Scroll Row to “Fit Contents”

  6. After that we assign the Height & Width of our Scroll Container to “Fit Contents”

  7. Each Scroll Item have Absolute Size of 200X200 and sperate by colors

  8. Set the Scroll Container “Scrollable” option to True

  9. Now we do the Magic Part :grin:
    Set the Transform to Scroll Row as “RotateZ : -1.5708”

  10. Add empty Columns at the beginning an the end of Scroll Container to fix correct position. Read Update :point_down:t4:

Tadaaaaa! :star_struck: With some trick we fool the platform to show a horizontal scroll.

UPDATE: Thanks to @Matias_Zamora
In order to show correctly all items into the Scroll Container, you can add empty Columns at the beginning and at the end of this container (specifying the “absolute size” parameter of this columns), padding the items (your Visible Columns “Scroll Items”) into the Scroll Container.

PS: You have to Set the Transform “RotateZ : 1.5708” to all your Scroll items as well. Pay attention its 1.5708 (Without “-”)

Here is the link to my test Project which could help many of you guys :wink:

( Sorry for any typos or bad English :sweat: )

Link to my Example Project

https://x.thunkable.com/copy/903650461974da79744b7a9aaa7893f4

18 Likes