For a manually resizable image:
For an image that scales depending on the viewport size:
For a scrollable window of images where at least 1 image is completely contained and viewable regardless of the window dimensions:
To instead ensure the image always completely covers the window so there are no empty regions, use { f f } in the fill slot.
For a scrollable window of images where each image fills 90% of the height of the viewport, with the filename below it:
For a window where an image automatically fills to the width of the parent gadget, wrap it in a viewport. The parent gadget gives the wrapping viewport the available dimensions and the image will stop at this viewport to calculate the scaling required. For example, with frame and its filled-cell slot:
Wrapping the image in a viewport can also be used to crop and position an image by using the loc slot of the viewport in conjunction with the scaling options described above.
scaling-image-gadget
For an image that scales depending on the viewport size:
autoscaling-image-gadget
For a scrollable window of images where at least 1 image is completely contained and viewable regardless of the window dimensions:
USE: images.viewer.scaling
{ P" ~/path-to-image-1.png"
P" ~/path-to-image-2.png"
P" ~/path-to-image-n.png" }
[ absolute-path load-image <autoscaling-image-gadget> 1 >>fill ] map
<pile> 1 >>fill
[ '[ _ swap add-gadget drop ] each ]
[ <scroller> ]
bi "image-scroll" open-window
To instead ensure the image always completely covers the window so there are no empty regions, use { f f } in the fill slot.
For a scrollable window of images where each image fills 90% of the height of the viewport, with the filename below it:
USE: images.viewer.scaling
{ P" ~/path-to-image-1.png"
P" ~/path-to-image-2.png"
P" ~/path-to-image-n.png" }
[ absolute-path [ load-image <autoscaling-image-gadget> { f 0.9 } >>fill ]
[ <label> ] bi 2array ] map flip
<grid> <scroller> "image-scroll" open-window
For a window where an image automatically fills to the width of the parent gadget, wrap it in a viewport. The parent gadget gives the wrapping viewport the available dimensions and the image will stop at this viewport to calculate the scaling required. For example, with frame and its filled-cell slot:
USE: images.viewer.scaling
P" ~/path/to/image.jpg" absolute-path
[ <label> ] [ load-image <autoscaling-image-gadget> 1 >>fill f <viewport> t >>root? ] bi
1 2 <frame> swap { 0 0 } grid-add swap { 0 1 } grid-add
<scroller> "image-filling" open-window
Wrapping the image in a viewport can also be used to crop and position an image by using the loc slot of the viewport in conjunction with the scaling options described above.