How to create a rounded corner in .NET MAUI TextInputLayout?

This section explains how to create rounded corners for the .NET MAUI TextInputLayout control to enhance the visual appeal of your user interface.

By utilizing the ContainerType property and configuring the OutlineCornerRadius, you can achieve a stylish outlined style with rounded corners.

Steps:

Step 1: Use ContainerType Property

To create a visually appealing outlined style with rounded corners, set the ContainerType property of the .NET MAUI TextInputLayout control to Outlined. This property allows you to specify the appearance of the input field container.

Step 2: Configure OutlineCornerRadius

Utilize the OutlineCornerRadius property within the TextInputLayout to set the radius value for the rounded corners, achieving the desired curvature.

XAML

<inputLayout:SfTextInputLayout Hint="Name" 
                               ContainerType="Outlined"  
                               HeightRequest="100"
                               WidthRequest="250"                                 
                               OutlineCornerRadius="20">                                  
       <Entry Text="James" />
</inputLayout:SfTextInputLayout>

Output

Conclusion

I hope you enjoyed learning how to create a rounded corner in the NET MAUI TextInputLayout.

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

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