[WinUI 3][MenuBar] メニューにショートカットキーを設定する

本記事では、メニュー項目にショットカットキーを設定する方法について説明します。

環境

ショットカットキーを設定する

メニュー項目にショットカットキーを設定するには、<MenuFlyoutItem.KeyboardAccelerators> と <KeyboardAccelerator> を使用します。 <KeyboardAccelerator> には Modifiers プロパティと Key プロパティがあります。Modifiers プロパティには「Control」「Windows」「None」「Shift」などを設定することができ、Key プロパティには「K」や「N」など、押下するキー名を指定します。

Modifiers=”Control” Key=”N” とすると [Ctrl] + [N] というショートカットキーを設定する意味になります。

以下は「ファイル」の各メニューにショートカットキーを設定する例です。

<Window
    x:Class="WinUIAppSample.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:WinUIAppSample"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
    <StackPanel VerticalAlignment="Top" HorizontalAlignment="Left">
        <MenuBar>
            <MenuBarItem Title="ファイル">
                <MenuFlyoutItem Text="新規" Icon="Add">
                    <MenuFlyoutItem.KeyboardAccelerators>
                        <KeyboardAccelerator Modifiers="Control" Key="N" />
                    </MenuFlyoutItem.KeyboardAccelerators>
                </MenuFlyoutItem>
                <MenuFlyoutItem Text="開く..." Icon="OpenFile">
                    <MenuFlyoutItem.KeyboardAccelerators>
                        <KeyboardAccelerator Modifiers="" Key="O" />
                    </MenuFlyoutItem.KeyboardAccelerators>
                </MenuFlyoutItem>
                <MenuFlyoutItem Text="保存" Icon="Save">
                    <MenuFlyoutItem.KeyboardAccelerators>
                        <KeyboardAccelerator Modifiers="Control" Key="S" />
                    </MenuFlyoutItem.KeyboardAccelerators>
                </MenuFlyoutItem>
                <MenuFlyoutSeparator />
                <MenuFlyoutItem Text="終了">
                    <MenuFlyoutItem.KeyboardAccelerators>
                        <KeyboardAccelerator Modifiers="Control" Key="X" />
                    </MenuFlyoutItem.KeyboardAccelerators>
                </MenuFlyoutItem>
            </MenuBarItem>
            <MenuBarItem Title="モード">
                <RadioMenuFlyoutItem Text="自動" IsChecked="True" />
                <RadioMenuFlyoutItem Text="ダークモード" />
                <RadioMenuFlyoutItem Text="ライトモード" />
            </MenuBarItem>
            <MenuBarItem Title="ヘルプ">
                <MenuFlyoutItem Text="このアプリについて" Icon="Help"/>
            </MenuBarItem>
        </MenuBar>

        <StackPanel>
            
        </StackPanel>
    </StackPanel>
</Window>

ショートカットキーを設定する例

Please follow and like us: