How to integrate .NET MAUI Cards with an Android Native Embedding Application?

In this article, you will learn how to create a .NET MAUI Cards native embedded Android application by following the step by step process explained as follows.

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

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

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

Step 3:
Creating a MauiAppBuilder object and using the UseMauiEmbedding function is the standard procedure for initializing .NET MAUI in a native app project.

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

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:

Create a grid layout and initialize the CardLayout, then add the card views to the CardLayout. Finally, add the card layout to the grid as children.

MauiContext? _mauiContext;
protected override void OnCreate(Bundle? savedInstanceState)
{
   ...
   Grid grid = new Grid();
   SfCardLayout cardLayout = new SfCardLayout();

   //Add children for card layout.
   cardLayout.Children.Add(new SfCardView() { Content = new Label() { Text = "Peach", BackgroundColor = Colors.PeachPuff, HorizontalTextAlignment = TextAlignment.Center, VerticalTextAlignment = TextAlignment.Center }, CornerRadius = 15 });
   cardLayout.Children.Add(new SfCardView() { Content = new Label() { Text = "MediumPurple", BackgroundColor = Colors.MediumPurple, HorizontalTextAlignment = TextAlignment.Center, VerticalTextAlignment = TextAlignment.Center }, CornerRadius = 15 });
   cardLayout.Children.Add(new SfCardView() { Content = new Label() { Text = "LightPink", BackgroundColor = Colors.LightPink, HorizontalTextAlignment = TextAlignment.Center, VerticalTextAlignment = TextAlignment.Center }, CornerRadius = 15 });
   grid.Children.Add(cardLayout);
   ...
}

Step 5:

Convert the grid layout with Cards 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 = grid.ToPlatform(_mauiContext);

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

Download the complete sample on GitHub

Output:

Conclusion:
I hope you enjoyed learning how to integrate Android Native Embedding for the .NET MAUI Cards.

You can refer to our .NET MAUI Cards feature tour page to learn about its other groundbreaking feature representations. Explore our .NET MAUI Cards documentation to understand how to present and manipulate data.

For current customers, you can check out our .NET MAUI from the License and Downloads page. If you are new to Syncfusion®, try our 30-day free trial to check out our .NET MAUI Cards 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!