Елемент керування меню WPF

Однією з найпоширеніших частин програми Windows є меню, яке іноді називають головним меню, оскільки в програмі зазвичай існує лише одне програмі зазвичай існує лише одне. Меню є практичним, оскільки воно пропонує багато варіантів, займаючи дуже мало місця, і хоча Microsoft просуває стрічку як заміну старому доброму меню, панелі інструментів, безумовно, мають своє місце в інструментарії кожного хорошого розробника.

WPF постачається зі зручним елементом керування для створення меню під назвою... Menu. Додавати до нього елементи дуже просто — ви просто додаєте до нього елементи MenuItem, і кожен MenuItem може мати дочірні MenuItem, що дозволяє створювати ієрархічні меню, які ви знаєте з багатьох додатків Windows. Давайте одразу перейдемо до прикладу, де ми використовуємо Menu:

<Window x:Class="WpfTutorialSamples.Common_interface_controls.MenuSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MenuSample" Height="200" Width="200">
    <DockPanel>
        <Menu DockPanel.Dock="Top">
            <MenuItem Header="_File">
                <MenuItem Header="_New" />
                <MenuItem Header="_Open" />
                <MenuItem Header="_Save" />
                <Separator />
                <MenuItem Header="_Exit" />
            </MenuItem>
        </Menu>
        <TextBox AcceptsReturn="True" />
    </DockPanel>
</Window>

Як і в більшості додатків Windows, моє меню розміщено у верхній частині вікна, але, зважаючи на величезну гнучкість WPF, ви фактично можете розмістити елемент керування «Меню» де завгодно, будь-якої ширини чи висоти.

Я визначив один елемент верхнього рівня з 4 дочірніми елементами та роздільником. Я використовую властивість Header для визначення заголовка елемента, і зверніть увагу на символ підкреслення перед першим символом кожного заголовка. Це вказує WPF використовувати цей символ як клавішу прискорення, що означає, що користувач може натиснути клавішу Alt з наступним символом, щоб активувати пункт меню. Це працює на всьому шляху від пункту верхнього рівня і вниз по ієрархії ієрархії, тож у цьому прикладі я можу натиснути Alt, потім F , а потім N, щоб активувати пункт меню New.

Іконки та прапорці

Дві загальні характеристики пункту меню - це піктограма, яка використовується для того, щоб легше ідентифікувати пункт меню і те, що він робить, і можливість мати пункти меню з прапорцями, які можуть увімкнути або вимкнути певну функцію. Елемент меню WPF MenuItem підтримує обидві функції, і він дуже простий у використанні:

<Window x:Class="WpfTutorialSamples.Common_interface_controls.MenuIconCheckableSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MenuIconCheckableSample" Height="150" Width="300">
    <DockPanel>
        <Menu DockPanel.Dock="Top">
            <MenuItem Header="_File">
                <MenuItem Header="_Exit" />
            </MenuItem>
            <MenuItem Header="_Tools">
                <MenuItem Header="_Manage users">
                    <MenuItem.Icon>
                        <Image Source="/WpfTutorialSamples;component/Images/user.png" />
                    </MenuItem.Icon>
                </MenuItem>
                <MenuItem Header="_Show groups" IsCheckable="True" IsChecked="True" />
            </MenuItem>
        </Menu>
        <TextBox AcceptsReturn="True" />
    </DockPanel>
</Window>

Для цього прикладу я створив вторинний елемент верхнього рівня, до якого додав два елементи: Один з піктограмою, визначеною за допомогою властивості Icon зі стандартним елементом управління Image всередині нього, і один, де ми використовуємо властивість IsCheckable , щоб дозволити користувачеві встановлювати і знімати прапорець з елемента. Я навіть використав властивість IsChecked, щоб за замовчуванням вона була позначена. З коду, це та сама властивість, яку ви можете прочитати, щоб дізнатися, чи позначений даний пункт меню, чи ні.

Обробка кліків

Коли користувач натискає на елемент меню, зазвичай потрібно, щоб щось сталося. Найпростіший спосіб — просто додати обробник події click до елемента меню, наступним чином:

