Class SfImageEditor

Represents a root class for image editor control to load and edit the images.

Inheritance

System.Object

SfImageEditor

Namespace: Syncfusion.SfImageEditor.XForms

Assembly: Syncfusion.SfImageEditor.XForms.dll

Syntax

public class SfImageEditor : View, IParentThemeElement, IThemeElement

Constructors

SfImageEditor()

Initializes a new instance of the SfImageEditor class.

Declaration

public SfImageEditor()

Fields

ActualImageRenderedBoundsProperty

Gets or sets the ActualImageRendererBounds value. It is a bindable property.

Declaration

public static readonly BindableProperty ActualImageRenderedBoundsProperty

Field Value

Type	Description
Xamarin.Forms.BindableProperty

ColorPaletteProperty

Gets or sets the ColorPalette collection value. It is a bindable property.

Declaration

public static readonly BindableProperty ColorPaletteProperty

Field Value

Type	Description
Xamarin.Forms.BindableProperty

DefaultSelectedColorIndexProperty

Gets or sets the DefaultSelectedColorIndex value.

Declaration

public static readonly BindableProperty DefaultSelectedColorIndexProperty

Field Value

Type	Description
Xamarin.Forms.BindableProperty

EffectValueProperty

Gets or sets the value for image effects. It is a bindable property.

Declaration

public static readonly BindableProperty EffectValueProperty

Field Value

Type	Description
Xamarin.Forms.BindableProperty

EnableAutoSelectTextProperty

Gets or sets the value for whether edit text selection is enabled or not.

Declaration

public static readonly BindableProperty EnableAutoSelectTextProperty

Field Value

Type	Description
Xamarin.Forms.BindableProperty

EnableZoomingProperty

Gets or sets the value for whether zooming is enabled or not. It is a bindable property.

Declaration

public static readonly BindableProperty EnableZoomingProperty

Field Value

Type	Description
Xamarin.Forms.BindableProperty

ImageEffectProperty

Gets or sets the type of image effects. It is a bindable property.

Declaration

public static readonly BindableProperty ImageEffectProperty

Field Value

Type	Description
Xamarin.Forms.BindableProperty

MaximumZoomLevelProperty

Gets or sets the MaximumZoomLevel for Zooming. It is a bindable property.

Declaration

public static readonly BindableProperty MaximumZoomLevelProperty

Field Value

Type	Description
Xamarin.Forms.BindableProperty

OriginalImageSizeProperty

Gets or sets the original image size value. It is a bindable property.

Declaration

public static readonly BindableProperty OriginalImageSizeProperty

Field Value

Type	Description
Xamarin.Forms.BindableProperty

PanningModeProperty

Gets or sets the value for panning mode. It is a bindable property.

Declaration

public static readonly BindableProperty PanningModeProperty

Field Value

Type	Description
Xamarin.Forms.BindableProperty

RotatableElementsProperty

Gets or sets the Rotatable elements value. It is a bindable property.

Declaration

public static readonly BindableProperty RotatableElementsProperty

Field Value

Type	Description
Xamarin.Forms.BindableProperty

SourceProperty

Gets or sets the image source value. It is a bindable property.

Declaration

public static readonly BindableProperty SourceProperty

Field Value

Type	Description
Xamarin.Forms.BindableProperty

ToolbarSettingsProperty

Gets or sets the ToolbarSetting value. It is a bindable property.

Declaration

public static readonly BindableProperty ToolbarSettingsProperty

Field Value

Type	Description
Xamarin.Forms.BindableProperty

ZoomLevelProperty

Gets or sets the zoom level value. It is a bindable property.

Declaration

public static readonly BindableProperty ZoomLevelProperty

Field Value

Type	Description
Xamarin.Forms.BindableProperty

Properties

ActualImageRenderedBounds

To get the Actual image rect. It is read-only property.

Declaration

public Rectangle ActualImageRenderedBounds { get; }

Property Value

Type	Description
Xamarin.Forms.Rectangle

ColorPalette

Gets/sets ColorPalette collection value.

Declaration

public ObservableCollection<Color> ColorPalette { get; set; }

Property Value

Type	Description
System.Collections.ObjectModel.ObservableCollection<Xamarin.Forms.Color>

DefaultSelectedColorIndex

Gets or Sets the DefaultSelectedColorIndex value.

Declaration

public int DefaultSelectedColorIndex { get; set; }

Property Value

Type	Description
System.Int32	This property takes the System.Int32 as value.

Examples

This example shows how to set value for DefaultSelectedColorIndex.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.DefaultSelectedColorIndex = 1;
}

EffectValue

Gets or sets the value of Image effects.

Declaration

public float EffectValue { get; set; }

Property Value

Type	Description
System.Single

EnableAutoSelectText

To define whether to enable selection of edit text in Text preview dialog.

Declaration

public bool EnableAutoSelectText { get; set; }

Property Value

Type	Description
System.Boolean	This property takes the System.Boolean as value.

Examples

This sample shows how to set the selection of edit text for text preview dialog.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.EnableAutoSelectText = true;
}

EnableZooming

To define whether to enable image zooming or not.

Declaration

public bool EnableZooming { get; set; }

Property Value

Type	Description
System.Boolean	This property takes the System.Boolean as value.

Examples

This sample shows how to set the EnableZooming for the image editor.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.EnableZooming = false;
}

ImageEffect

Gets or sets the effects of the Image. The default effects are Hue,Saturation,Contrast,Brightness,Sharpen,Blur.

Declaration

public ImageEffect ImageEffect { get; set; }

Property Value

Type	Description
ImageEffect

IsImageEdited

To check whether any editing has been performed in the image. It is a read-only property.

Declaration

public bool IsImageEdited { get; }

Property Value

Type	Description
System.Boolean	This property takes the System.Boolean as value.

Examples

This sample shows how to get the IsEdited value for the image editor.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    var isEdited = imageEditor.IsEdited;
}

IsImageZoomed

Gets a boolean value that indicate whether the image gets zoomed or not. It is a read-only property.

Declaration

public bool IsImageZoomed { get; }

Property Value

Type	Description
System.Boolean

IsSelected

To check whether any annotations are selected. It is a read-only property.

Declaration

public bool IsSelected { get; }

Property Value

Type	Description
System.Boolean	This property takes the System.Boolean as value.

Examples

This sample shows how to get the IsSelected value for the image editor.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    var isSelected = imageEditor.IsSelected;
}

MaximumZoomLevel

Gets or sets the maximumZoomLevel of the Zooming Image. It is a bindable property.

Declaration

public float MaximumZoomLevel { get; set; }

Property Value

Type	Description
System.Single	This property takes the System.Single as value.

Examples

This sample shows how to set the MaximumZoomLevel for Zooming.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.MaximumZoomLevel = 4;
}

OriginalImageSize

To get the original image size. It is read-only property.

Declaration

public Size OriginalImageSize { get; }

Property Value

Type	Description
Xamarin.Forms.Size

PanningMode

To define whether the PanningMode is SingleFinger or TwoFinger.

Declaration

public PanningMode PanningMode { get; set; }

Property Value

Type	Description
PanningMode	This property takes the PanningMode as value.

Examples

This sample shows how to set the image PanningMode.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.PanningMode = PanningMode.TwoFinger;
}

RotatableElements

Gets or sets the Rotatable elements value.

Declaration

public ImageEditorElements RotatableElements { get; set; }

Property Value

Type	Description
ImageEditorElements

Source

To get and set source of the image.

Declaration

public ImageSource Source { get; set; }

Property Value

Type	Description
Xamarin.Forms.ImageSource	This property takes the Xamarin.Forms.ImageSource as value.

Examples

This sample shows how to set the Source for the image editor.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.Source = ImageSource.FromResource(�NameSpace.imageName.jpg�); // To Load embedded resource
}

ToolbarSettings

To customize the toolbar appearance with the help of ToolbarSettings properties.

Declaration

public ToolbarSettings ToolbarSettings { get; set; }

Property Value

Type	Description
ToolbarSettings	This property takes the ToolbarSettings as value.

Examples

This sample shows how to set the ToolbarSettings value.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.ToolbarSettings = new ToolbarSettings();
}

ZoomLevel

Gets or sets the zoom level value.This property is used to change the image zoom level programmatically.

Declaration

public double ZoomLevel { get; set; }

Property Value

Type	Description
System.Double

Methods

add_BeginReset(BeginResetEventHandler)

Declaration

public void add_BeginReset(BeginResetEventHandler value)

Parameters

Type	Name	Description
BeginResetEventHandler	value

add_EndReset(EndResetEventHandler)

Declaration

public void add_EndReset(EndResetEventHandler value)

Parameters

Type	Name	Description
EndResetEventHandler	value

add_ImageLoaded(ImageLoadedEventHandler)

