Xamarin.Forms Curved Entry

Hello My Xamarin Friends,
This is my new post in which I am going to tell you how  to customize the Entry. 
Entry is a rectangular input frame control in which we can give any type of text input and in this post, we are going to discuss custom entry, this entry will make curved Corner entry.
Let's start........

First, we will  create a class whose name is "CustomEntry" and then we will write a code in "C #".

	public class CustomEntry : Entry
	{
	public static readonly BindableProperty BorderColorProperty =
	BindableProperty.Create(
	nameof(BorderColor),
	typeof(Color),
	typeof(CustomEntry),
	Color.Gray);
	// Gets or sets BorderColor value
	public Color BorderColor
	{
	get { return (Color)GetValue(BorderColorProperty); }
	set { SetValue(BorderColorProperty, value); }
	}
	public static readonly BindableProperty BorderWidthProperty =
	BindableProperty.Create(
	nameof(BorderWidth),
	typeof(int),
	typeof(CustomEntry),
	Device.OnPlatform<int>(1, 2, 2));
	// Gets or sets BorderWidth value
	public int BorderWidth
	{
	get { return (int)GetValue(BorderWidthProperty); }
	set { SetValue(BorderWidthProperty, value); }
	}
	public static readonly BindableProperty CornerRadiusProperty =
	BindableProperty.Create(
	nameof(CornerRadius),
	typeof(double),
	typeof(CustomEntry),
	Device.OnPlatform<double>(6, 7, 7));
	// Gets or sets CornerRadius value
	public double CornerRadius
	{
	get { return (double)GetValue(CornerRadiusProperty); }
	set { SetValue(CornerRadiusProperty, value); }
	}
	public static readonly BindableProperty IsCurvedCornersEnabledProperty =
	BindableProperty.Create(
	nameof(IsCurvedCornersEnabled),
	typeof(bool),
	typeof(CustomEntry),
	true);
	// Gets or sets IsCurvedCornersEnabled value
	public bool IsCurvedCornersEnabled
	{
	get { return (bool)GetValue(IsCurvedCornersEnabledProperty); }
	set { SetValue(IsCurvedCornersEnabledProperty, value); }
	}
	}

view raw CustomEntry.cs hosted with ❤ by GitHub

Now, we will write some code in android project to set the Border Color, Width, Radius and Background Color, IsCurvedCornersEnabled ....
Please make sure to dependency reference.....
[assembly: ExportRenderer(typeof(CustomLabel), typeof(CurvedLabelRenderer))]

	public class CustomEntryRenderer : EntryRenderer
	{
	protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
	{
	base.OnElementChanged(e);
	if (e.NewElement != null)
	{
	var view = (CustomEntry)Element;
	if (view.IsCurvedCornersEnabled)
	{
	// creating gradient drawable for the curved background
	var _gradientBackground = new GradientDrawable();
	_gradientBackground.SetShape(ShapeType.Rectangle);
	_gradientBackground.SetColor(view.BackgroundColor.ToAndroid());
	// Thickness of the stroke line
	_gradientBackground.SetStroke(view.BorderWidth, view.BorderColor.ToAndroid());
	// Radius for the curves
	_gradientBackground.SetCornerRadius(
	DpToPixels(this.Context,
	Convert.ToSingle(view.CornerRadius)));
	// set the background of the label
	Control.SetBackground(_gradientBackground);
	}
	// Set padding for the internal text from border
	Control.SetPadding(
	(int)DpToPixels(this.Context, Convert.ToSingle(12)),
	Control.PaddingTop,
	(int)DpToPixels(this.Context, Convert.ToSingle(12)),
	Control.PaddingBottom);
	}
	}
	public static float DpToPixels(Context context, float valueInDp)
	{
	DisplayMetrics metrics = context.Resources.DisplayMetrics;
	return TypedValue.ApplyDimension(ComplexUnitType.Dip, valueInDp, metrics);
	}
	}

view raw CustomEntryRenderer.cs hosted with ❤ by GitHub

Then we create an Ios Project Also

	public class CustomEntryRenderer : EntryRenderer
	{
	protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
	{
	base.OnElementChanged(e);
	if (e.NewElement != null)
	{
	var view = (CustomEntry)Element;
	Control.LeftView = new UIView(new CGRect(0f, 0f, 9f, 20f));
	Control.LeftViewMode = UITextFieldViewMode.Always;
	Control.KeyboardAppearance = UIKeyboardAppearance.Dark;
	Control.ReturnKeyType = UIReturnKeyType.Done;
	Control.Layer.CornerRadius = Convert.ToSingle(view.CornerRadius);
	Control.Layer.BorderColor = view.BorderColor.ToCGColor();
	Control.Layer.BorderWidth = view.BorderWidth;
	Control.ClipsToBounds = true;
	}
	}
	}

view raw CustomEntryRenderer.cs hosted with ❤ by GitHub

Please make sure to add view reference.....
xmlns:local="clr-namespace:CustomEntryApp"
then write xaml code in main page.

	<StackLayout Padding="10">
	<custom:CustomEntry
	CornerRadius="18"
	IsCurvedCornersEnabled="True"
	BorderColor="BlueViolet"
	HorizontalTextAlignment="Center"
	FontSize="17"
	HeightRequest="40"
	Placeholder="Custom Entry"
	PlaceholderColor="Gray"
	TextColor="Black"
	FontAttributes="Bold"
	WidthRequest="100"/>
	<Entry TextColor="Red"
	PlaceholderColor="#7AB0DE"
	Placeholder="Normal Entry" />
	</StackLayout>

view raw MainPage.xaml hosted with ❤ by GitHub

TADDAAAA!

 Now, you will  have your CustomEntry working!!

Public Property Entry controls

1. FontAttributes FontAttributes=(FontAttributes="Bold")
2. FontSize Double=(FontSize="Default")
3. IsPassword Boolean=(IsPassword="True")
4. Placeholder String=( Placeholder="Xamarin Buddy")
5. Text String (Text="Xamarin Buddy")
6. PlaceholderColor Color=( PlaceholderColor="Red")
7. TextColor Color=(TextColor="DarkBlue")
8. FontFamily String=(FontFamily="")
9. HorizontalTextAlignment TextAlignment=(HorizontalTextAlignment="Start")

 Features of CustomEntry controls

1. Custom Border Color Property=(CustomBorderColor="#24C4FF")
2. Custom Background Color Property=(CustomBackgroundColor="#24C4FF")
3. Custom Border Radius Property=(CustomBorderRadius="4")
4. Custom Border Width Property=(CustomBorderWidth="4")
5. Custom IsCurvedCornersEnabled =(IsCurvedCornersEnabled ="True")

To get full source code Click Here

To watch video Click Here