Compartir a través de


Cómo: Crear un efecto de activación mediante eventos

En este ejemplo se muestra cómo cambiar el color de un elemento cuando el puntero del mouse entra y sale del área ocupada por el elemento.

Este ejemplo consta de un archivo Extensible Application Markup Language (XAML) y un archivo de código subyacente.

NotaNota

En este ejemplo se muestra cómo utilizar los eventos, pero la manera recomendada de lograr este mismo efecto es utilizar Trigger en un estilo.Para obtener más información, vea Aplicar estilos y plantillas.

Ejemplo

En el XAML siguiente se crea la interfaz de usuario, que está compuesta de un objeto Border alrededor de un objeto TextBlock, y se asocian los controladores de eventos MouseEnter y MouseLeave a Border.

<StackPanel>
  <Border MouseEnter="OnMouseEnterHandler"
          MouseLeave="OnMouseLeaveHandler"
          Name="border1" Margin="10"
          BorderThickness="1"
          BorderBrush="Black"
          VerticalAlignment="Center"
          Width="300" Height="100">
    <Label Margin="10" FontSize="14"
           HorizontalAlignment="Center">Move Cursor Over Me</Label>
  </Border>
</StackPanel>

En el siguiente código subyacente se crean los controladores de eventos MouseEnter y MouseLeave. Cuando el puntero del mouse entra en el objeto Border, el fondo de Border se cambia al color rojo. Cuando el puntero del mouse sale del objeto Border, el fondo de Border se vuelve a establecer en el color blanco.

Partial Public Class Window1
    Inherits Window

    Public Sub New()
        InitializeComponent()
    End Sub
    ' raised when mouse cursor enters the are occupied by the element
    Private Sub OnMouseEnterHandler(ByVal sender As Object, ByVal e As MouseEventArgs)
        border1.Background = Brushes.Red
    End Sub
    ' raised when mouse cursor leaves the are occupied by the element
    Private Sub OnMouseLeaveHandler(ByVal sender As Object, ByVal e As MouseEventArgs)
        border1.Background = Brushes.White
    End Sub
End Class
public partial class Window1 : Window
{
    public Window1()
    {
        InitializeComponent();
    }

    // raised when mouse cursor enters the area occupied by the element
    void OnMouseEnterHandler(object sender, MouseEventArgs e)
    {
        border1.Background = Brushes.Red;
    }

    // raised when mouse cursor leaves the area occupied by the element
    void OnMouseLeaveHandler(object sender, MouseEventArgs e)
    {
        border1.Background = Brushes.White;
    }
}