WPF ContextMenu (kontextové menu)

Kontextové menu, také často označováno jako pop-up (vyskakovací) menu, je menu, které se zobrazí po určité aktivitě uživatele. Obvykle po kliknutí pravým tlačítkem myši na specifickou položku nebo okno. Kontextová menu jsou často používána k nabídce funkcí, které jsou relevantní s jednoduchým ovládáním.

WPF obsahuje ovládací prvek ContextMenu a protože je téměř vždy vázán na konkrétní ovládací prvek, obvykle jej také takto přidáváte do rozhraní. To se provádí prostřednictvím vlastnosti ContextMenu, kterou všechny ovládací prvky nabízejí (pochází z FrameworkElement, ze kterého většina ovládacích prvků WPF dědí). Zvažte následující příklad, abyste viděli, jak se to dělá:

<Window x:Class="WpfTutorialSamples.Common_interface_controls.ContextMenuSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="ContextMenuSample" Height="250" Width="250">
    <Grid>
        <Button Content="Right-click me!" VerticalAlignment="Center" HorizontalAlignment="Center">
            <Button.ContextMenu>
                <ContextMenu>
                    <MenuItem Header="Menu item 1" />
                    <MenuItem Header="Menu item 2" />
                    <Separator />
                    <MenuItem Header="Menu item 3" />
                </ContextMenu>
            </Button.ContextMenu>
        </Button>
    </Grid>
</Window>

Jestliže jste už četli kapitolu o obyčejném menu, brzy si uvědomíte, že kontextové menu funguje na stejném principu a ještě aby ne, když obě zdědili MenuBase třídu. Tak, jako jsme viděli u příkladů při používání obyčejného menu, můžete samozřejmě přidat Click events (události) k těmto věcem, které se ukážou, když na ně uživatel klikne, ale jako více příjemná cesta s WPS se považuje použití Commands (příkazů).

ContextMenu s příkazy a ikonami

V následujícím příkladu vám ukážu dva klíčové koncepty při používání ContextMenu: Použití příkazů WPF (WPF Commands), které nám poskytnou mnoho funkcionalit včetně obsluhy události Click, textu a textu zkratky, jednoduše přiřazením něčeho k vlastnosti Command. Také vám ukážu, jak používat ikony u položek vašeho ContextMenu. Podívejte se:

<Window x:Class="WpfTutorialSamples.Common_interface_controls.ContextMenuWithCommandsSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="ContextMenuWithCommandsSample" Height="200" Width="250">
    <StackPanel Margin="10">
        <TextBox Text="Right-click here for context menu!">
            <TextBox.ContextMenu>
                <ContextMenu>
                    <MenuItem Command="Cut">
                        <MenuItem.Icon>
                            <Image Source="/WpfTutorialSamples;component/Images/cut.png" />
                        </MenuItem.Icon>
                    </MenuItem>
                    <MenuItem Command="Copy">
                        <MenuItem.Icon>
                            <Image Source="/WpfTutorialSamples;component/Images/copy.png" />
                        </MenuItem.Icon>
                    </MenuItem>
                    <MenuItem Command="Paste">
                        <MenuItem.Icon>
                            <Image Source="/WpfTutorialSamples;component/Images/paste.png" />
                        </MenuItem.Icon>
                    </MenuItem>
                </ContextMenu>
            </TextBox.ContextMenu>
        </TextBox>
    </StackPanel>
</Window>

Zkuste spustit příklad a uvidíte sami, kolik funkcionalit získáme zdarma přiřazením příkazů k položkám. Také si všimněte, jak je poměrně jednoduché používat ikony u položek menu ContextMenu.

Vyvolání ContextMenu z Code-behind

Doposud bylo ContextMenu vyvoláno pravým kliknutím na ovládací prvek, ke kterému patří. WPF to pro nás dělá automaticky, když jej přiřadíme k vlastnosti ContextMenu. Nicméně, v některých situacích můžete chtít ContextMenu vyvolat ručně z kódu. To je také poměrně jednoduché, takže použijme první příklad k jeho demonstraci:

<Window x:Class="WpfTutorialSamples.Common_interface_controls.ContextMenuManuallyInvokedSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="ContextMenuManuallyInvokedSample" Height="250" Width="250">
    <Window.Resources>
        <ContextMenu x:Key="cmButton">
            <MenuItem Header="Menu item 1" />
            <MenuItem Header="Menu item 2" />
            <Separator />
            <MenuItem Header="Menu item 3" />
        </ContextMenu>
    </Window.Resources>
    <Grid>
        <Button Content="Click me!" VerticalAlignment="Center" HorizontalAlignment="Center" Click="Button_Click" />
    </Grid>
</Window>

using System;
using System.Windows;
using System.Windows.Controls;

namespace WpfTutorialSamples.Common_interface_controls
{
	public partial class ContextMenuManuallyInvokedSample : Window
	{
		public ContextMenuManuallyInvokedSample()
		{
			InitializeComponent();
		}

		private void Button_Click(object sender, RoutedEventArgs e)
		{
			ContextMenu cm = this.FindResource("cmButton") as ContextMenu;
			cm.PlacementTarget = sender as Button;
			cm.IsOpen = true;
		}
	}
}

První věc, které byste si měli všimnout, je, že jsem ContextMenu přesunul pryč od tlačítka. Místo toho jsem jej přidal jako zdroj okna, aby byl dostupný odkudkoliv uvnitř okna. To také značně usnadňuje jeho nalezení, když ho potřebujeme zobrazit.

Tlačítko má nyní obslužnou rutinu události Click, kterou ošetřuji v Code-behind. Odtud jednoduše najdu instanci ContextMenu mezi prostředky okna a pak udělám dvě věci: Nastavím její vlastnost PlacementTarget, která říká WPF, na základě kterého prvku by mělo počítat pozici, a poté nastavím IsOpen na true, aby se menu otevřelo. To je vše, co potřebujete!