Entry with Custom Border in Xamarin Forms

Introduction:

In Xamarin Forms Entry control allows a single line of text to be edited. This article demonstrates how to create a custom renderer for the Entry control, enabling developers to override the default native rendering with their own platform-specific customization.

Custom Renderer:

  1. This sample demonstrates a custom renderer for the Entry control, “Enabling developers to override the default native rendering” with their own platform-specific customization.
  2. Custom renderers provide a powerful approach for customizing the appearance and behavior of Xamarin Forms controls. They can be used for small styling changes or sophisticated platform-specific layout and behavior customization.

 

Step1: Create the Mobile App (Xamarin Forms) Project

Open VisualStudio 2017 à File à New à Project à Choose Cross-Platform Template à Choose MobileApp (Xamarin.Forms )à Name it as EntryLineWithanyColorà Click on OKà Chose .NetStanderdà Click OK

 

Step2: Creating CustomEntry.cs

Go to Project EntryLineWithanyColorà Right Click àAdd Class CustomEntry.cs

File Name: CustomEntry.cs

A custom Entry can be created by subclassing the Entry control, as shown in the following code

The CustomEntry control is created in the .NET Standard library project and is simply  ENTRY control. Customization of the control will be carried out in the custom renderer, so no additional implementation is required in the CustomEntry control.

 

Step 3:  Create a class in the Android directory and name it as CustomRenderer.cs

Go to EntryLineWithanyColor.Android à Right Click àAdd Class CustomRenderer.cs

 

File Name: CustomRenderer.cs

Brief Explanation of the above Code:

Here Added the ASSEMBLY attribute it means like declarations

  • CustomEntry is the name of the placeholder class in your common (PCL or Shared) Forms library.
  • ExportRenderer is the name of the actual platform specific implementation class in your iOS/Android/WP project.

Essentially, telling Forms, “when you need to render CustomEntry on Platform X, use the class CustomRenderer.”

  1. Create a subclass of the EntryRenderer class that renders the native control.
  2. Override the OnElementChangedmethod that renders the native control and write logic to customize the control. This method is called when the corresponding Xamarin Forms control is created.
  3. Added an ExportRendererattribute to the custom renderer class to specify that it will be used to render the Xamarin Forms control. This attribute is used to register the custom renderer with Xamarin Forms.

 

 

Step 4: Create UI for Border less Entry 

File Name: MainPage.xaml

Here for Example I have taken Login Form for better Understand

Here we have to declare the Local Refernce nameSpace in MainPage.xaml

 

 

Output: Run the program Ctrl+F5

 

4 thoughts to “Entry with Custom Border in Xamarin Forms”

  1. Thankyou so much,
    Its so helpful in my task

    Can u suggest me how can i follow you in facebook or instragam regarding xamarin forms

    Thankyou

Leave a Reply

Your email address will not be published. Required fields are marked *