I’m excited to share that there are now additional fitting options for Images : Fill, Fit, and Keep Aspect Ratio.
What’s New?
You can now adjust how the image fits within its bounding box.
There are three options available:
Fill: Image fills it’s bounding box. If the aspect ratio of the image is different than the aspect ratio of the image bounding box, the image will get cropped. (e.g. if you were to try to fit a rectangle inside a square)
Fit: Image fits within its bounding box. If the image aspect ratio is different than the aspect ratio of its bounding box, the image will shrink to fit within the bounding box. It will maintaining its aspect ratio without getting cropped. (e.g. like shrinking a rectangle to fit in a square shape).
Keep Aspect Ratio: If the image aspect ratio is different than the bounding box aspect ratio, the bounding box height will adjust to display the entire image.
These modes are useful to achieve different layouts, or if you want to link an image component to data, and make sure that the image doesn’t get cropped even when the source changes
How to change fit modes?
Open the Image Settings Panel from the GFPP and change the fit mode.
Thank you Carmel. I was able to test this out and I’ve made a video for anyone who wants to see a video of the different modes and how this feature helps while building out your site:
What about the “scale proportionally” option in the inspector panel. It looks redondant now?
When we choose Fill or Fit…
… and we select scale proportionally it’s like choosing “keep aspect ratio”
It’s not exactly the same. Scale proportionally describes how the bounding box scales across different screen sizes, while fit mode describes how the image fits in the bounding box.
It is possible to have a fit mode = fit, so that the image does not fill the entire bounding box, but the bounding box itself will scale proportionally.
@rajadaher you can also choose ‘fill’ and scale proportionally. Scale proportionally controls how the bounding box of the image scales, regardless of how the image fits within it. It’s true that if you choose ‘keep aspect ratio’ the image always scales proportionally and therefore the bounding box always scales proportionally (because the bounding box adjusts itself to match the image aspect ratio).
Does that help?
