Working with Images: resize and crop in Kotlin

Working with Images in Kotlin: resize and crop with the Kamel Library

In modern Android and Kotlin multiplatform development, there is often a need to programmatically resize and crop images. This is required for optimizing loading, creating previews, adapting to different screens, or preparing images for server upload. In this article, we will look at the Kamel library — a powerful tool for working with images, written in pure Kotlin and supporting multiplatform development.

What is Kamel?

Kamel (Kotlin Asynchronous Media Loading) is a library for loading, caching, and processing images, created specifically for Kotlin Multiplatform. It provides a simple API for performing operations such as resize and crop, without the need to include heavy frameworks like Glide or Picasso. Kamel supports Android, iOS, JVM, and JavaScript, making it an ideal choice for cross-platform projects.

The library is installed via Gradle:

// build.gradle.kts (commonMain)implementation("media.kamel:kamel-image:1.0.0")

Resizing an Image (resize)

The resize operation allows you to change the original dimensions of an image to a specified width and height. In Kamel, this is implemented via the resize() function, which takes target dimensions and a scaling mode.

Example of basic resizing:

import androidx.compose.runtime.*import media.kamel.image.loadImageimport media.kamel.image.resizer.*

@Composablefun ResizedImage() {    val image = loadImage(        data = "https://example.com/photo.jpg",        resizer = Resizer(            width = 300,            height = 200,            scaleMode = ScaleMode.Fit        )    )    // Display image in Image composable}

In this example, the image will be scaled to 300x200 pixels while maintaining aspect ratio (ScaleMode.Fit). If you need to stretch the image without preserving proportions, use ScaleMode.Fill or ScaleMode.Crop (the latter automatically crops the edges).

Cropping an Image (crop)

Crop allows you to cut out a rectangular area from the original image. In Kamel, cropping can be done in two ways:

Via ScaleMode.Crop — automatic cropping during scaling;
Via manual region specification — using the ImageRegion class.

Example of manual cropping:

import media.kamel.image.loadImageimport media.kamel.image.cropper.*

@Composablefun CroppedImage() {    val image = loadImage(        data = "https://example.com/photo.jpg",        cropper = Cropper(            region = ImageRegion(                left = 50,                top = 50,                width = 200,                height = 150            )        )    )    // Display the cropped image}

Here, an area starting at coordinates (50, 50) with a size of 200x150 pixels is cut from the image. This is useful when you need to extract a specific part, such as a face in a photo.

Combining resize and crop

Often, you need to perform both operations sequentially: first crop, then resize. Kamel allows you to combine them through a chain of calls:

@Composablefun CombinedProcessing() {    val image = loadImage(        data = "https://example.com/photo.jpg",        resizer = Resizer(width = 400, height = 300, scaleMode = ScaleMode.Fit),        cropper = Cropper(region = ImageRegion(100, 100, 600, 450))    )}

Execution order: first appl