Практическое руководство. Создание эффекта выделения с помощью событий

В этом примере показано, как изменение цвета элемента, как указатель мыши и покидает область, занимаемая элементом.

В этом примере состоит из XAML файл и файл с выделенным кодом.

Note

В этом примере показано, как использовать события, но для достижения такого же эффекта рекомендуется использовать Trigger в стиле. Более подробную информацию см. в разделе Стилизация и использование шаблонов.

Пример

Следующие XAML создает пользовательский интерфейс, который состоит из Border вокруг TextBlockи присоединяет MouseEnter и 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>

Следующий код создает MouseEnter и MouseLeave обработчики событий. Когда указатель мыши попадает Border, фон Border изменяется на красный. Когда указатель мыши покидает Border, фон Border изменяется обратно на белое.

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