Silverlight／WPFで使える逆引きTips集
――ツールバー機能

（11） ToolBarコントロールとToolBarTrayコントロール

10.メニューを表示する

　ツールバーにはボタンやコンボボックスといったコントロール以外にも、メニューを表示させることができます。

　メニューを表示させるにはMenuクラスを使用します。Menuについて、詳しくは第10回を参照ください。

　下記はツールバーにメニューを表示する例です。

メニューを表示する例

XAMLの例

<Window.CommandBindings>
    <!-- [ファイル]-[新規作成]用コマンド -->
    <CommandBinding Command="New" Executed="FileNewExecute" />
    <!-- [ファイル]-[保存]用コマンド -->
    <CommandBinding Command="SaveAs" Executed="FileSaveExecute" CanExecute="FileSaveCanExecute" />
</Window.CommandBindings>
<DockPanel Name="DocPanel1">
    <ToolBarTray Name="ToolBarTray1" DockPanel.Dock="Top">
        <ToolBar Name="ToolBar1" Band="1">
            <Menu>
                <MenuItem Header="ファイル(_F)">
                    <MenuItem Command="New" />
                    <MenuItem Command="SaveAs" />
                    <MenuItem Command="Save" />
                    <Separator />
                    <MenuItem Command="Close" />
                </MenuItem>
                <MenuItem Header="編集(_E)">
                    <MenuItem Command="Cut" />
                    <MenuItem Command="Copy" />
                    <MenuItem Command="Paste" />
                </MenuItem>
            </Menu>
        </ToolBar>
        <ToolBar DockPanel.Dock="Top" Band="2">
            <Button Command="New">
                <Image Source="Images/NewDocument.png" Width="16" Height="16" />
            </Button>
            <Button Command="Save">
                <Image Source="Images/Save.png" Width="16" Height="16" />
            </Button>
            <TextBlock VerticalAlignment="Center">フォントサイズ</TextBlock>
            <ComboBox Width="50">
                <ComboBoxItem IsSelected="True">10pt</ComboBoxItem>
                <ComboBoxItem>11pt</ComboBoxItem>
                <ComboBoxItem>12pt</ComboBoxItem>
            </ComboBox>
            <Button>
                <Image Source="Images/boldhs.png" Width="16" Height="16" />
            </Button>
            <Button>
                <Image Source="Images/Italichs.png" Width="16" Height="16" />
            </Button>
        </ToolBar>
    </ToolBarTray>
    <TextBox Name="TextBox1"></TextBox>
</DockPanel>

VBの例

'コマンドに対するイベントコードの例

'TextBoxの内容に変更があったかどうかを示すフラグ
'内容に変更があった場合にTrueとする
Private IsModified As Boolean = False

' [ファイル]-[新規作成]に対するコマンド
Private Sub FileNewExecute(ByVal sender As System.Object, ByVal e As System.Windows.Input.ExecutedRoutedEventArgs)
    MessageBox.Show("New")
End Sub

' [ファイル]-[保存]に対するコマンド
Private Sub FileSaveExecute(ByVal sender As System.Object, ByVal e As System.Windows.Input.ExecutedRoutedEventArgs)
    MessageBox.Show("Save")
End Sub

' [ファイル]-[保存]の実行可否を決定する
Private Sub FileSaveCanExecute(ByVal sender As System.Object, ByVal e As System.Windows.Input.CanExecuteRoutedEventArgs)
    'TextBoxの内容に変更があった場合
    If IsModified Then
        '[ファイル]-[保存]の実行を許可する
        e.CanExecute = True
    End If
End Sub

' テキストボックスの内容に変更があった場合の処理
Private Sub TextBox1_TextChanged(ByVal sender As System.Object, ByVal e As System.Windows.Controls.TextChangedEventArgs) Handles TextBox1.TextChanged
    '内容が変更されたことを示すためフラグをTrueにする
    IsModified = True
End Sub

C#の例

// コマンドに対するイベントコードの例

// TextBoxの内容に変更があったかどうかを示すフラグ
// 内容に変更があった場合にTrueとする
private bool IsModified = false;

// [ファイル]-[新規作成]に対するコマンド
private void FileNewExecute(object sender, ExecutedRoutedEventArgs e)
{
    MessageBox.Show("New");
}

// [ファイル]-[保存]に対するコマンド
private void FileSaveExecute(object sender, ExecutedRoutedEventArgs e)
{
    MessageBox.Show("Save");
}

// [ファイル]-[保存]の実行可否を決定する
private void FileSaveCanExecute(object sender, CanExecuteRoutedEventArgs e)
{
    // TextBoxの内容に変更があった場合
    if (IsModified)
    {
        // [ファイル]-[保存]の実行を許可する
        e.CanExecute = true;
    }
}

// テキストボックスの内容に変更があった場合の処理
private void TextBox1_TextChanged(object sender, TextChangedEventArgs e)
{
    // 内容が変更されたことを示すためフラグをTrueにする
    IsModified = true;
}

ポイント

　メニューを表示するにはMenuクラスを使用する。

11.ツールバートレイの背景色を設定する

　ツールバートレイの背景色を設定するには、ToolBarTrayクラスのBackgroundプロパティを設定します。

　下記は、リソースに青のグラデーションを準備し、バインディングで背景色を設定する例です。

ツールバートレイの背景色を設定する例

XAMLの例

<Window.Resources>
    <LinearGradientBrush x:Key="TrayBackground" EndPoint="0.5,1" StartPoint="0.5,0">
        <GradientStop Color="#FFE7EFF7" Offset="0"/>
        <GradientStop Color="#FF7FBFFF" Offset="0.5"/>
        <GradientStop Color="#FF0A4178" Offset="1"/>
    </LinearGradientBrush>
</Window.Resources>
<DockPanel Name="DocPanel1">
    <ToolBarTray Name="ToolBarTray1" DockPanel.Dock="Top" 
                    Background="{StaticResource TrayBackground}">
        <ToolBar Name="ToolBar1" Band="1">
            <Button>A</Button>
            <Button>B</Button>
            <Button>C</Button>
        </ToolBar>
        <ToolBar Name="ToolBar2" Band="2">
            <Button>D</Button>
            <Button>E</Button>
            <Button>F</Button>
        </ToolBar>
        <ToolBar Name="ToolBar3" Band="2">
            <Button>G</Button>
            <Button>H</Button>
            <Button>I</Button>
        </ToolBar>
        <ToolBar Name="ToolBar4" Band="2">
            <Button>J</Button>
            <Button>K</Button>
            <Button>L</Button>
        </ToolBar>
    </ToolBarTray>
    <TextBox></TextBox>
</DockPanel>

ポイント

　ツールバートレイの背景色を設定するにはBackgroundプロパティを使用する。

まとめ

　今回はツールバーに関するTipsを紹介しました。

　アプリケーションを作成する上でメニュー機能は欠かせないものなので、この機会にぜひ習得してはいかがでしょうか。

　最後にメニューに関するMSDNのリンクを下記に示します。

• ToolBarクラス
• ToolBarTrayクラス