DEV Community

Cover image for Import and Export Word Documents in .NET MAUI Rich Text Editor with DocIO
Calvince Moth for Syncfusion, Inc.

Posted on • Originally published at syncfusion.com on

Import and Export Word Documents in .NET MAUI Rich Text Editor with DocIO

TL;DR: Developers often need to move Word content seamlessly across platforms. This guide shows how to import Word documents into a .NET MAUI Rich Text Editor and export them back using DocIO, ensuring consistent formatting and productivity.

Bring native Word document handling to your cross‑platform .NET MAUI apps

Modern cross‑platform apps no longer work with plain text alone. They handle full‑fledged documents, rich formatting, images, and structured content that users expect to look consistent on every device.

Among these formats, Word documents remain a preferred choice for real‑world apps. Users expect to open a .docx file, edit it effortlessly, and save it back, whether they’re using a mobile device or a desktop. In a cross‑platform .NET MAUI app, delivering this experience reliably can be challenging.

That’s where the Syncfusion® .NET MAUI Rich Text Editor comes in. It simplifies document handling across iOS, Android, Windows, and macOS, allowing you to work with rich content while preserving formatting, images, and layout. With built‑in support for importing and exporting Word documents, content moves seamlessly between platforms without unexpected surprises.

This makes it a great fit for:

  • Business and enterprise apps.
  • Blog and content editors.
  • Email composers.
  • Collaborative and productivity tools.

What this article covers

In this blog, you’ll learn how to:

  • Import a Word document into the Syncfusion .NET MAUI Rich Text Editor by converting it to HTML.
  • Export edited content back to Word using Syncfusion .NET Word Library, without losing text, images, or formatting.

Let’s get started!

Getting started with .NET MAUI Rich Text Editor

First, create a .NET MAUI application.

Then, declare the SfRichTextEditor in your XAML page, where the converted Word content will be displayed.

For more details, refer to the Syncfusion .NET MAUI Rich Text Editor blog.

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:rte="clr-namespace:Syncfusion.Maui.RichTextEditor;assembly=Syncfusion.Maui.RichTextEditor"
             x:Class="MauiApp1.MainPage">
    <rte:SfRichTextEditor x:Name="richTextEditor" />
</ContentPage>

Enter fullscreen mode Exit fullscreen mode

Note: Rich Text Editor features are organized into individual modules. To enable the import or export functionality, add the ImportExportService to the provider’s array.

Import a Word document into the .NET MAUI Rich Text Editor

To bring Word content into the .NET MAUI Rich Text Editor, read the Word file stream and load it using the Syncfusion DocIO library.

Next, convert the Word document to HTML so the Rich Text Editor can render it accurately. To ensure images are displayed correctly, we encode them as Base64 and embed them inline, creating a self-contained HTML string. Finally, we assign this HTML string to the SfRichTextEditor.HtmlText property, so the content appears instantly in the Rich Text Editor UI.

Here is the implementation code:

using var inStream = await file.OpenReadAsync();
using var ms = new MemoryStream();
await inStream.CopyToAsync(ms);
ms.Position = 0;

using var document = new WordDocument(ms, FormatType.Automatic);

document.SaveOptions.ImageNodeVisited += (s, args) =>
{
    using var imgMs = new MemoryStream();
    args.ImageStream.Position = 0;
    args.ImageStream.CopyTo(imgMs);

    var bytes = imgMs.ToArray();
    string mime =
        bytes.Length > 3 && bytes[0] == 0xFF && bytes[1] == 0xD8 ? "image/jpeg" :
        bytes.Length > 8 && bytes[0] == 0x89 && bytes[1] == 0x50 && bytes[2] == 0x4E && bytes[3] == 0x47 ? "image/png" :
        bytes.Length > 6 && bytes[0] == 0x47 && bytes[1] == 0x49 && bytes[2] == 0x46 ? "image/gif" :
        bytes.Length > 2 && bytes[0] == 0x42 && bytes[1] == 0x4D ? "image/bmp" :
        "image/png";

    var data = Convert.ToBase64String(bytes);
    args.Uri = $"data:{mime};base64,{data}";
};

using var htmlStream = new MemoryStream();
document.Save(htmlStream, FormatType.Html);
htmlStream.Position = 0;

using var reader = new StreamReader(htmlStream);
var html = await reader.ReadToEndAsync();

richTextEditor.HtmlText = html;
Enter fullscreen mode Exit fullscreen mode

This article was originally published at Syncfusion.com.

Top comments (0)