Contribute to Docs Contribute to Docs

Image Processing

Piranha has built in support for scaling and cropping uploaded images on demand. The new image is saved in the configured media storage so that it can be reused on subsequent requests. To enable image processing you need to register a service that implements Piranha.IImageProcessor.

To read more about how the implement custom image processing services for your application, please refer to Image Processing under the Extensions section.

MediaService Methods

Images can be scaled by calling the MediaService in the Api.

// Scales the image to the given width
var scaledUrl = api.Media.EnsureVersion(id, width);
var scaledAsync = await api.Media.EnsureVersionAsync(id, width);

// Scales and crops the image to the given width & height
var scaledCroppedUrl = api.Media.EnsureVersion(id, width, height);
var scaledCroppedAsync = await api.Media.EnsureVersionAsync(id, width, height);

Please note that since the IStorage & IStorageSession interfaces are async, the synchronous versions of the methods are merely wrappers around the async versions.

ApplicationService Methods

The ApplicationService provides wrappers for the methods available in the MediaService for usage in .cshtml views. As the ApplicationServices has access to the current IApi there's no need for injecting an Api when using the service.

@model MyProject.Models.MyPage
@inject Piranha.AspNetCore.Services.IApplicationService WebApp

<div>
    <img src="@Url.Content(WebApp.Media.ResizeImage(Model.PrimaryImage, 400))">
</div>

ImageField Methods

The ImageField also has a method for scaling & cropping images. This is merely a wrapper for the methods available in the MediaService but it can still be useful when calling from a .cshtml view.

@model MyProject.Models.MyPage
@inject Piranha.IApi Api

<div>
    <img src="@Url.Content(Model.PrimaryImage.Resize(Api, 400))">
</div>