ツールヒントの概要

[アーティクル]
12/20/2024

ツールヒントは、Buttonなどの要素の上にマウスポインターを置いたときに表示される小さなポップアップウィンドウです。このトピックでは、ツールヒントについて説明し、ツールヒントのコンテンツを作成およびカスタマイズする方法について説明します。

ユーザーがツールヒントを持つ要素の上にマウスポインターを移動すると、指定した時間、ツールヒントの内容 (たとえば、コントロールの機能を説明するテキストコンテンツ) を含むウィンドウが表示されます。ユーザーがマウスポインターをコントロールから離すと、ツールヒントのコンテンツがフォーカスを受け取ることができないため、ウィンドウが消えます。

ヒントの内容には、1 行以上のテキスト、画像、図形、またはその他のビジュアルコンテンツを含めることができます。コントロールのツールヒントを定義するには、次のいずれかのプロパティをツールヒントコンテンツに設定します。

使用するプロパティは、ツールヒントを定義するコントロールが FrameworkContentElement から継承するか、FrameworkElement クラスから継承するかによって異なります。

次の例では、Button コントロールの ToolTip プロパティをテキスト文字列に設定して、単純なツールヒントを作成する方法を示します。

<Button ToolTip="Click to submit your information" 
        Click="SubmitCode" Height="20" Width="50">Submit</Button>

ツールヒントを ToolTip オブジェクトとして定義することもできます。次の例では、XAML を使用して、ToolTip オブジェクトを TextBox 要素のツールヒントとして指定します。この例では、FrameworkElement.ToolTip プロパティを設定することで ToolTip を指定していることに注意してください。

<TextBox HorizontalAlignment="Left">ToolTip with non-text content
  <TextBox.ToolTip>
    <ToolTip>
      <DockPanel Width="50" Height="70">
        <Image Source="data\flower.jpg"/>
        <TextBlock>Useful information goes here.</TextBlock>
      </DockPanel>
    </ToolTip>
  </TextBox.ToolTip>
</TextBox>

次の例では、コードを使用して ToolTip オブジェクトを生成します。この例では、ToolTip (tt) を作成し、Buttonに関連付けます。

button = new Button();
button.Content = "Hover over me.";
tt = new ToolTip();
tt.Content = "Created with C#";
button.ToolTip = tt;
cv2.Children.Add(button);

button = New Button()
button.Content = "Hover over me."
tt = New ToolTip()
tt.Content = "Created with Visual Basic"
button.ToolTip = tt
cv2.Children.Add(button)

また、ToolTip オブジェクトとして定義されていないツールヒントコンテンツを作成するには、DockPanelなどのレイアウト要素でツールヒントコンテンツを囲みます。次の例は、TextBox の ToolTip プロパティを、DockPanel コントロールで囲まれたコンテンツに設定する方法を示しています。

<TextBox>
  ToolTip with image and text
  <TextBox.ToolTip>
       <StackPanel>
        <Image Source="data\flower.jpg"/>
        <TextBlock>Useful information goes here.</TextBlock>
      </StackPanel>
  </TextBox.ToolTip>

ビジュアルプロパティを設定し、スタイルを適用することで、ツールヒントのコンテンツをカスタマイズできます。ツールヒントのコンテンツを ToolTip オブジェクトとして定義する場合は、ToolTip オブジェクトのビジュアルプロパティを設定できます。それ以外の場合は、ToolTipService クラスに同等の添付プロパティを設定する必要があります。

プロパティとプロパティを使用してヒントコンテンツの位置を指定するためにプロパティを設定する方法の例については、「ツールヒントを配置するを参照してください。

カスタム Styleを定義することで、ToolTip のスタイルを設定できます。次の例では、ToolTip の配置をオフセットし、Background、Foreground、FontSize、および FontWeightを設定して外観を変更する方法を示す、Simple と呼ばれる Style を定義します。

<Style TargetType="ToolTip">
  <Setter Property = "HorizontalOffset" Value="10"/>
  <Setter Property = "VerticalOffset" Value="10"/>
  <Setter Property = "Background" Value="LightBlue"/>
  <Setter Property = "Foreground" Value="Purple"/>
  <Setter Property = "FontSize" Value="14"/>
  <Setter Property = "FontWeight" Value="Bold"/>
</Style>

ToolTipService の時間間隔プロパティの使用

ToolTipService クラスには、ツールヒントの表示時間を設定するためのプロパティ (InitialShowDelay、BetweenShowDelay、ShowDuration) が用意されています。

InitialShowDelay プロパティと ShowDuration プロパティを使用して、ToolTip が表示されるまでの遅延 (通常は短い) を指定したり、ToolTip を表示する期間を指定したりできます。詳細については、「方法: ツールヒントの表示を遅らせる」を参照してください。

BetweenShowDelay プロパティは、マウスポインターをすばやく移動したときに、さまざまなコントロールのツールチップが初期遅延なしで表示されるかどうかを決定します。 BetweenShowDelay プロパティの詳細については、「BetweenShowDelay プロパティを使用する」を参照してください。

次の例は、ツールヒントのこれらのプロパティを設定する方法を示しています。

<Ellipse Height="25" Width="50" 
         Fill="Gray" 
         HorizontalAlignment="Left"
         ToolTipService.InitialShowDelay="1000"
         ToolTipService.ShowDuration="7000"
         ToolTipService.BetweenShowDelay="2000">
  <Ellipse.ToolTip>
    <ToolTip Placement="Right" 
             PlacementRectangle="50,0,0,0"
             HorizontalOffset="10" 
             VerticalOffset="20"
             HasDropShadow="false"
             Opened="whenToolTipOpens"
             Closed="whenToolTipCloses"
             >
      <BulletDecorator>
        <BulletDecorator.Bullet>
          <Ellipse Height="10" Width="20" Fill="Blue"/>
        </BulletDecorator.Bullet>
        <TextBlock>Uses the ToolTip Class</TextBlock>
      </BulletDecorator>
    </ToolTip>
  </Ellipse.ToolTip>
</Ellipse>

次の方法で共有

ツールチップとは

ツールヒントの作成

ToolTip クラスと ToolTipService クラスのプロパティの使用

ツールヒントのスタイル設定

ToolTipService の時間間隔プロパティの使用

関連項目

その他のリソース