Eigene Tasten in der iOS-Tastatur mit Xamarin

Manchmal kommt es durchaus vor, dass man eigene Tasten auf der Tastatur für die Nutzung in einer App haben möchte. In Xamarin.iOS ist die Einbindung von benutzerdefinierten Tasten sehr einfach und problemlos mit nur wenigen Zeilen Code möglich.  Ein häufiges Problem unter iOS ist die fehlende „Done“-Taste zum Schließen der Tastatur. Während Android die Tastatur durch Klicken außerhalb der Tastatur schließt, macht iOS dies nicht. Zum Glück bietet UIKit eine einfache Implementierung für eigene Tasten. Darunter befindet sich auch die „Done“-Taste. Die hierbei zur Verfügung gestellte API nutzt ein zusätzliches UIView Element über der eigentlichen Tastatur. Um diese zusätzliche Leiste zu nutzen, muss lediglich die „InputAccessoryView“-Eigenschaft des entsprechenden UITextView oder UITextField Elements gesetzt werden. 

Und so könnte eine Tastatur mit einigen Smilies und der „Done“-Taste aussehen:

Und hier der Code, der diese „Smilie-Tastatur“ erzeugt:

public override void ViewDidLoad ()
{
    base.ViewDidLoad (); 
	
    UIToolbar toolbar = new UIToolbar (new RectangleF(0.0f, 0.0f, this.View.Frame.Size.Width, 44.0f)); 
    toolbar.TintColor = UIColor.White;
    toolbar.BarStyle = UIBarStyle.Black; 
    toolbar.Translucent = true;  
	
    toolbar.Items = new UIBarButtonItem[]
		{
			new UIBarButtonItem(":-)", UIBarButtonItemStyle.Plain, AddBarButtonText),
			new UIBarButtonItem(":-)", UIBarButtonItemStyle.Plain, AddBarButtonText),
			new UIBarButtonItem(":-(", UIBarButtonItemStyle.Plain, AddBarButtonText),
			new UIBarButtonItem(";-)", UIBarButtonItemStyle.Plain, AddBarButtonText),
			new UIBarButtonItem(":-P", UIBarButtonItemStyle.Plain, AddBarButtonText),
			
			new UIBarButtonItem(UIBarButtonSystemItem.FlexibleSpace),
			new UIBarButtonItem(UIBarButtonSystemItem.Done, delegate 
				{
					MyTextFieldElement.ResignFirstResponder(); //this will close the keyboard
				})
		 };
 
    MyTextFieldElement.KeyboardAppearance = UIKeyboardAppearance.Dark;
    MyTextFieldElement.InputAccessoryView = toolbar;
}
 
public void AddBarButtonText(object sender, EventArgs e)
{
    var barButtonItem = sender as UIBarButtonItem;
    if (barButtonItem != null)
        MyTextFieldElement.Text += barButtonItem.Title; 
}

Im Code wird ein UIToolBar Element mit einigen UIBarButtonItems erstellt. Die ersten Elemente beinhalten diverse Smilies. Diese werden gefolgt von einem dynamischen Leerraum und der „Done“-Taste.

Tastentöne

Es ist ebenfalls möglich, die typischen iOS-Tastentöne abzuspielen. Hierzu wird ein ähnliches Vorgehen gewählt, wie es in der Objective-C Dokumentation von Apple zu sehen ist. Aber sehen wir uns doch die Lösung für C# an.

Zunächst erstellen wir eine „CustomUIToolbar“ Klasse, welche von der UIToolbar Klasse ableitet. Hier müssen wir noch die Eigenschaft „EnableInputClicksWhenVisible“ überschreiben und dort ein true zurückgeben. Nun müssen noch unsere CustomUIToolbar Klasse im Code oben benutzen und die Methode „AddBarButtonText“ um folgendes erweitern:

public void AddBarButtonText(object sender, EventArgs e)
{
    var barButtonItem = sender as UIBarButtonItem;
    if (barButtonItem != null)
	{
        MyTextFieldElement.Text += barButtonItem.Title; 
		UIDevice.CurrentDevice.PlayInputClick();
	}
}

Die komplette Tastatur ersetzen (Custom Keyboard)

Hin und wieder kommt es durchaus vor, dass auch das gesamte Keyboard ersetzt werden soll, anstatt nur das bestehende zu erweitern. Hierzu verwendet man im Code oben nur die Eigenschaft „InputView“ anstatt der Eigenschaft „InputAccessoryView“. Dies würde anschließend wie folgt aussehen: