[WPFリボン プログラミング] 第12回 ～クイック アクセス ツールバー～

  • Article

[WPFリボン プログラミング ]
第12回 ～クイック アクセス ツールバー～

[ クイック アクセス ツールバー (QAT) とは ]
クイック アクセス ツールバーは、ウィンドウの左上に表示されているアイコン群です。
数の赤で囲っているところがクイック アクセスツールバーです。

表示されているアイコンをクリックすると、やりたいことが一発でできます。
上の図は、Windows 7のペイントのクイック アクセス ツールバーです。
左から、上書き保存、元に戻す、やり直しの各アイコンが並んでいます。
その右にある下三角ボタンをクリックするとクイックアクセス ツールバーに表示させるアイコンを変えることができます。

[ クイック アクセスツールバーの実装 ]
それでは、クイック アクセス ツールバーを実装してみましょう。
プロジェクトは、前回( 第11回) で作成したプロジェクトを使用します。
第5回で作成したシンプルなプロジェクトを元にしても構いません。その場合は、画面のイメージが説明するものと少し異なります。
プロジェクトを開いたら、MainPage.xamlのXAMLコードを表示し、下記の赤い字の部分のXAMLコードを追加します。

</my:RibbonGroup>
</my:RibbonTab>

<my:Ribbon.QuickAccessToolBar>
<my:RibbonQuickAccessToolBar>
<my:RibbonButton
Command="Undo"
SmallImageSource="c:\tmp\icon\test3.ico">
</my:RibbonButton>
</my:RibbonQuickAccessToolBar>
</my:Ribbon.QuickAccessToolBar>

</my:Ribbon>

追加する場所は、my:Ribbonの定義の中に追加します。
この例では、my:Ribbonの定義の中のいちばん最後に追加しました。
SmallImageSourceの部分は、ハードディスク内にある適当なアイコンまたはJPEG形式などの画像ファイルを指定します。
ここでは、CommangにUndoを指定していますので、このアイコンをクリックすると「元に戻す」を実行します。
第11回のプロジェクトを元に作成した場合は、表示されているテキストボックスに文字を入力したり、削除してからクイックアクセス ツールバー上のアイコンをクリックすると、「元に戻す」を実行できます。
今回はCommandを使用して既存のコマンドを設定しましたが、Clickイベントに対応したイベントハンドラーを作成することにより、独自の機能を実装することもできます。

[ ツールチップの表示 ]
ツールチップを表示させるときも、リボンの上に貼り付けた他のコントロールにツールチップを用意する方法と同じ方法を使用します。

単純なツールチップを表示させるときには、XAMLのコードに以下の赤い字の部分を追加します。

<my:Ribbon.QuickAccessToolBar>
<my:RibbonQuickAccessToolBar>
<my:RibbonButton
Command="Undo"
ToolTip="元に戻す"
SmallImageSource="c:\tmp\icon\test3.ico">
</my:RibbonButton>
</my:RibbonQuickAccessToolBar>
</my:Ribbon.QuickAccessToolBar>

このプログラムを実行すると、下図のようになります。

ツールチップに多くの情報を表示させたい場合は、下記の赤い字の部分のように実装します。

<my:Ribbon.QuickAccessToolBar>
<my:RibbonQuickAccessToolBar>
<my:RibbonButton
Command="Undo"
ToolTipTitle="元に戻す"
ToolTipDescription="直前の操作を元に戻します"
ToolTipFooterTitle="既定のコマンド"
SmallImageSource="c:\tmp\icon\test3.ico">
</my:RibbonButton>
</my:RibbonQuickAccessToolBar>
</my:Ribbon.QuickAccessToolBar>

このプログラムを実行すると、下図のようになります。

ToolTipTitleにツールチップのタイトル、ToolTipDescriptionに説明を記述します。
ToolTipFooterTitleや、ここでは使用していませんがToolTipFooterDescriptionに情報を記述すると、ツールチップの下部に追加情報を表示できます。
ToolTipImageSource、ToolTipFooterImageSourceにアイコンや画像を指定して、表示させることもできます。

本連載は、あとギャラリー、キーチップ、タブの優先順位を説明して終了する予定です。

[WPFリボンの開発用コンポーネントのダウンロード先]
WPFリボンの開発は、Visual Studio 2010またはExpression Blend 4に、Microsoft Ribbon for WPFというコンポーネントを追加することによって開発できます。
以下のサイトからダウンロードすることができます。
https://www.microsoft.com/downloads/en/details.aspx?FamilyID=2bfc3187-74aa-4154-a670-76ef8bc2a0b4&displaylang=en

[WPFリボン プログラミング]
第1回 : ～リボン インターフェイスとは～
第2回 : ～開発環境を揃える～
第3回 : ～リボンについて知っておくべきこと～
第4回 : ～リボン インターフェイスを作る2つの方法～
第5回 : ～タブとグループの作り方～
第6回 : ～グループへのコントロールの追加～
第7回 : ～ボタンをクリックしたときの処理と多彩なツールチップ～
第8回 : ～特定のときのみ表示させるコンテキスト タブ～
第9回 : ～アプリケーション メニュー～
第10回 : ～アプリケーション メニュー 上級編～
第11回 : ～コマンド ～
第12回 : ～クイック アクセス ツールバー～

マイクロソフト
田中達彦