Ajouter un module de reconnaissance de mouvement d’appui
Le geste d’appui est utilisé pour la détection des appuis, il est implémentée avec la classe TapGestureRecognizer.
Pour qu’un élément d’interface utilisateur réagisse à un appui, créez une instance TapGestureRecognizer
, traitez l’événement Tapped
et ajoutez le nouveau module de reconnaissance de geste à la collection GestureRecognizers
sur l’élément d’interface utilisateur. L'exemple de code suivant montre un TapGestureRecognizer
attaché à un élément Image
:
var tapGestureRecognizer = new TapGestureRecognizer();
tapGestureRecognizer.Tapped += (s, e) => {
// handle the tap
};
image.GestureRecognizers.Add(tapGestureRecognizer);
Par défaut, l’image répond aux appuis uniques. Définissez la propriété NumberOfTapsRequired
pour attendre un double-appui (ou plusieurs appuis si nécessaire).
tapGestureRecognizer.NumberOfTapsRequired = 2; // double-tap
Quand NumberOfTapsRequired
a une valeur supérieure à 1, le gestionnaire d’événements est exécuté uniquement si les appuis se produisent dans un intervalle de temps donné (cette période n’est pas configurable). Si les appuis suivants (le deuxième ou les autres) ne se produisent pas dans cette période, ils sont effectivement ignorés et le « nombre d’appuis » redémarre.
Utilisation de Xaml
Vous pouvez ajouter un module de reconnaissance de geste à un contrôle en Xaml à l’aide des propriétés jointes. La syntaxe pour ajouter un TapGestureRecognizer
à une image est indiquée ci-dessous (dans ce cas, en définissant un événement double appui) :
<Image Source="tapped.jpg">
<Image.GestureRecognizers>
<TapGestureRecognizer
Tapped="OnTapGestureRecognizerTapped"
NumberOfTapsRequired="2" />
</Image.GestureRecognizers>
</Image>
Le code du gestionnaire d’événements (dans l’exemple) incrémente un compteur et modifie l’image de couleur en noir et blanc.
void OnTapGestureRecognizerTapped(object sender, EventArgs args)
{
tapCount++;
var imageSender = (Image)sender;
// watch the monkey go from color to black&white!
if (tapCount % 2 == 0) {
imageSender.Source = "tapped.jpg";
} else {
imageSender.Source = "tapped_bw.jpg";
}
}
Utilisation de ICommand
Les applications qui utilisent modèle-vue-vue modèle (MVVM) se servent généralement d’ICommand
plutôt que des gestionnaires d’événements. TapGestureRecognizer
peut facilement prendre en charge ICommand
en définissant la liaison dans le code :
var tapGestureRecognizer = new TapGestureRecognizer();
tapGestureRecognizer.SetBinding (TapGestureRecognizer.CommandProperty, "TapCommand");
image.GestureRecognizers.Add(tapGestureRecognizer);
ou en utilisant Xaml :
<Image Source="tapped.jpg">
<Image.GestureRecognizers>
<TapGestureRecognizer
Command="{Binding TapCommand}"
CommandParameter="Image1" />
</Image.GestureRecognizers>
</Image>
Le code complet pour ce modèle de vue se trouve dans l’exemple. Les informations pertinentes sur l’implémentation de Command
sont présentées ci-dessous :
public class TapViewModel : INotifyPropertyChanged
{
int taps = 0;
ICommand tapCommand;
public TapViewModel () {
// configure the TapCommand with a method
tapCommand = new Command (OnTapped);
}
public ICommand TapCommand {
get { return tapCommand; }
}
void OnTapped (object s) {
taps++;
Debug.WriteLine ("parameter: " + s);
}
//region INotifyPropertyChanged code omitted
}