Cards with horizontal scroll

Hello,

I’m trying to create a set of cards that can be scrolled horizontally (example below if the linked image works)

To do that, I’m using the scroll view with horizontal scroll true. However, when I add a card inside (or any other component) and select repeat with, it repeats down vertically instead of horizontally.

How can I get a repetead group with horizontal scroll?

Thanks

1 Like

Currently, you need to add a Container inside the Scroll view, and set its layout to Horizontal from the Style tab.

The container will then grow in size horizontally based on its contents and be scrollable inside the scroll view.

1 Like

Great! It works perfectly.

Just one detail more, is it possible to remove the scroll bar that appears below the scroll view in order to make it look cleaner?

Thanks!

1 Like

Not ATM – I made a ticket to enable configuring this and other Scroll View props: https://reactnative.dev/docs/scrollview.html#showshorizontalscrollindicator

https://tracker.appgyver.com/feature-requests/p/expose-all-releant-scroll-view-properties-from-react-native-side

3 Likes

I put my horizontally scrolling navigation container in another container (that also has my branding) that is vertically stretched.

Was able to make the scroll bar not show up that way. Not sure if that is an option for you.

3 Likes

Can you please elaborate on how you have done this, I am not getting it, please…

Hello guys!
I am not sure if i did that correct, but I added the horizontal scroll to the marketplace
here is the ID of it custom-72656709-8c1d-4353-9803-620fe570d47b or just type in search bar horizontal.

If you guys can be able to make some updates on it or add some logic to it, please share it with the public and hopefully together we can help each other.

1 Like

Hey @Dias_Zhumagaliyev2!, to be able to use your component, the ID you need to provide is the token from the marketplace; It can be found from the component page in the marketplace. People can use your component given you have provided the component token, but you are the only one who can make updates to it.

I have the same problem and the solution for me was.
You have to isolate the content of the scroll view or download thumbnail carrousel. :smiley:

CHEERS

Hi i dont understand completely what you mean but i hope i solve your problem, you can write the name in the component marketplace and install it and then with double click on the component (after you put it in a page) you can change it or put your own type of card in it
This way i made it work for me. you can start by just adding your card without deleting the one that already exists and then after testing it you can delete the previous card.
this is it:
image