How to integrate .NET MAUI Image Editor with Android native embedding application?

This article demonstrates how to create a .NET MAUI Image Editor embedded in an Android native application by following these steps.

Step 1:
Create a .NET Android application and install the Syncfusion.Maui.ImageEditor NuGet package using nuget.org.

Step 2:
In the project file of the native application, add <UseMaui>true</UseMaui> to enable .NET MAUI support as demonstrated below.

<PropertyGroup>
   <Nullable>enable</Nullable>
   <ImplicitUsings>enable</ImplicitUsings>
   <UseMaui>true</UseMaui>
</PropertyGroup>

Step 3:
Create a MauiAppBuilder object and use the UseMauiEmbedding function to initialize .NET MAUI in a native app project.

Use the Build() method on the MauiAppBuilder object to build a MauiApp object. From the MauiApp object, create a MauiContext object. Converting .NET MAUI controls to native types will involve using the MauiContext object.

MauiContext? _mauiContext;
protected override void OnCreate(Bundle? savedInstanceState)
{
   base.OnCreate(savedInstanceState);
   MauiAppBuilder builder = MauiApp.CreateBuilder();
   builder.UseMauiEmbedding<Microsoft.Maui.Controls.Application>();
   builder.ConfigureSyncfusionCore();
   MauiApp mauiApp = builder.Build();
   _mauiContext = new MauiContext(mauiApp.Services, this);
}

Step 4:
Initialize the Image Editor control and add the image to the Resources folder of the project. Then, set the image editor’s Source property. Refer to the following code sample for a better understanding.

protected override void OnCreate(Bundle? savedInstanceState)
{
   ...
   SfImageEditor imageEditor = new SfImageEditor();
   imageEditor.Source = ImageSource.FromResource("NativeEmbedding_ImageEditor.Resources.Images.image.png");
   ...
}

Step 5:
Convert the Image Editor control to a platform-specific view for the MAUI framework and set this view as the content view for the current Android activity.

protected override void OnCreate(Bundle? savedInstanceState)
{
   Android.Views.View view = imageEditor.ToPlatform(_mauiContext);

   // Set our view from the "main" layout resource.
   SetContentView(view);
}

Download the complete sample from GitHub.

Output:

Conclusion:
I hope you enjoyed learning how to integrate Android native embedding for the .NET MAUI Image Editor.

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

Check out our .NET MAUI from the License and Downloads page for current customers. 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 comments section if you have any queries or require clarification. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!