[orx-image-fit] Tweak demo comments

This commit is contained in:
Abe Pazos
2025-10-01 20:44:11 +02:00
parent 2b56cd5502
commit 0c2d34784f
2 changed files with 35 additions and 22 deletions

View File

@@ -1,15 +1,21 @@
import org.openrndr.application
import org.openrndr.color.ColorRGBa
import org.openrndr.draw.ColorBuffer
import org.openrndr.draw.isolatedWithTarget
import org.openrndr.draw.loadFont
import org.openrndr.draw.renderTarget
import org.openrndr.drawImage
import org.openrndr.extra.imageFit.FitMethod
import org.openrndr.extra.imageFit.imageFit
import org.openrndr.extra.shapes.primitives.grid
/**
* Tests `drawer.imageFit()` with all FitMethods for portrait and landscape images.
* This program uses `drawer.imageFit()` to draw images using nested grid layout.
* The main grid features 4 columns for the `Cover`, `Contain`, `Fill` and `None` fit methods,
* and two rows for portrait and landscape images.
* Each of those 8 cells feature a 3x3 grid, with cells combining `left`, `center` and `right` alignment
* with `top`, `center` and `bottom` alignment.
*
* The image drawn in each cell is a simple image with a white background and two touching circles:
* a pink one and a gray one. In some of the cells part of this image is cropped out (due to the fit method used).
* In other cells the image does not fully cover the available area, revealing a dark gray background.
*/
fun main() = application {
configure {
@@ -20,44 +26,40 @@ fun main() = application {
program {
val font = loadFont("demo-data/fonts/IBMPlexMono-Regular.ttf", 18.0)
// Create a test image with circles
fun makeImage(cols: Int, rows: Int, side: Int = 400): ColorBuffer {
val rt = renderTarget(cols * side, rows * side) {
colorBuffer()
// Create an image with a gray and a pink circle
fun makeImage(cols: Int, rows: Int, side: Int = 400) = drawImage(cols * side, rows * side) {
clear(ColorRGBa.WHITE)
stroke = null
bounds.grid(cols, rows).flatten().forEachIndexed { i, it ->
fill = if (i % 2 == 0) ColorRGBa.PINK else ColorRGBa.GRAY
circle(it.center, side / 2.0)
}
drawer.isolatedWithTarget(rt) {
clear(ColorRGBa.WHITE)
stroke = null
ortho(rt)
bounds.grid(cols, rows).flatten().forEachIndexed { i, it ->
fill = if (i % 2 == 0) ColorRGBa.PINK else ColorRGBa.GRAY
circle(it.center, side / 2.0)
}
}
return rt.colorBuffer(0)
}
val layouts = mapOf(
val namedImages = mapOf(
"portrait" to makeImage(1, 2),
"landscape" to makeImage(2, 1)
)
val fitMethods = FitMethod.values()
val fitMethods = FitMethod.entries.toTypedArray()
val grid = drawer.bounds.grid(fitMethods.size, layouts.size, 30.0, 30.0, 30.0, 30.0)
val grid = drawer.bounds.grid(fitMethods.size, namedImages.size, 30.0, 30.0, 30.0, 30.0)
extend {
drawer.fontMap = font
drawer.stroke = null
fitMethods.forEachIndexed { y, fitMethod ->
layouts.entries.forEachIndexed { x, (layoutName, img) ->
namedImages.entries.forEachIndexed { x, (layoutName, img) ->
val cell = grid[x][y]
// In each grid cell draw 9 fitted images combining
// [left, center, right] and [top, center, bottom] alignment
val subgrid = cell.grid(3, 3, 0.0, 0.0, 4.0, 4.0)
subgrid.forEachIndexed { yy, rects ->
rects.forEachIndexed { xx, rect ->
// Draw a dark background
drawer.fill = ColorRGBa.WHITE.shade(0.25)
drawer.rectangle(rect)
// Draw the image using `imageFit`
drawer.imageFit(img, rect, xx - 1.0, yy - 1.0, fitMethod)
}
}

View File

@@ -6,6 +6,17 @@ import org.openrndr.extra.noise.shapes.uniformSub
import org.openrndr.extra.shapes.primitives.grid
import kotlin.random.Random
/**
* Demonstrates the `imageFitSub()` method, which allows specifying not only a target `Rectangle`,
* but also a source `Rectangle`, which is used to set the area of the original image we want to fit
* into the target.
*
* The program also demonstrates the `Rectangle.uniformSub` method, which returns a random sub-rectangle
* taking into consideration the minimum and maximum width and height arguments.
*
* Notice the trick used to generate unique random results changing only once per second by using
* the current seconds as an integer seed.
*/
fun main() = application {
configure {
width = 720