• Facile

Ce cours est visible gratuitement en ligne.

Vous pouvez être accompagné et mentoré par un professeur particulier par visioconférence sur ce cours.

J'ai tout compris !

Mis à jour le 29/04/2014

Le clavier virtuel

Connectez-vous ou inscrivez-vous gratuitement pour bénéficier de toutes les fonctionnalités de ce cours !

Le clavier virtuel est ce petit clavier qui apparaît lorsque l’on clique dans une zone de texte modifiable, que nous avons pu voir dans notre Hello World.
En anglais il se nomme le SIP, pour Soft Input Panel, que l’on traduit par clavier virtuel.
Nous allons voir comment nous en servir.

Afficher le clavier virtuel

Vous vous rappelez de notre Hello World ? Lorsque nous avons cliqué dans le TextBox, nous avons vu apparaître ce fameux clavier virtuel (voir la figure suivante).

Affichage du clavier virtuel
Affichage du clavier virtuel

Il n’y a qu’une seule solution pour afficher le clavier virtuel. Il faut que l’utilisateur clique dans une zone de texte modifiable. Et à ce moment-là, le clavier virtuel apparaît en bas de l’écran. Techniquement, il s’affiche quand le contrôle TextBox prend le focus (lorsque l’on clique dans le contrôle) et il disparaît lorsque celui-ci perd le focus (lorsqu’on clique en dehors du contrôle).
Il n’est pas possible de déclencher son affichage par programmation, ni son masquage, à part en manipulant le focus.
Pour afficher un TextBox, on utilisera le XAML suivant :

<TextBox x:Name="MonTextBox" />

Intercepter les touches du clavier virtuel

Comme déjà dit, il n’est pas possible de manipuler le clavier. Par contre, on peut savoir quand une touche est appuyée en utilisant l’événement KeyDown ou KeyUp du TextBox. Il s’agit d’événements qui sont levés lorsqu’on appuie sur une touche ou lorsqu’on relâche la touche.
Prenons par exemple le code suivant :

<StackPanel>
    <TextBox x:Name="MonTextBox" KeyDown="MonTextBox_KeyDown" KeyUp="MonTextBox_KeyUp"  />
    <TextBlock x:Name="Statut" />
</StackPanel>

Et le code behind :

private void MonTextBox_KeyDown(object sender, KeyEventArgs e)
{
    Statut.Text = "Touche appuyée : " + e.Key;
}

private void MonTextBox_KeyUp(object sender, KeyEventArgs e)
{
    Statut.Text = "Touche relachée : " + e.Key;
}

Nous aurons la figure suivante.

Affichage de la touche relachée dans l'émulateur
Affichage de la touche relachée dans l'émulateur

Les différents types de clavier

Le clavier que nous avons vu est le clavier par défaut. Nous avons à notre disposition d’autres types de clavier, par exemple un clavier numérique permettant de saisir des numéros de téléphone (voir la figure suivante).

Clavier virtuel de type numérique
Clavier virtuel de type numérique

Pour choisir le type de clavier à afficher, nous allons utiliser la propriété InputScope du contrôle TextBox. Par exemple, pour afficher le clavier numérique, je vais utiliser :

<TextBox x:Name="MonTextBox" InputScope="Number" />

La liste des différents claviers supportés est disponible ici.

Cela permet d'avoir un clavier plus adapté, si l’on doit par exemple permettre de saisir un @ pour un email, ou des caractères spéciaux, etc.
Sur la figure suivante, vous pouvez voir un clavier optimisé pour la saisie d’un email (type EmailUserName), avec un arrobas (@) et un « .fr ».

Clavier virtuel optimisé pour la saisie d'adresse email
Clavier virtuel optimisé pour la saisie d'adresse email
  • Le clavier virtuel s’affiche lorsque l’on clique dans une zone de texte modifiable.

  • Il existe plusieurs types de clavier à notre disposition que nous pouvons choisir grâce à la propriété InputScope.

Exemple de certificat de réussite
Exemple de certificat de réussite