How to save Image using FileSaver in the .NET MAUI Image Editor (SfImageEditor)?

The Syncfusion® .NET MAUI Image Editor (SfImageEditor) allows you to save images using FileSaver, which enables users to select a specific folder and save files to the file system. This guide demonstrates how to save images using the Community Toolkit - FileSaver.

XAML:

Initiate the Image Editor control and trigger the ImageSaving event.

<imageEditor:SfImageEditor x:Name="imageEditor" ImageSaving="OnImageSaving" Source="image.png"/>

C#:

Use the SaveAsync method to save files. The method returns a result that you can use to verify if the file was saved successfully, check its location, and handle any exceptions. The EnsureSuccess method confirms the successful save of the file.

async Task SaveFile(CancellationToken cancellationToken, Stream stream)
{
   FileSaverResult fileSaverResult = await FileSaver.Default.SaveAsync("test.png", stream, cancellationToken);
   fileSaverResult.EnsureSuccess();
   await Toast.Make($"File is saved: {fileSaverResult.FilePath}").Show(cancellationToken);
}

C#:

In the ImageSaving event, call the SaveFile method to display the FileSaver once the save icon is clicked.

private void OnImageSaving(object sender, Syncfusion.Maui.ImageEditor.ImageSavingEventArgs e)
{
   SaveFile(CancellationToken.None, e.ImageStream);
}

Download the complete sample from GitHub.

Conclusion:

I hope you enjoyed learning how to save images using FileSaver in the .NET MAUI Image Editor (SfImageEditor).

Refer to our .NET MAUI Image Editor feature tour page for other groundbreaking feature representations. You can also explore our .NET MAUI Image Editor documentation to understand how to present and manipulate data.

For current customers, check out our .NET MAUI components from the License and Downloads page. If you are new to Syncfusion®, try our 30-day free trial to check out our .NET MAUI Image Editor and other .NET MAUI components.

Please let us know in the following comment section if you have any queries or require clarification. Contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!