Code Screens to Change the Entry Return Button in Xamarin Forms

01

A few posts back we have posted a blog about how to add an entry label button in the Xamarin.Forms project, proceeding the same topic in a different way today we are going to learn about  the process to change the entry return button in an Xamarin.Forms project.

Follow the mentioned steps and code:

  1. Create a new project, and filter it as per the need of your project type as Mobile.
  2. Now give an accurate name to your project and application and save it on an accurate location of your project library.
  3. Select an other blank app and choose your preferred mobile platform as Android iOS or Windows.
  4. Go to the project solution, here all the files and sources are placed in a separate folder form that select the XAML page file and open the MainPage.Xaml page. Finally you have the basic HTML app.

Now it’s time to move on with the blog’s topic and create a custom entry button in your Xamarin.Forms project.

  1. For this create a inhetit class for Entry form for customize the entry control. And write the below mentioned code in that file:
using System;
using Xamarin.Forms;
namespace XamarinCustomEntry.Controls
{
    public class CustomEntry:Entry
    {
public new event EventHandler Completed;
        public static readonly BindableProperty ReturnTypeProperty = BindableProperty.Create(
            nameof(ReturnType),
            typeof(ReturnType),
            typeof(CustomEntry),
            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
    }
}

As Xamarin is cross-platform app development technology, hence to develop an app functionality in this platform we need to implement the code in both mobile OS. Therefore,

Code to be implement in Xamarin.iOS

Write the below code in your project’s CustomeEntryRenderer.cs file:

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

Code to be implement in Xamarin.Android:

Using system
using System.Runtime.Remoting.Contexts;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;
using XamarinCustomEntry.Controls;
using XamarinCustomEntry.Droid;
using Android.Content;
using Android.Widget;
using Android.Views.InputMethods;
[assembly: ExportRenderer(typeof(CustomEntry), typeof(CustomEntryRenderer))]
namespace XamarinCustomEntry.Droid
{
    public class CustomEntryRenderer : EntryRenderer
    {
        public CustomEntryRenderer(Android.Content.Context context) : base(context)
        {
            AutoPackage = false;
        }
        protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
        {
            base.OnElementChanged(e);
            CustomEntry entry = (CustomEntry)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 != Controls.ReturnType.Next)
                            entry.Unfocus();
                        // Call all the methods attached to base_entry event handler Completed
                        entry.InvokeCompleted();
                    };
                }
            }
        }
        private void SetReturnType(CustomEntry entry)
        {
            Controls.ReturnType type = entry.ReturnType;
            switch (type)
            {
                case Controls.ReturnType.Go:
                    Control.ImeOptions = ImeAction.Go;
                    Control.SetImeActionLabel(“Go”, ImeAction.Go);
                    break;
                case Controls.ReturnType.Next:
                    Control.ImeOptions = ImeAction.Next;
                    Control.SetImeActionLabel(“Next”, ImeAction.Next);
                    break;
                case Controls.ReturnType.Send:
                    Control.ImeOptions = ImeAction.Send;
                    Control.SetImeActionLabel(“Send”, ImeAction.Send);
                    break;
                case Controls.ReturnType.Search:
                    Control.ImeOptions = ImeAction.Search;
                    Control.SetImeActionLabel(“Search”, ImeAction.Search);
                    break;
                default:
                    Control.ImeOptions = ImeAction.Done;
                    Control.SetImeActionLabel(“Done”, ImeAction.Done);
                    break;
            }
        }
    }
}

Now add this code in MainPage.xaml file:

<?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:XamarinCustomEntry”
             x:Class=”XamarinCustomEntry.MainPage”
             xmlns:controls=”clr-namespace:XamarinCustomEntry.Controls”>
    <StackLayout>
 
        <Image Margin=”0,100,0,0″ Source=”banner1.png”></Image>
        <controls:CustomEntry ReturnType=”Search” Placeholder=”Search”></controls:CustomEntry>
        <controls:CustomEntry ReturnType=”Done” Placeholder=”Done”></controls:CustomEntry>
    </StackLayout>
</ContentPage>

All done!! Now you are all set to run the code.

by admin

Leave a Reply

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

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>