ASP.NET Core ImageEditor Overview

The Telerik UI ImageEditor TagHelper and HtmlHelper for ASP.NET Core are server-side wrappers for the Kendo UI ImageEditor widget.

The ImageEditor utilizes a canvas element and enables image editing. It allows you to open, edit and save edited .png, .jpg, or .jpeg images.

• Demo page for the ImageEditor HtmlHelper

• Demo page for the ImageEditor TagHelper

Initializing the ImageEditor

The following example demonstrates how to define the ImageEditor.

Razor

@(Html.Kendo().ImageEditor()
    .Name("imageEditor")
    .Width(500)
    .Height(500)
    .SaveAs(saveas => saveas.FileName("image.png"))
)

Razor

    <kendo-imageeditor name="imageEditor" width="500" height="500">
        <save-as file-name="image.png" />
    </kendo-imageeditor>

Functionality and Features

• Tools—The ImageEditor offers a collection of tools that allow the user to interact with the UI component.
• Events—To control the behavior of the component upon user interaction, you can use the events that the component emits.
• Accessibility—The ImageEditor is accessible by screen readers and provides WAI-ARIA, Section 508, WCAG 2.2, and keyboard support.

Next Steps

• Getting Started with the ImageEditor

• Basic Usage of the ImageEditor HtmlHelper for ASP.NET Core (Demo)

• Basic Usage of the ImageEditor TagHelper for ASP.NET Core (Demo)

• ImageEditor in Razor Pages

See Also

• Using the API of the ImageEditor for ASP.NET Core (Demo)
• Knowledge Base Section