Partilhar via


Como: Criar um efeito de sobreposição usando eventos

Este exemplo mostra como alterar a cor de um elemento quando o ponteiro do mouse entra e sai da área ocupada pelo elemento.

Esse exemplo consiste em um arquivo Extensible Application Markup Language (XAML) e um arquivo code-behind. Para os exemplos completos, veja Exemplo de ponteiro do mouse.

ObservaçãoObservação:

Este exemplo demonstra como usar eventos, mas a maneira recomendada para obter esse efeito mesmo é usar um Trigger em um estilo. Para obter mais informações, consulte Styling and Templating.

Exemplo

O seguinte XAML cria a interface do usuário, que consiste de uma Border ao redor de um TextBlock e anexa os manipuladores de eventos MouseEnter e MouseLeave à 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>

O código a seguir cria os manipuladores de eventos MouseEnter e MouseLeave. Quando o ponteiro do mouse entra na área da Border, o plano de fundo da Border é alterado para vermelho. Quando o ponteiro do mouse deixa a área da Border, o plano de fundo da Border é alterado de volta para branco.

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;
    }
}