Xamarin Forms ReturnType Key

Introduction:-

Hello Everybody Today I am going to tell about Entry Key ReturnType and How to change ReturnType keys like Search, Done and etc.
So In this article, I am using Xamarin Forms “PORTABLE" and XAML. this Handles Keyboard return a key description.

We generally found different caption on return type key while we are using keyboard in the mobile App. So, here I mentioned the way to achieve the different behaviors of return type keys in Xamarin Forms.

To customize return type key in android and ios we have to set following properties.

In iOS: UITextField has a ReturnKeyType property that you can set to a preassigned list.

In Android: EntryEditText have an ImeOptions property this property help to changing the EditText Key for Keyboard button.

Implementation:-

We are creating a class CustomKeyEntry.cs in PCL Project and writing the following C# code.
CustomKeyEntry.cs 

	public class CustomKeyEntry : Entry
	{
	public new event EventHandler Completed;
	public static readonly BindableProperty ReturnTypeProperty = BindableProperty.Create(nameof(ReturnType),
	typeof(ReturnType), typeof(CustomKeyEntry),
	ReturnType.Done, BindingMode.OneWay);
	public ReturnType ReturnType
	{
	get { return (ReturnType)GetValue(ReturnTypeProperty); }
	set { SetValue(ReturnTypeProperty, value); }
	}
	public void InvokeCompleted()
	{
	if (this.Completed != null)
	this.Completed.Invoke(this, null);
	}
	}
	public enum ReturnType
	{
	Go,
	Next,
	Done,
	Send,
	Search
	}
	}

view raw CustomKeyEntry.cs hosted with ❤ by GitHub

This property is set in the Android project as well as in iOS project.

Let us start with Android. We are creating a Class in Android Project and rendering the entry. 

Then, we set all the properties when initializing the PCL Project. 

Please make sure of the dependency ([assembly: ExportRenderer(typeof(CustomKeyEntry), typeof(CustomKeyEntryRenderer))]) of Android(CustomEntryRndered) and PCL(CustomEntry)…

CustomKeyEntryRenderer.cs

	using System;
	using System.Collections.Generic;
	using System.Linq;
	using System.Text;
	using Android.App;
	using Android.Content;
	using Android.OS;
	using Android.Runtime;
	using Android.Views;
	using Android.Widget;
	using Xamarin.Forms;
	using App1.CustomViews.KeysEntry;
	using App1.Droid.CustomeRendererControls;
	using Xamarin.Forms.Platform.Android;
	using App1.CustomViews;
	using Android.Views.InputMethods;
	[assembly: ExportRenderer(typeof(CustomKeyEntry), typeof(CustomKeyEntryRenderer))]
	namespace App1.Droid.CustomeRendererControls
	{
	public class CustomKeyEntryRenderer : EntryRenderer
	{
	protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
	{
	base.OnElementChanged(e);
	CustomKeyEntry entry = (CustomKeyEntry)this.Element;
	if (this.Control != null)
	{
	if (entry != null)
	{
	SetReturnType(entry);
	// Editor Action is called when the return button is pressed
	Control.EditorAction += (object sender, TextView.EditorActionEventArgs args) =>
	{
	if (entry.ReturnType != ReturnType.Next)
	entry.Unfocus();
	// Call all the methods attached to custom_entry event handler Completed
	entry.InvokeCompleted();
	};
	}
	}
	}
	private void SetReturnType(CustomKeyEntry entry)
	{
	ReturnType type = entry.ReturnType;
	switch (type)
	{
	case ReturnType.Go:
	Control.ImeOptions = Android.Views.InputMethods.ImeAction.Go;
	Control.SetImeActionLabel("Go", ImeAction.Go);
	break;
	case ReturnType.Next:
	Control.ImeOptions = ImeAction.Next;
	Control.SetImeActionLabel("Next", ImeAction.Next);
	break;
	case ReturnType.Send:
	Control.ImeOptions = ImeAction.Send;
	Control.SetImeActionLabel("Send", ImeAction.Send);
	break;
	case ReturnType.Search:
	Control.ImeOptions = ImeAction.Search;
	Control.SetImeActionLabel("Search", ImeAction.Search);
	break;
	default:
	Control.ImeOptions = ImeAction.Done;
	Control.SetImeActionLabel("Done", ImeAction.Done);
	break;
	}
	}
	}
	}

