Image cannot be retrieved

[Andreas Mey]

Hi guys! 

Thanks a lot for your effort to bring the RichEditorEditor to life.

I have noticed the following problem: If you insert an image using the toolbar, it will appear in the HtmlContent property. However, if you save and then restore the content of this property, the editor will only show a placeholder.

That leads to another question. How can you insert an image in the HtmlContent property by code? Could you please provide a small sample.

The idea would be:

rte.HtmlContent = "<p>Milk" + GetImageAsHtml("milk") + ", Eggs, Bread, Fruits, Vegetables</p>"

...

string GetImageAsHtml(string name)
{
    return "<img src=...>";
}

Kind regards,
Andreas

[Vidyalakshmi Mani]

Hi Andreas,

We’ve reviewed your query regarding image persistence in the HtmlText property. Currently, images inserted via the toolbar are rendered using Blob URLs, which are optimized for memory usage in .NET MAUI. However, Blob URLs are session-specific and not persistent, which is why restoring saved HtmlText results in placeholders instead of the original images.

We understand the need to preserve images across sessions and are actively exploring a workaround, such as converting images to Base64 format to support persistent image rendering. We’ll continue investigating this and provide an update by 9th October 2025.

Thank you for your patience and understanding.

Regards,

Vidyalakshmi M.

[Andreas Mey]

Hi  Vidyalakshmi,

Thank you very much for your quick response. It would be fine to convert the image to Base64.

Are there any plans to allow users to select an image inside the editor and e.g. change its size programmatically or by 'handles'?

Have a nice day,

Andreas

[Vidyalakshmi Mani]

Hi Andreas,

We’d like to let you know that the SfRichTextEditor provides an event named ImageRequested, which allows you to handle image insertion based on your specific needs. By setting the IsHandled property to true in the event arguments, you can customize the image insertion process.

For your reference, we’ve included the user guide documentation that explains how to use this event.

User Guide Documentation link: Image Insertion in .NET MAUI Rich Text Editor | Syncfusion®

Using this approach, you can insert images as needed. Please take a look and let us know if you have any questions.

We will also check internally and update you if we come up with a new solution regarding image selection and resizing within the editor.

Regards,

Vidyalakshmi M.

[Andreas Mey]

Hi  Vidyalakshmi,

Thank you very much for your quick responses and superb overall service. It's a pleasure!

Unfortunately, the User Guide Documentation link: Image Insertion in .NET MAUI Rich Text Editor | Syncfusion® does not provide any useful information. Could you please provide a small code sample showing how to return a base64-encoded image?

For example:

private void OnImageRequested(object sender, RichTextEditorImageRequestedEventArgs e)

{

    e.IsHandled = true;

    ...

    // please insert your code here, which shows how to return a base64-encoded image

    ...

}

Thanks in advance.

Best regards,

Andreas

[Andreas Mey]

Hi  Vidyalakshmi,

I found a (quick and dirty) solution by myself:

private void OnImageRequested(object sender, RichTextEditorImageRequestedEventArgs e)
{

    if (sender is not SfRichTextEditor editor)
        return;

     e.IsHandled = true;

     using var imageEncodeStream = await FileSystem.OpenAppPackageFileAsync("picture.png");
     using var memoryStream = new MemoryStream();

     imageEncodeStream.CopyTo(memoryStream);

     string base64EncodedImage = Convert.ToBase64String(memoryStream.ToArray());

     var imageBytes = Convert.FromBase64String(base64EncodedImage);

     var streamImageSource = new StreamImageSource
     { 
         Stream = async (cancellationToken) => { return new MemoryStream(imageBytes); } 
     };

     RichTextEditorImageSource richTextEditorImageSource = new()
     {
            Source = streamImageSource,
            ImageFormat = RichTextEditorImageFormat.Base64,
            Height = 100,
            Width = 100
      };

      editor.InsertImage(richTextEditorImageSource);
}

This works like a charm!

Thank you very much for your support and the provided base64-Support.

Best regards,
Andreas

[Vidyalakshmi Mani]

Hi Andreas,

We’re glad that the issue has been rectified. Please let us know if you require any further assistance with this. We will be happy to assist you.

Regards,

Vidyalakshmi M.