Home / ぼやきごと / 2015-09-27 / WPF・XAML: Menu 直下の MenuItem を右寄せ表示する
WPF・XAML: Menu 直下の MenuItem を右寄せ表示する

WPF・XAML: Menu 直下の MenuItem を右寄せ表示する

WPFの Menu クラスは ItemsControl クラスから派生しているため、下記サイトの内容が一通り使えます。

Menu はデフォルトでは WrapPanel を用いてレイアウトされていますが、これを DockPanel に置き換えることで特定のメニュー項目を右寄せ表示することができます。

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:WpfMenuSample"
    x:Class="WpfMenuSample.MainWindow"
    Title="WpfMenuSample"
    Width="400"
    Height="120">
    <DockPanel>
        <Menu DockPanel.Dock="Top">
            <Menu.ItemsPanel>
                <ItemsPanelTemplate>
                    <DockPanel />
                </ItemsPanelTemplate>
            </Menu.ItemsPanel>
 
            <MenuItem Header="ファイル(_F)" TabIndex="0" DockPanel.Dock="Left">
                <!-- 内容略 -->
            </MenuItem>
            <MenuItem Header="編集(_E)" TabIndex="1" DockPanel.Dock="Left">
                <!-- 内容略 -->
            </MenuItem>
            <MenuItem Header="情報(_I)" TabIndex="3" DockPanel.Dock="Right">
                <!-- 内容略 -->
            </MenuItem>
            <MenuItem Header="ヘルプ(_H)" TabIndex="2" HorizontalAlignment="Right">
                <!-- 内容略 -->
            </MenuItem>
        </Menu>
        <TextBlock Text="メニュー表示テスト" Margin="8" />
    </DockPanel>
</Window>
右寄せメニュー表示

注意点は下記の通りです。いずれも Menu というよりは DockPanel の注意点ですが。

  • 最後の要素(上述の例だと「ヘルプ」)は横幅がめいっぱい取られるため、 HorizontalAlignment プロパティ値を設定する必要がある。
  • 右寄せしたい項目が複数ある場合、そのままだとタブオーダーがおかしくなるため、 TabIndex プロパティ値を明示的に設定する必要がある。
    • 右寄せしたい項目が1つだけなら不要。
  • ウィンドウの横幅を小さくしすぎると最後の要素が隠れてしまう。
    • ウィンドウの MinWidth プロパティ値を設定する等で回避すべし。
Category: [WPF・XAML][プログラミング] - 2015-09-27 12:13:20

添付ファイル: file右寄せメニュー表示.png 298件 [詳細]