Incorporación de un reconocedor de gesto de pulsar
El gesto de pulsar se usa para la detección de pulsaciones y se implementa con la clase TapGestureRecognizer.
Para que se pueda hacer clic en un elemento de interfaz de usuario con el gesto de pulsar, cree una instancia de TapGestureRecognizer
, controle el evento Tapped
, y agregue el nuevo reconocedor de gestos a la colección GestureRecognizers
en el elemento de interfaz de usuario. En el siguiente ejemplo de código, se muestra un elemento TapGestureRecognizer
asociado a un elemento Image
:
var tapGestureRecognizer = new TapGestureRecognizer();
tapGestureRecognizer.Tapped += (s, e) => {
// handle the tap
};
image.GestureRecognizers.Add(tapGestureRecognizer);
De forma predeterminada, la imagen responderá a pulsaciones simples. Establezca la propiedad NumberOfTapsRequired
para que espere una pulsación doble (o más pulsaciones si es necesario).
tapGestureRecognizer.NumberOfTapsRequired = 2; // double-tap
Cuando se establece NumberOfTapsRequired
por encima de uno, el controlador de eventos solo se ejecuta si las pulsaciones se producen dentro de un período de tiempo concreto (que no se puede configurar). Si la segunda pulsación (o las posteriores) no se producen dentro de ese período, se omiten y se reinicia el "recuento de pulsaciones".
Uso de Xaml
Un reconocedor de gestos se puede agregar a un control en Xaml mediante propiedades adjuntas. La sintaxis para agregar un elemento TapGestureRecognizer
a una imagen se muestra a continuación (en este caso se define un evento de pulsación doble):
<Image Source="tapped.jpg">
<Image.GestureRecognizers>
<TapGestureRecognizer
Tapped="OnTapGestureRecognizerTapped"
NumberOfTapsRequired="2" />
</Image.GestureRecognizers>
</Image>
El código para el controlador de eventos (en el ejemplo) incrementa un contador y cambia la imagen de color a blanco y negro.
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";
}
}
Uso de ICommand
Las aplicaciones que usan el patrón Model-View-ViewModel (MVVM) suelen usar ICommand
en lugar de conectar controladores de eventos directamente. El elemento TapGestureRecognizer
puede admitir fácilmente ICommand
estableciendo el enlace en el código:
var tapGestureRecognizer = new TapGestureRecognizer();
tapGestureRecognizer.SetBinding (TapGestureRecognizer.CommandProperty, "TapCommand");
image.GestureRecognizers.Add(tapGestureRecognizer);
o con Xaml:
<Image Source="tapped.jpg">
<Image.GestureRecognizers>
<TapGestureRecognizer
Command="{Binding TapCommand}"
CommandParameter="Image1" />
</Image.GestureRecognizers>
</Image>
El código completo para este modelo de vista se puede encontrar en el ejemplo. A continuación se muestran los detalles de implementación de Command
relevantes:
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
}