Migrate from Xamarin.Forms SfImageEditor to .NET MAUI SfImageEditor

8 Jul 20265 minutes to read

To make migration easier from the Xamarin SfImageEditor to the .NET MAUI SfImageEditor, most of the APIs from Xamarin SfImageEditor have been retained in the .NET MAUI SfImageEditor. However, to maintain the consistency of API naming in the .NET MAUI SfImageEditor, some of the APIs have been renamed. The API changes from Xamarin SfImageEditor to .NET MAUI SfImageEditor are detailed as follows.

Namespaces

Xamarin SfImageEditor	.NET MAUI SfImageEditor
Syncfusion.SfImageEditor.XForms	Syncfusion.Maui.ImageEditor

Initialize control

To initialize the control, import the ImageEditor namespace and initialize the SfImageEditor as shown in the following code sample.

Xamarin SfImageEditor	.NET MAUI SfImageEditor
XAML <ContentPage ... xmlns:imageEditor="clr-namespace:Syncfusion.XForms.ImageEditor;assembly=Syncfusion.SfImageEditor.XForms"> <imageEditor:SfImageEditor x:Name="imageEditor"/> </ContentPage> C# using Syncfusion.XForms.ImageEditor; ... SfImageEditor imageEditor = new SfImageEditor(); this.Content = imageEditor;	XAML <ContentPage ... xmlns:imageEditor="clr-namespace:Syncfusion.Maui.ImageEditor;assembly=Syncfusion.Maui.ImageEditor"> <imageEditor:SfImageEditor x:Name="imageEditor"/> </ContentPage> C# using Syncfusion.Maui.ImageEditor; … SfImageEditor imageEditor = new SfImageEditor(); this.Content = imageEditor;

Classes

Xamarin SfImageEditor	.NET MAUI SfImageEditor	Description
SfImageEditor	SfImageEditor	Used to crop, flip, rotate, and annotate an image with freehand drawings and built-in shapes.
PenSettings	ImageEditorAnnotationSettings	Represents a class that contains common settings for annotation views.
PenSettings	ImageEditorShapeSettings	Represents a class that contains the settings for shape annotation view.
TextSettings	ImageEditorTextSettings	Represents a class that contains the settings for text annotation view.
TextSettings	ImageEditorTextStyle	Represents a class that contains the style for text annotation view.

Properties

SfImageEditor

XAML

<ContentPage
...
xmlns:imageEditor="clr-namespace:Syncfusion.Maui.ImageEditor;assembly=Syncfusion.Maui.ImageEditor">
    <imageEditor:SfImageEditor x:Name="imageEditor"
                       Source="syncfusion.png"/>
</ContentPage>

C#

using Syncfusion.Maui.ImageEditor;
using Microsoft.Maui.Controls;
...

SfImageEditor imageEditor = new SfImageEditor();
imageEditor.Source = ImageSource.FromFile("syncfusion.png");
this.Content = imageEditor;

Xamarin SfImageEditor	.NET MAUI SfImageEditor	Description
Source	Source	Gets or sets the source of the image.
ZoomLevel	ZoomLevel	Gets or sets the initial zoom level.
EnableZooming	AllowZoom	Gets or sets a value indicating whether zoom is enabled.
MaximumZoomLevel	MaximumZoomLevel	Gets or sets the maximum zoom level.
ActualImageRenderedBounds	ImageRenderedSize	Gets the rendered size of the image.
OriginalImageSize	OriginalImageSize	Gets the original size of the image.
IsImageEdited	IsImageEdited	Gets a value indicating whether the image has been edited.
ToolbarSettings.IsVisible	ShowToolbar	Gets or sets a value indicating whether the default toolbar is enabled.
Nil	SelectionStroke	Gets or sets the selection highlight stroke. Applicable to crop view selection, shape and text annotation selection.

ImageEditorAnnotationSettings

