Is your feature request related to a problem? Please describe.
I'm trying to have an image that keeps its aspect ratio while resizing to fit inside a container with a maxHeight style. Using resizeMode of contain works, but the element takes up all of the space even though the image is centered, since it's being centered as a background. This means the white space around the image that fills the container is still considered part of the image (you can right click the white space and save the image).
Describe a solution you'd like
An implementation of the contain resizeMode that keeps the element (and the hidden accessibilityImage) sized to the visible image, instead of taking up the entire space.
Describe alternatives you've considered
- I got it to work with the
aspectRatio style, but unfortunately aspect-ratio has only recently gained browser support, so I can't use it yet.
- Since browsers use the img width/height attributes to calculate an aspect ratio, perhaps setting those attributes could be part of the solution?
- I'm currently trying to just use the padding trick to preserve the aspect ratio, but I'm not having any luck.
Is your feature request related to a problem? Please describe.
I'm trying to have an image that keeps its aspect ratio while resizing to fit inside a container with a
maxHeightstyle. UsingresizeModeofcontainworks, but the element takes up all of the space even though the image is centered, since it's being centered as a background. This means the white space around the image that fills the container is still considered part of the image (you can right click the white space and save the image).Describe a solution you'd like
An implementation of the
containresizeModethat keeps the element (and the hiddenaccessibilityImage) sized to the visible image, instead of taking up the entire space.Describe alternatives you've considered
aspectRatiostyle, but unfortunatelyaspect-ratiohas only recently gained browser support, so I can't use it yet.