Services Plugins FAQs

Stretch on the Image slider plugin

#1

Hi. I can’t seem to find a way for my photos to look evenly stretched out to the corners of the plugin element. I realize the photos are different aspect ratios, but would like to make it work either way. I think I should use the stretch function (tested all the other options and it didn’t work too). I am also using Imgix to crop the photos so everything should be working ok.

Some of the photos stretch to the end of the element (seen by rounded corners), and some stop (seen by squared corners). In the screenshots provided below I am using imgix and stretch function. And it is the same element. Could you help me or is this some kind of a limitation of the plugin itself?

image
image

1 Like
#2

Hello!

Thanks a lot for reaching out!

Please be so kind to provide additional information about your issue. I need more details to replicate your case, such as:

  1. Screenshots of the plugin’s element exactly Appearance after “upload image”

    image
    image317×525 22.6 KB

  2. Which Responsive do you use - old or new one?

Thanks in advance!
Regards,

#3

Here you go. I use the old engine.

image
image496×872 55.3 KB

#4

Hello, @giedraitis.mantas.21!

I apologize for the delayed reply!

Please allow me to check this question internally. I will revert to you with the feedback at the nearest time.
Thanks for the understanding.

Regards,

#5

Hello, @giedraitis.mantas.21!

Thank you a lot for your screen, we tried to replicate your use case.

If I understand you correctly - your purpose is to stretch the images entire the frames of the plugin’s element.
For sure the “Stretch” option is more suitable in your case. This feature means that the image will be cropped evenly on all sides and will not exceed the limits of the plugin. But if the image is stretched only, without respecting the proportions, it will look unattractively and will not display the real parameters of the drawn content. That’s why this option “Stretch” has been improved in our plugin.

Therefore I can suggest just selecting images of the same size or in proportion to the limits of the plugin’s element.

Besides, Imgx option is not necessarily exactly in this case.

Please let me know if you have any other questions.
If I didn’t understand you correctly could you please clarify your case with more details/screens.

Regards,

#6

Yeah, probably I am not describing my use case correctly, sorry, it’s my second language. I’ll try to do better.

My use case is that it is user generated content (uploaded photos of their properties), therefore I am unable to control the size and aspect ratios of their photos. I thought a lot about this problem and I think that maybe the stretch option itself is not the option I need in this instance. For example a normal image element also has the Rescale option, and maybe that’s what is needed in this occasion.

Here I am sending you a screenshot of a different part of my app, where a simple image element is used inside a repeating group. I uploaded the same two photos, just to see how they would behave in this type of scenario. I used Rescale option, and the imgix is the same in both cases ‘resize to fit dimensions by cropping’.

In my opinion they behave in a more favourable way, at least for my taste. They of course can’t be perfect, as their aspect ratios are not perfect, but since in the real world scenario the users will upload photos in all sorts of different aspect ratios, showing them in the same format (same size of a box, same rounded corners etc.), just with the different zoom level, would look more neatly than having a container element with all sorts of different size of photos. Because Users care about how the photos look and feel, not the container size.

Maybe that’s something that can be added to the plugin itself? I mean the Rescale version. Would love to use your plugin on the Client’s app, and everything else about it is perfect for me.

image
image773×839 111 KB

image
image954×518 34.1 KB

#7

Also, in you first message you asked if I was using the old responsive engine or the new one and I wrote that I was using the old one.

Would it be any different if I was using the new engine? Because I’ve redone the page in Flexbox (so now have it built on both engines), but saw no improvements from the plugin’s side.

Don’t know if it maybe changes anything, just wondered if it would be easier to fix somehow?

#8

Hello, @giedraitis.mantas.21!

My apologies for the late reply :pray:

Thanks a lot for your clarification. As I see your example with images is very nice, they are not stretched or blurred, and for sure it’s a favorable way to display them. The developers customized the plugin optimally - the image can be resized or cropped but it always looks neat and clear. And as you saw our plugin has two options like Rescale:

image

Exactly these two options rescale images very neatly without blurring.

I suggest you not use the plugin with the new responsive for now because it is still in beta-version and the plugin is not adapted to the new responsive.

Have a nice day!
Regards,

#9

Hello @giedraitis.mantas.21, does Zeroqode or Bubble have a “Fill” option for photos? Where it “Zooms so that the proportions stay the same, but the image fills the window with the least zoom level.” Meaning, there is never any “white space” between the image and the edge of the window.

In all cases, we also need a setting for “centered, top-justified, bottom-justified, right-justified, or left-justified”, but if we did not want to set an option or have a default, the value would be “centered”.

To be clear, if the image is “taller” than the window, then the same amount of image would be lost top and bottom.

#10

Hey @pwharker ,

Actually I failed to make the photos to my exact specifications for the build, so I had to abandon the plugin altogether and use another one. If I remember correctly (it was 3 months ago, have seen lots of plugins since :slight_smile: ), it didn’t have the fill option, only the ones you see on one of the screenshots above. Maybe they’ve upgraded the plugin since?

I didn’t need to be this particular with my photos as you have put it, but it definitely didn’t have top-justified and others.

Everything else I really liked about this plugin. But making it work so the photos actually behave the way you want (and having such advanced features as you listed) would be nice on this plugin. Maybe I had some kind of a fringe case and reached it’s limits, I don’t know :slight_smile:

#11

Mantas, @giedraitis.mantas.21 it turns out that using a Bubble “Group” component, and setting the “background type” to Image and setting the image from the database gives you the kind of “fit with aspect ration” that I was describing. Thank you for showing that to me.

#12

Hello @giedraitis.mantas.21, @pwharker,
Noticed this conversation and I will jump real quick in here.

First of all, sorry if our plugin did not fit perfectly for your use case. The Image Slider Plugin is basically used when needed to visualize a list of static or dynamic images with a slideshow effect.
In case you are wondering about its capabilities or you have some feature requests, please let us know, so we can add them to the Plugin backlog improvement list.

Thank you once again.
Wish you all a great day! :pray:
Regards,