Xamarin SfImageEditor	.NET MAUI SfImageEditor	Description
Bounds	Bounds	Gets or sets the bounds of the annotation view.
EnableDrag	AllowDrag	Gets or sets a value indicating whether the drag action is enabled for the annotation.
IsResizable	AllowResize	Gets or sets a value indicating whether the annotation can be resized.
Opacity	Opacity	Gets or sets the opacity value, ranging from 0 to 1.

ImageEditorShapeSettings

Xamarin SfImageEditor	.NET MAUI SfImageEditor	Description
Color	Color	Gets or sets the color of the shape annotation.
StrokeWidth	StrokeThickness	Gets or sets the stroke thickness of the shape annotation.
FillColor	IsFilled	Gets or sets a value indicating whether the shape is filled with the color.

ImageEditorTextSettings

Xamarin SfImageEditor	.NET MAUI SfImageEditor	Description
Angle	RotationAngle	Gets or sets the initial rotation angle of the text.
Nil	TextStyle	Gets or sets the style applied to the text.
RotatableElement	IsRotatable	Gets or sets a value indicating whether the text is rotatable.
TextAlignment	TextAlignment	Gets or sets the text alignment.
IsEditable	IsEditable	Gets or sets a value indicating whether the text is editable.

ImageEditorTextStyle

Xamarin SfImageEditor	.NET MAUI SfImageEditor	Description
Color	TextColor	Gets or sets the color of the text.
FontSize	FontSize	Gets or sets the font size of the text.
FontFamily	FontFamily	Gets or sets the font family of the text.
TextEffects	FontAttribute	Gets or sets the font attributes of the text.

Enums

Xamarin SfImageEditor	.NET MAUI SfImageEditor	Description
ShapeType	AnnotationShape	Specifies the annotation shapes in image editor.
FlipDirection	ImageFlipDirection	Specifies the direction to flip an image.
ImageEffect	ImageEffect	Specifies the image effect.
Nil	ImageFileType	Specifies the image file type.
Nil	ImageCropType	Specifies the image crop types.

Events

Xamarin SfImageEditor	.NET MAUI SfImageEditor	Description
BeginReset	BeginReset	Occurs when the image reset action begins.
ImageSaving	ImageSaving	Occurs when the image is being saved.
ImageSaved	ImageSaved	Occurs when the image is saved to local storage.
ItemSelected	AnnotationSelected	Occurs when an annotation view is selected.
ImageLoaded	ImageLoaded	Occurs when the image is initially loaded into the view.

Methods

Xamarin SfImageEditor	.NET MAUI SfImageEditor	Description
Rotate	Rotate	Rotates the image by 90 degrees in the clockwise direction.
Flip	Flip	Reverses the image along its horizontal or vertical axis.
Crop	Crop	Selects and removes a portion of the image.
AddText	AddText	Adds text to the image.
AddShape	AddShape	Adds shapes such as rectangles, circles, and lines to the image.
Save	Save	Saves the edited image.
SaveEdits	SaveEdits	Saves the current editing actions.
Nil	CancelEdits	Cancels the current editing actions.
ClearAnnotations	ClearAnnotations	Removes all annotations from the image.
Reset	Reset	Resets the edited image to its initial state.
Undo	Undo	Reverses (undoes) the last action or a series of actions.
Redo	Redo	Re-applies an action or a series of actions that were previously undone using the 'Undo' command.
Delete	DeleteAnnotation	Removes the currently selected annotations.
GetStream	GetImageStream	Gets the edited image as a stream.
ApplyImageEffect	ImageEffect	Applies various visual effects to the image, such as adjusted brightness, blur, contrast, exposure, saturation, sharpen, hue, and opacity.

Upcoming features

• Support for pan and zoom improvements while performing the crop action on images.

Known issues in .NET MAUI Image Editor

• [Mac, iOS] The image is not loading correctly from the stream or URI binding source.
• Rotation not working for text annotation.
• [Mac, iOS] The FontAttributes will not work for text annotations with the custom font family.
• Rotation will not work for custom annotation views.