Rounded editor field using handlers in .NET Maui

Customizing the UI elements is challenging in app development when we are using cross platform mobile app development. UIs will be different in both the platforms but as a cross platform app developer they have to write a custom code to match the UI elements in both the platforms.

This customization was implemented using Custom Renders in Xamarin.Forms framework. Now in .NET Maui they are called as handlers. There are many was to write handlers in Maui, for implementing rounded editor we use a  custom controls.Handlers are global, to customize a specific Editor control on a page that contains multiple Editor controls, you should first subclass the Editor control.

CustomEditor

After creating the mappers for your handler, you must provide handler implementations on all platforms. This can be accomplished by adding partial class handler implementations in the child folders of the Platforms folder.

Create the platform controls in Android

CustomEditorMapper

Create the platform controls in iOS

CustomEditorMapper

Register the handler

A custom control and its handler must be registered with an app, before it can be consumed. This should occur in the CreateMauiApp method in the MauiProgram class in your app project, which is the cross-platform entry point for the app:

MauiProgram

Consuming custom controls in XAML file:

MainPage.xaml

Final outcome of this implementation is here:

Complete project can be found here: https://github.com/GovardhanNag/EditorRenderer.git