How can i fill the images in the card view properly? (with their sizes)

I want to display photos in card view in my app along with airtable. These photos are for example only. I also put the block part below. How can I fill the images in the card view according to their real sizes, ratios?
Even if I use the scale picture to fit feature, the card views display a strange view as in the screenshot. (My images have different sizes, i mean one image is 720x1080, other one is 500x500 etc.) Please help me.



Set all the padding of card view to zero and set picture scale to fit to true

1 Like

Already all zero. And as i said even if i set the scale picture to fit to true, it displays like 3rd screenshot.

I gave only an example. I meant my photos are not same. So their dimensions are different.

And i set the scale picture to fit to true and it displays 3rd screenshot. When i set it to false, it displays better like second screenshot but there are large white spaces as you can see.

I need something like the photo below

RecyclerViewasStaggeredGrid

1 Like

See @h.efeakg Don’t use the dynamic component extension for this use the inbuilt Dynamic components then only it can be properly fit as now your are using extension in which the components are copied means the property of all the image will be same that is its height and width so if you change height or with then the height and width of every image will be changed so
If you want to Solve your problem then
Use in built dynamic components

1 Like

At first I thought using inbuilt dynamic components. After watching 1-2 videos, I tried to see that it was easily done with the extension, but I have been dealing with this problem for 1-2 days.

I will try after breakfast, i hope and probably it will work :+1:

1 Like

@h.efeakg if you still get the problem then just tell me from where or how you are calling images then i will make a app for you on the basis of the calling data

1 Like

No wayyyy… It didn’t work. I used inbuilt dynamic components but again same problem…

Note: I use airtable and cloudinary page for upload photos.

I can’t believe how it didn’t work :expressionless:

1 Like

Wait why are you becoming sad I am there I will make one for you but I don’t have images can you share me your aia or screen ais I will edit it accordingly

1 Like

You can use dynamic extension just set card padding to zero and set heigt &width to automatic . Do same to image do not set scale fit but set hight and width to automatic

The photos don’t matter, I just need to handle the logic and block part and get photos properly to app with the airtable. So you only need to use 5-10 photos like animals or foods for example… Because there are a lot of photos and not only photos, there are other screens in the application and I made them first. I have to integrate the photos into the application. But as i said it looks bad and disproportionate.

If you can fix this problem that’s enough for me and i will be very grateful. So you can just make this screen and send it as aia. Thank you for all your help in advance.

1 Like

ok i am on it :+1::+1::+1:

1 Like

You asked help for a specific problem.If you wish someone to create the app for you #marketplace is the right place to post

1 Like

Hey mate, if you read the above properly, i just asked the community for help in solving the problem. In recent messages, a good person said, “I can try this in kodular for you if you want.” I said it would be great too. I mean, how do you know the topic might come up here? @dora_paz

1 Like

I did what your said. I use extension again and i set height and width (card and image) to automatic (-1) as you see below.


Problem not solved yet. Content paddings are 0. Heights and widths are (-1) and i tried (-2) too. And scale to picture is true and false (i tried both of them)

You can try this
Make your image and card width to width_screen/3 set your picture to fit or you can see on this .aia

.aia.
grid.aia (1.4 MB)

1 Like

i think you are irrelevant. see this example. three VA is there but images are ok in two VA but not in third, i hope this design is not possible to bring

1 Like


Do you mean like this?

3 Likes

Is this all created dynamically??? Good work @sugarlesscreator

3 Likes