When using the new image widget that can source its images from a variable. The picture displayed will use the aspect ratio of the widget and not its native aspect ratio. If the widget is 1:1 ratio and the variable being loaded into it is 3:2, it gets stretched or shrunk to fit the whole 1:1 widget. This is different from utilizing the variable widget, where it will auto fit the bounding box and keep its native aspect ratio.
The benefit of using the image widget is the triggers that can be set up with it. The other route requires an invisible button overlayed onto the variable widget which can get messy and hard to manage with lack of being able to set layers well.
Hi Chris,
Thank you for reporting this.
I’ve made a bug ticket to fix it.
Best regards,
András
2 Likes
Bumping this thread because this bug still exists
1 Like
Hey @Ethan -
Just checked in on this one. The Vision team is actively working on this one. The pull for this change happened back on the 7th, so I would expect to see this resolved very soon.
Pete
1 Like
Is this bug fixed?
We have an App using Image widget with the data source from Tulip Table Record, and the user is asking why the aspect ratio is shrunk from the original image.
(I would like to have the click action “Show Image Full Screen”, so using “Variable”/“Table Record” widget is not an option.)
1 Like
I have same problem. Is this bug going to be fixed ?
1 Like
Hi there -
So it looks like a while back the aspect ratio was fixed for static image values, but not for variable or table records! I went ahead a re-opened this request with the Team and they will work on getting it prioritized.
Thank you for bringing this back to our attention!
1 Like
As for the Variable widget, the aspect ratio of the original image is preserved.
As for the Image widget, the aspect ratio of the original image is not preserved.
2 Likes
Thank you for adding these details @ta-aoki !
Hi @Beth
will this bug ever be fixed?
It’s in the list for 2 years now and it is very annoying to load pictures from a record with displaying these pictures so distorted
Regards Chris
1 Like
hello 
please fix this inconsistency… thank you.
1 Like
I’ve noted the inconsistency with the image and variable widgets when handling the aspect ratio for loaded images. I am going to prioritize this and will get back to you all once we make progress on a fix. Thank you for your patience!
1 Like
On a call with some Tulip resources today, we got a look at the “show image fullscreen” click action on this widget, which includes a key feature we’ve been looking for - picture zoom and pan. We hadn’t seen this feature because we never use this widget because it’s been broken for so long. Looking forward to this fix to explore if it’s worth revisiting the widget.
1 Like
This is actually an issue for me as well.
The image widget is not capable of handling different images (wis different aspect ratios), while the others are not able to show the image in full screen.
Actually show image in full screen could also be a trigger action and then you could place a magnification glass icon on an image variables corner or so. …
Currently we have no solution for that.
1 Like
Agree @thorsten.langner, have you made this trigger action idea a votable feature request? I didn’t see it in my search results on this issue.
One of our customers is currently facing the same challenge and we are hoping to see a solution.
1 Like
Is this bug fix still on the road map for Tulip? I’m not fond of work-around solutions and think the ability to maintain the aspect ratio of an image from a variable source should be part of Tulip’s native capabilities.
3 Likes
Who’s ready to celebrate 4 years of this bug in a couple months? 
@shep , @Beth , @Pete_Hartnett ?
Just poking fun but also curious, I’m with @BertusTheLove on this one. I know we’ve been avoiding using this widget and thus our users are also missing out on the native click to expand + pan/zoom because the underlying widget is broken.
1 Like
I acutally think this should be more than just keeping the aspect ratio.
I think a good way could be to add an option to choose between the following as in CSS object-fit:
-
fill– (default) The image is resized to fill the given dimensions. If necessary, the image will be stretched or squished, which may distort the aspect ratio. -
contain– The image is resized to fit within the given dimensions while preserving its aspect ratio. The entire image remains visible. -
cover– The image is resized to completely cover the given dimensions while preserving its aspect ratio. Parts of the image may be clipped. -
none– The image is not resized and retains its intrinsic size. -
scale-down– The image is scaled as if using eithernoneorcontain, whichever results in a smaller display size.
2 Likes