element-x-ios icon indicating copy to clipboard operation
element-x-ios copied to clipboard

Images with a large aspect ratio (width > height) are rendered with an excessive amount of vertical padding

Open marwing opened this issue 1 year ago • 1 comments

Steps to reproduce

  1. Find or generate an image with a width (way) larger than its height. (The example image below was created using ImageMagick convert -size 500x30 xc:white demo2.png)
  2. Send that image in a room as a standalone message or as a reply (I tried EW and EXi, but any client should work)
  3. Observe the large amount of vertical padding.

This issue is not new, and I encountered this in the wild a few times. A public event that shows this behavior is in the public #synapse:matrix.org room at https://matrix.to/#/!ehXvUhWNASUkSLvAGP:matrix.org/$BV6jRBs8i1delUo-4KjMkXjHCFTfhvMZIWeebYNaoOo?via=matrix.org&via=matrix.breakpointingbad.com&via=dev.kyn.be

Outcome

What did you expect?

Less amount of padding. This image is from my iPad, where this issue doesn't seem to happen and all images are about the same height: iPad

What happened instead?

iPhone

As you can see in the screenshot, the images around the reproducer are rendered with about half the height, so it is not (only) about the minimum height defined here (I hope I found the right piece of code).

Note: The reference image has the dimensions 500x100 and has the same width as the reproducer image. This leads me to believe this is some form of scaling/resizing issue when fitting the image to the available space, as on the wider screen above the reproducer is rendered in a wider bubble instead.

Your phone model

iPhone 13 mini / iPad Pro

Operating system version

iOS/iPadOS 17.4.1

Application version

1.5.12 (99)

Homeserver

Synapse 1.103.0 / Proxy 0.99.15

Will you send logs?

No

marwing avatar Mar 22 '24 03:03 marwing

It just occurred to me to try this in landscape on my phone. This doesn't happen there, instead it is rendered in a wider box similar to the iPad. image

While at it I also tried the modern layout where this happens as well. Here it even happens in landscape however way less pronounced, probably because there is more, but not enough horizontal space. image

marwing avatar Mar 22 '24 03:03 marwing