syncfusion-maui-image-editor

name	syncfusion-maui-image-editor
description	Implements and customize Syncfusion .NET MAUI ImageEditor (SfImageEditor) for editing, annotating, and transforming images. Use when working with MAUI image editing, photo editing, image cropping, or image transformations. Covers shape/text overlays, freehand drawing, image filters, toolbar customization, and saving edited images.
metadata	{"author":"Syncfusion Inc","version":"34.1.29"}

Implementing .NET MAUI Image Editor

A comprehensive skill for implementing and customizing the Syncfusion .NET MAUI ImageEditor (SfImageEditor) control. The ImageEditor provides powerful image editing capabilities including cropping, transformations, annotations, filters, and effects with a built-in customizable toolbar.

When to Use This Skill

Use this skill when you need to:

• Edit and manipulate images in a .NET MAUI application
• Crop images with various aspect ratios or custom selections
• Rotate or flip images (transformations)
• Add annotations: shapes, text, or freehand drawing
• Apply filters and effects (brightness, contrast, blur, saturation, etc.)
• Customize the built-in toolbar or create custom toolbars
• Zoom and pan images for detailed editing
• Save edited images to file or stream
• Serialize and deserialize editor state (annotations, transformations)
• Implement undo/redo functionality
• Handle image editing events
• Customize image editor appearance

Component Overview

SfImageEditor is a comprehensive image editing control for .NET MAUI that provides:

Core Features:

• Image loading from file, stream, or resources
• Cropping with presets (Square, Circle, 16:9, 4:3, 3:2, etc.) or freehand
• Transformations: Rotation (90°, 180°, 270°, custom angles), Flip (horizontal/vertical)
• Annotations: Shapes (Circle, Rectangle, Arrow, Line, Path), Text, Freehand drawing
• Image filters: Brightness, Contrast, Blur, Sharpen, Exposure, Saturation, Hue, Opacity
• Built-in toolbar with full customization support
• Zoom and pan with pinch gestures
• Z-ordering for annotations (bring to front, send to back)
• Undo/Redo operations
• Save to file or stream (JPEG, JPG, PNG, BMP)
• Serialization/Deserialization of editor state
• Comprehensive event handling

NuGet Package: Syncfusion.Maui.ImageEditor

Documentation and Navigation Guide

Getting Started & Setup

📄 Read: references/getting-started.md

• Installation and NuGet package setup
• Handler registration in MauiProgram.cs
• Basic ImageEditor implementation (XAML & C#)
• Loading images from different sources
• Source property and image loading

Cropping & Transformations

📄 Read: references/crop-transform.md

• Image cropping with Crop method
• ImageCropType options (Free, Square, Circle, aspect ratios)
• Interactive vs programmatic cropping
• Rotation operations (Rotate method)
• Flip operations (horizontal/vertical)
• Custom angle rotations
• Transformation events

Annotations

📄 Read: references/annotations.md

• Adding shape annotations (Circle, Rectangle, Arrow, Line, Path)
• AddShape method and AnnotationShape enum
• Text annotations (AddText method)
• Freehand drawing capabilities
• Custom view overlays
• Annotation settings (bounds, opacity, rotation, colors)
• Annotation selection and manipulation
• AllowDrag, AllowResize, IsEditable properties

Filters & Effects

📄 Read: references/filters-effects.md

• Applying image filters programmatically
• Brightness and contrast adjustments
• Exposure, saturation, and hue controls
• Blur and sharpen effects
• Opacity modifications
• Combining multiple effects
• Effect preview and reset

Toolbar Customization

📄 Read: references/toolbar.md

• ShowToolbar property for visibility control
• Built-in toolbar items
• Adding custom toolbar items
• Removing or reordering toolbar items
• Toolbar positioning and orientation
• Toolbar item appearance customization
• ToolbarItemSelected event
• Creating completely custom toolbars

Zooming & Navigation

📄 Read: references/zooming-navigation.md

• Zoom functionality (pinch-to-zoom, programmatic)
• Zoom level management
• Pan and navigation controls
• FitToScreen functionality
• Z-ordering for annotations
• BringToFront and SendToBack methods
• Layer management for complex compositions

Save & Serialization

📄 Read: references/save-serialization.md

• Saving edited images (Save method)
• Save to file path vs stream
• Image format options (JPEG, JPG, PNG, BMP)
• Quality and compression settings
• Serialization to JSON (annotations and state)
• Deserialization (loading saved editor state)
• Reset functionality
• Export scenarios and best practices

Undo & Redo Operations

📄 Read: references/undo-redo.md

• Undo and Redo methods
• CanUndo and CanRedo properties
• History stack management
• Custom UI for undo/redo
• History limits and configuration
• Undo/Redo events

Events & Event Handling

📄 Read: references/events.md

• ImageLoaded event
• ImageSaving and ImageSaved events
• ItemsSelected event (annotation selection)
• ToolbarItemSelected event
• Cropping events
• Event arguments and accessing event data
• Building event-driven workflows

Styling & Customization

📄 Read: references/styling-customization.md

• Visual customization options
• Theme support and styling
• Liquid glass effect
• Control appearance customization
• Annotation style customization
• Border and background properties

Accessibility & Localization

📄 Read: references/accessibility-localization.md

• Accessibility features and support
• Screen reader compatibility
• Keyboard navigation (desktop platforms)
• Semantic properties
• Localization and multi-language support
• Culture-specific formatting
• Right-to-left (RTL) layout support