Declaration

public void add_ImageLoaded(ImageLoadedEventHandler value)

Parameters

Type	Name	Description
ImageLoadedEventHandler	value

add_ImageSaved(ImageSavedEventHandler)

Declaration

public void add_ImageSaved(ImageSavedEventHandler value)

Parameters

Type	Name	Description
ImageSavedEventHandler	value

add_ImageSaving(ImageSavingEventHandler)

Declaration

public void add_ImageSaving(ImageSavingEventHandler value)

Parameters

Type	Name	Description
ImageSavingEventHandler	value

add_ItemSelected(ItemSelectedEventHandler)

Declaration

public void add_ItemSelected(ItemSelectedEventHandler value)

Parameters

Type	Name	Description
ItemSelectedEventHandler	value

add_ItemUnselected(ItemUnselectedEventHandler)

Declaration

public void add_ItemUnselected(ItemUnselectedEventHandler value)

Parameters

Type	Name	Description
ItemUnselectedEventHandler	value

AddCustomView(Object, CustomViewSettings)

Adds custom view as annotations over the image.

Declaration

public void AddCustomView(object customView, CustomViewSettings customViewSettings = null)

Parameters

Type	Name	Description
System.Object	customView	Custom view.
CustomViewSettings	customViewSettings	Custom view settings.

Examples

This sample shows how to add custome view over the image.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.AddCustomView(new Button());
}

AddShape(ShapeType, PenSettings)

Adds shapes as annotations over the image.

Declaration

public void AddShape(ShapeType shapeType, PenSettings settings = null)

Parameters

Type	Name	Description
ShapeType	shapeType	ShapeType is optional. Default ShapeType is Path.
PenSettings	settings	PenSettings is optional. If null, default PenSettings is applied.

Examples

This sample shows how to add shape over the image.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.AddShape(ShapeType.Rectangle);
}

AddText(String, TextSettings)

Adds text as annotation on top of the image.

Declaration

public void AddText(string text = "", TextSettings settings = null)

Parameters

Type	Name	Description
System.String	text	text is optional. If empty, empty string will be added.
TextSettings	settings	TextSettings is optional. If null, default TextSettings is applied.

Examples

This sample shows how to add text over the image.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.AddText("Syncfusion", new TextSettings(){Color = Color.Red});
}

ApplyImageEffect(ImageEffect, Int32)

To apply the image effects without using the toolbar.

Declaration

public void ApplyImageEffect(ImageEffect imageEffects, int effectValue)

Parameters

Type	Name	Description
ImageEffect	imageEffects	The image effect.
System.Int32	effectValue	The image effect value.

Examples

This sample shows how to set the effects for image.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.SendToBackward();
}

BringForward()

To bring the selected object to one step front of a group of elements on image.

Declaration

public void BringForward()

Examples

This sample shows how to bring the selected object to one step front of a group of elements on image.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.BringForward();
}

BringToFront()

To bring the selected object to the front of a group of elements on image.

Declaration

public void BringToFront()

Examples

This sample shows how to bring the selected object to the front of a group of elements on image.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.BringToFront();
}

ClearAnnotations()

Clear all the shapes/text added on the image.

Declaration

public void ClearAnnotations()

Examples

This sample shows how to clear all the shapes/text on the image.

void MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.ClearAnnotations();
}

Crop(Rectangle, Boolean)

Crops the image based on the specified bounds.

Declaration

public void Crop(Rectangle rect = null, bool isEllipse = false)

Parameters

Type	Name	Description
Xamarin.Forms.Rectangle	rect	Bounds to crop the image.(Optional).
System.Boolean	isEllipse	True to crop in elliptical shape, false otherwise.(Optional).

Examples

This sample shows how to get the Crop the image.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.Crop();
}

Delete()

Deletes the selected shape on the image.

Declaration

public void Delete()

Examples

This sample shows how to delete the selected shape over the image.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.Delete();
}

Flip(FlipDirection)

Flips the image horizontally/ vertically.

Declaration

public void Flip(FlipDirection direction)

Parameters

Type	Name	Description
FlipDirection	direction	Specfies the FlipDirection.

Examples

This sample shows how to flip the image.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.Flip(FlipDirection.Horizontal);
}

GetStream()

Gets the current image stream. Obtained only after saving.

Declaration

public Task<Stream> GetStream()

Returns

Type	Description
System.Threading.Tasks.Task<System.IO.Stream>	A Stream.

Examples

