WPF FAQ - ToolTip

Find answers for the most frequently asked questions
Expand All Collapse All

WPF doesn’t provide a MouseHover event and instead provides a much more flexible and high-level Tooltip support. To simulate MouseHover, you will first set the tooltip for the element in question to some dummy text and then listen to the TooltipOpening event where you would mark it as ‘Handled’ as follows:

 [XAML]
<Canvas ToolTipOpening='Canvas_ToolTipOpening' ToolTipService.ToolTip='Testing'>
</Canvas>
 [C#]
        private void Canvas_ToolTipOpening(object sender, ToolTipEventArgs e)
        {
            e.Handled = true;
            // More code goes here:
        }
Permalink

You can set a ‘ToolTipService’ property that causes a brief delay before a ToolTip displays. You set the properties of the ‘ToolTipService’ class by attaching them directly to the element that exposes the tooltip.

[XAML]
 
<TextBox HorizontalAlignment='Left' ToolTipService.InitialShowDelay='1500'
ToolTip='Useful information goes here.'>
     ToolTip with delay
   </TextBox>

Permalink

The trick is to use the InitialShowDelay and BetweenShowDelay property appropriately as shown below in all your tooltips:

[XAML]

<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
Permalink

The following example shows how to use the ‘ToolTipService’ properties to specify the position of a tooltip among other things. This also shows how the tooltip look and feel can be customized with any content.

[XAML]

    <Ellipse Height='25' Width='50' 
         Fill='Gray' 
         HorizontalAlignment='Left'
         ToolTipService.InitialShowDelay='1000'
         ToolTipService.ShowDuration='7000'
         ToolTipService.BetweenShowDelay='2000'
         ToolTipService.Placement='Right' 
         ToolTipService.PlacementRectangle='50,0,0,0'
         ToolTipService.HorizontalOffset='10' 
         ToolTipService.VerticalOffset='20'
         ToolTipService.HasDropShadow='false'
         ToolTipService.ShowOnDisabled='true' 
         ToolTipService.IsEnabled='true'
         ToolTipOpening='whenToolTipOpens'
         ToolTipClosing='whenToolTipCloses'
         >
  <Ellipse.ToolTip>
    <BulletDecorator>
      <BulletDecorator.Bullet>
        <Ellipse Height='10' Width='20' Fill='Blue'/>
      </BulletDecorator.Bullet>
      <TextBlock>Uses the ToolTipService class</TextBlock>
    </BulletDecorator>
  </Ellipse.ToolTip>
</Ellipse>

Permalink

Share with

Couldn't find the FAQs you're looking for?

Please submit your question and answer.