view raw CustomKeyEntryRenderer.cs hosted with ❤ by GitHub

Now, it's time to go with iOS project.And we  set the PCL(CustomEntry) property in IOS Project….

 We are creating a Class , so we are  right click on iOS Project and select Apple. Then, select "Class" and give this class a name as CustomEntryRendered.cs.

[assembly: ExportRenderer(typeof(CustomKeyEntry), typeof(CustomKeyEntryRenderer))]

Now, let us write some code for Entry and Set Property.

CustomKeyEntryRenderer.cs

	using System;
	using System.Collections.Generic;
	using System.Linq;
	using System.Text;
	using Foundation;
	using UIKit;
	using Xamarin.Forms;
	using App1.CustomViews.KeysEntry;
	using App1.iOS.CustomeRendererControls;
	using Xamarin.Forms.Platform.iOS;
	using App1.CustomViews;
	[assembly: ExportRenderer(typeof(CustomKeyEntry), typeof(CustomKeyEntryRenderer))]
	namespace App1.iOS.CustomeRendererControls
	{
	public class CustomKeyEntryRenderer : EntryRenderer
	{
	protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
	{
	base.OnElementChanged(e);
	CustomKeyEntry entry = (CustomKeyEntry)this.Element;
	if (this.Control != null)
	{
	if (entry != null)
	{
	SetReturnType(entry);
	Control.ShouldReturn += (UITextField tf) =>
	{
	entry.InvokeCompleted();
	return true;
	};
	}
	}
	}
	private void SetReturnType(CustomKeyEntry entry)
	{
	ReturnType type = entry.ReturnType;
	switch (type)
	{
	case ReturnType.Go:
	Control.ReturnKeyType = UIReturnKeyType.Go;
	break;
	case ReturnType.Next:
	Control.ReturnKeyType = UIReturnKeyType.Next;
	break;
	case ReturnType.Send:
	Control.ReturnKeyType = UIReturnKeyType.Send;
	break;
	case ReturnType.Search:
	Control.ReturnKeyType = UIReturnKeyType.Search;
	break;
	case ReturnType.Done:
	Control.ReturnKeyType = UIReturnKeyType.Done;
	break;
	default:
	Control.ReturnKeyType = UIReturnKeyType.Default;
	break;
	}
	}
	}
	}

view raw CustomKeyEntryRenderer.cs hosted with ❤ by GitHub

Now, go to the PCL Project and write this code in MainPage.xaml.

As you can see in the above code, we have to set the view reference in xmlns:custom="clr-namespace:CurvedEntry" MainPage.xaml.

Write the following code for CustomEntry.

MainPage.xaml

	<?xml version="1.0" encoding="utf-8" ?>
	<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
	xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
	xmlns:local="clr-namespace:App1"
	x:Class="App1.MainPage"
	xmlns:key="clr-namespace:App1.CustomViews.KeysEntry">
	<StackLayout Spacing="20" Padding="20">
	<key:CustomKeyEntry Placeholder="Done Key" ReturnType="Done" />
	<key:CustomKeyEntry Placeholder="Go Key" ReturnType="Go" />
	<key:CustomKeyEntry Placeholder="Next Key" ReturnType="Next" />
	<key:CustomKeyEntry Placeholder="Search Key" ReturnType="Search" />
	<key:CustomKeyEntry Placeholder="Send Key" ReturnType="Send" />
	</StackLayout>
	</ContentPage>

view raw MainPage.xaml hosted with ❤ by GitHub

TADDAAAA!!
Now, you will have your Custom Entry working!!

if you want to watch this video click Here

Features of CustomReturnType controls

Custom ReturnType Property=(ReturnType="Search")