[Windows ストアアプリ] Button, AppBarButton にツールチップを出す

ツールチップとはマウスカーソルを合わせたときやタッチで長押ししたときに表示してくれるテキストのことです。
ツールチップの例(カーソルを合わせてみてください)
特にアイコンだけになる場合には何のボタンか分かりにくくなってしまいがちなので設定しておくと良いです。
タッチの場合は指でボタンが隠れてしまうので文字が見えなくなるのを防ぐ効果もあります。

設定方法

[プロパティウィンドウ] [共通] にある ToolTipService.ToolTip プロパティに値を設定するだけです。
tooltip
ただ、直接入力してしまうと多言語化する際にボタンのテキストとツールチップの2つに対応しないといけなくなります。
基本的には Button だったら Content 、 AppBarButton だったら Label と同じになると思うのでデータバインドで対応すると楽です。

データバインド

ToolTipService.ToolTip プロパティ右側の□(上記画像は既にバインド済みなので黄色い■)をクリック。
[データバインディングの作成] を選択すると下記の画面になります。
バインドの種類で [RelativeSource Self] を選択して Button なら Content 、 AppBarButton なら Label を選択。
データバインド

XAML

上記手順を踏むと以下のような XAML になります。
それぞれ x:Uid で Content や Label を設定しています。多言語化についてはこちらを参照。

<Button x:Uid="Tweet" ToolTipService.ToolTip="{Binding Content, RelativeSource={RelativeSource Mode=Self}}"/>
<AppBarButton x:Uid="Reply" ToolTipService.ToolTip="{Binding Label, RelativeSource={RelativeSource Mode=Self}}"/>

カテゴリー: Windows ストア アプリ タグ: , , , パーマリンク