This sample shows how to add shape over the image.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    var stream = imageEditor.GetStream().Result;
}

LoadEdits(Stream)

LoadEdits() method used to deserialize the shapes.

Declaration

public void LoadEdits(Stream str)

Parameters

Type	Name	Description
System.IO.Stream	str	The image stream.

Examples

This sample shows how to load the image edits as stream.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    var assembly = typeof(App).GetTypeInfo().Assembly;
    Stream stream = new MemoryStream();
    var fileName = "namespace_name.Chart.txt";
    stream = assembly.GetManifestResourceStream(fileName);
    if (stream != null)
    imageEditor.LoadEdits(stream);
}

OnBindingContextChanged()

override method.

Declaration

protected override void OnBindingContextChanged()

OnMeasure(Double, Double)

Method used to measure the ImageEditor.

Declaration

protected override SizeRequest OnMeasure(double widthConstraint, double heightConstraint)

Parameters

Type	Name	Description
System.Double	widthConstraint	Width of the ImageEditor.
System.Double	heightConstraint	Height of the ImageEditor.

Returns

Type	Description
Xamarin.Forms.SizeRequest	Actual size of the ImageEditor.

Redo()

Reverts the latest Undo operation.

Declaration

public void Redo()

Examples

This sample shows how to redo the undone change.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.Redo();
}

remove_BeginReset(BeginResetEventHandler)

Declaration

public void remove_BeginReset(BeginResetEventHandler value)

Parameters

Type	Name	Description
BeginResetEventHandler	value

remove_EndReset(EndResetEventHandler)

Declaration

public void remove_EndReset(EndResetEventHandler value)

Parameters

Type	Name	Description
EndResetEventHandler	value

remove_ImageLoaded(ImageLoadedEventHandler)

Declaration

public void remove_ImageLoaded(ImageLoadedEventHandler value)

Parameters

Type	Name	Description
ImageLoadedEventHandler	value

remove_ImageSaved(ImageSavedEventHandler)

Declaration

public void remove_ImageSaved(ImageSavedEventHandler value)

Parameters

Type	Name	Description
ImageSavedEventHandler	value

remove_ImageSaving(ImageSavingEventHandler)

Declaration

public void remove_ImageSaving(ImageSavingEventHandler value)

Parameters

Type	Name	Description
ImageSavingEventHandler	value

remove_ItemSelected(ItemSelectedEventHandler)

Declaration

public void remove_ItemSelected(ItemSelectedEventHandler value)

Parameters

Type	Name	Description
ItemSelectedEventHandler	value

remove_ItemUnselected(ItemUnselectedEventHandler)

Declaration

public void remove_ItemUnselected(ItemUnselectedEventHandler value)

Parameters

Type	Name	Description
ItemUnselectedEventHandler	value

Reset()

Resets the changes and initial image is loaded.

Declaration

public void Reset()

Examples

This sample shows how to reset to the initial image.

void MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.Reset();
}

Rotate()

Rotates the image to 90 degrees.

Declaration

public void Rotate()

Examples

This sample shows how to Rotate the image.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.Rotate();
}

Save(String, Size)

Saves the image to a location.

Declaration

public void Save(string format = null, Size size = null)

Parameters

Type	Name	Description
System.String	format	Image string format.
Xamarin.Forms.Size	size	Image size.

Examples

This sample shows how to save the image.

void MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.Save();
}

SaveEdits()

SaveEdits() method used to serialize the current edits of shapes. Serialized object will be return in the form of JSON stream.

Declaration

public Stream SaveEdits()

Returns

Type	Description
System.IO.Stream	Image stream.

Examples

This sample shows how to save the current edits.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.SaveEdits();
}

SelectShape(Int32)

To select the annotation added on the image programmatically using its unique ID.

Declaration

public void SelectShape(int ID)

Parameters

Type	Name	Description
System.Int32	ID

Examples

This code shows how to select the annotation added on the image using its unique ID.

void MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.SelectShape(2);
}

SendBackward()

To send the selected object to one step backward of a group of elements on image.

Declaration

public void SendBackward()

Examples

This sample shows how to send the selected object to one step backward of a group of elements on image.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.SendToBackward();
}

SendToBack()

To send the selected object to the Back of a group of elements on image.

Declaration

public void SendToBack()

Examples

This sample shows how to send the selected object to the Back of a group of elements on image.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.SendToBack();
}

SetToolbarItemVisibility(String, Boolean)