<MenuItem Header="_New" Click="mnuNew_Click" />

У коді на основі коду вам потім потрібно буде реалізувати метод mnuNew_Click, наступним чином:

private void mnuNew_Click(object sender, RoutedEventArgs e)
{
	MessageBox.Show("New");
}

Цього буде достатньо для простіших застосунків або під час створення прототипів, але WPF використовує для цього команду.

Сполучення клавіш та команди

Ви можете легко обробити подію Click елемента меню, як ми зробили вище, але більш поширеним підходом є використання команд WPF. Існує багато теорії щодо використання та створення команд, тому для них є окрема категорія статей тут, на сайті, але поки що я можу сказати вам, що вони мають кілька переваг при використанні в WPF, особливо в поєднанні з меню або панеллю інструментів.

Перш за все, вони гарантують, що ви можете мати однакову дію на панелі інструментів, у меню та навіть у контекстному меню, без необхідності реалізовувати той самий код у кількох місцях. Вони також значно спрощують роботу зі сполученнями клавіш, оскільки, на відміну від WinForms, WPF не прослуховує сполучення клавіш автоматично, якщо ви призначаєте їх, наприклад, елементу меню – вам доведеться робити це вручну.

Однак, під час використання команд, WPF повністю ігнорує всі команди та автоматично реагує на комбінації клавіш. Текст (заголовок) елемента меню також встановлюється автоматично (хоча ви можете перезаписати його за потреби), як і InputGestureText, який показує користувачеві, яку комбінацію клавіш можна використовувати для виклику конкретного елемента меню. Перейдемо одразу до прикладу поєднання Menu з командами WPF:

<Window x:Class="WpfTutorialSamples.Common_interface_controls.MenuWithCommandsSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MenuWithCommandsSample" Height="200" Width="300">
    <Window.CommandBindings>
        <CommandBinding Command="New" CanExecute="NewCommand_CanExecute" Executed="NewCommand_Executed" />
    </Window.CommandBindings>
    <DockPanel>
        <Menu DockPanel.Dock="Top">
            <MenuItem Header="_File">
                <MenuItem Command="New" />
                <Separator />
                <MenuItem Header="_Exit" />
            </MenuItem>
            <MenuItem Header="_Edit">
                <MenuItem Command="Cut" />
                <MenuItem Command="Copy" />
                <MenuItem Command="Paste" />
            </MenuItem>
        </Menu>

        <TextBox AcceptsReturn="True" Name="txtEditor" />
    </DockPanel>
</Window>

using System;
using System.Windows;
using System.Windows.Input;

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

		private void NewCommand_CanExecute(object sender, CanExecuteRoutedEventArgs e)
		{
			e.CanExecute = true;
		}

		private void NewCommand_Executed(object sender, ExecutedRoutedEventArgs e)
		{
			txtEditor.Text = "";
		}
	}
}

Можливо, це не зовсім очевидно, але завдяки використанню команд ми отримали цілу низку функцій: комбінації клавіш, текст і InputGestureText на елементах, а WPF автоматично вмикає/вимикає елементи залежно від активного елемента керування та його стану. У цьому випадку функції Cut та Copy вимкнені, оскільки текст не виділено, але функція Paste увімкнена, оскільки мій буфер обміну не порожній!

А оскільки WPF знає, як обробляти певні команди в поєднанні з певними елементами керування, у цьому випадку команди Вирізати/Копіювати/Вставити в поєднанні з елементом керування введенням тексту, нам навіть не потрібно обробляти їхні події Виконання — вони працюють одразу після встановлення! Однак нам потрібно обробляти це для команди New, оскільки WPF не має можливості здогадатися, що ми хочемо, щоб вона виконала, коли користувач її активує. Це робиться за допомогою CommandBindings елемента Window, все детально пояснено в розділі про команди.

Короткий зміст

Робота з елементом керування WPF Menu є одночасно простою та швидкою, що спрощує створення навіть складних ієрархій меню, а при поєднанні його з командами WPF ви отримуєте широкого переліку функціональності.