To set the toolbar icon visibility based on the icon name.

Declaration

public void SetToolbarItemVisibility(string name, bool isVisible)

Parameters

Type	Name	Description
System.String	name	The icon name to be hidden.
System.Boolean	isVisible	Set the visibility.

Examples

This sample shows how to hide unwanted toolbar items.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.SetToolbarItemVisibility("path,text", false)
}

Tilt(Int32)

To rotate the image from -45 to 45 degree in preview state. To crop the preview rotation, call Crop() method of SfImageEditor.

Declaration

public void Tilt(int angle)

Parameters

Type	Name	Description
System.Int32	angle	double value to get the tilt angle

ToggleCropping()

Enables / disables the cropping view which helps to choose the area to crop.

Declaration

public void ToggleCropping()

Examples

This sample shows how to enable the cropping view over the image.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.ToggleCropping();
}

ToggleCropping(Boolean, Int32)

Enables the cropping preview sub toolbar items. Specify selectedIndex value to customize default selection of cropping preview toolbar item.

Declaration

public void ToggleCropping(bool showToolbarItems, int selectedIndex = 0)

Parameters

Type	Name	Description
System.Boolean	showToolbarItems	Enable or disable cropping preview toolbar items.
System.Int32	selectedIndex	Change the default cropping selection preview toolbar item.

ToggleCropping(Single, Single, Boolean)

To crop the image based on X and Y aspect ratio.

Declaration

public void ToggleCropping(float xRatio, float yRatio, bool isEllipse = false)

Parameters

Type	Name	Description
System.Single	xRatio	Cropping x ratio.
System.Single	yRatio	Cropping y ratio.
System.Boolean	isEllipse	Crops in circular shape when true and in rectangular by default.(Optional parameter).

Examples

This sample shows how to crop the image based on the aspect ratio.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.ToggleCropping(16,9);
}

ToggleCropping(Rectangle)

To crop the image based on Custom Rectangle value.

Declaration

public void ToggleCropping(Rectangle rectangle)

Parameters

Type	Name	Description
Xamarin.Forms.Rectangle	rectangle	Rectangle.

Examples

This sample shows how to crop the image based on custom values.

Public MyPage()
{
    Rectangle rectangle = new Rectangle(45,45,400,400);
    SfImageEditor imageEditor = new SfImageEditor();
    imageeditor.ToggleCropping(rectangle);
}

ToggleCropping(Rectangle, Boolean)

Enables the cropping preview on the image with the specified rectangle bounds. Specify isEllipse as true to crop in elliptical shape.

Declaration

public void ToggleCropping(Rectangle rectangle, bool isEllipse)

Parameters

Type	Name	Description
Xamarin.Forms.Rectangle	rectangle	Bounds of the cropping preview on the image.
System.Boolean	isEllipse	True to crop in elliptical shape, false otherwise.

Undo()

Reverts the latest change done in the image.

Declaration

public void Undo()

Examples

This sample shows how Undo the changes in the image.

Public MyPage()
{
    SfImageEditor imageEditor = new SfImageEditor();
    imageEditor.Undo();
}

Events

BeginReset

Represents BeginReset event

Declaration

public event BeginResetEventHandler BeginReset

Event Type

Type	Description
BeginResetEventHandler

EndReset

Represent EndReset event

Declaration

public event EndResetEventHandler EndReset

Event Type

Type	Description
EndResetEventHandler

ImageEdited

The event raised when the Image is Edited

Declaration

public event EventHandler<ImageEditedEventArgs> ImageEdited

Event Type

Type	Description
System.EventHandler<ImageEditedEventArgs>

ImageLoaded

Represents ImageLoaded event

Declaration

public event ImageLoadedEventHandler ImageLoaded

Event Type

Type	Description
ImageLoadedEventHandler

ImageSaved

Represent ImageSaved event

Declaration

public event ImageSavedEventHandler ImageSaved

Event Type

Type	Description
ImageSavedEventHandler

ImageSaving

Represent ImageSaving event

Declaration

public event ImageSavingEventHandler ImageSaving

Event Type

Type	Description
ImageSavingEventHandler

ItemSelected

Represent ItemSelected event

Declaration

public event ItemSelectedEventHandler ItemSelected

Event Type

Type	Description
ItemSelectedEventHandler

ItemUnselected

Represent ItemUnselected event

Declaration

public event ItemUnselectedEventHandler ItemUnselected

Event Type

Type	Description
ItemUnselectedEventHandler