Tool​Tip Tool​Tip Tool​Tip Class

Definition

Represents a control that creates a pop-up window that displays information for an element in the UI.

A ToolTip is a short description that is linked to another control or object. ToolTip s help users understand unfamiliar objects that aren't described directly in the UI. They display automatically when the user presses and holds or hovers the mouse pointer over a control. The ToolTip disappears after a short time, or when the user moves the pointer.

public class ToolTip : ContentControl, IToolTippublic class ToolTip : ContentControl, IToolTipPublic Class ToolTip Inherits ContentControl Implements IToolTip
<ToolTip .../>
-or-
<ToolTip ...>
  singleObject
</ToolTip ...>
-or-
<ToolTip ...>stringContent</ToolTip>
Inheritance
Attributes
Windows 10 requirements
Device family
Windows 10 (introduced v10.0.10240.0)
API contract
Windows.Foundation.UniversalApiContract (introduced v1)

Inherited Members

Inherited properties

Inherited events

Inherited methods

Remarks

ToolTip is a pop-up window that displays information for another element. Here's a ToolTip for a Button.

Tool tip control

For design guidelines, see Guidelines for tooltips.

Usage

A ToolTip must be assigned to another UI element that is its owner. The ToolTipService class provides static methods to display a ToolTip.

ToolTip toolTip = new ToolTip();
toolTip.Content = "Click to submit";
ToolTipService.SetToolTip(submitButton, toolTip);

You can use any object as the Content of a ToolTip. Here's an example of using an Image in a ToolTip.

<TextBlock Text="store logo">
    <ToolTipService.ToolTip>
        <Image Source="Assets/StoreLogo.png"/>
    </ToolTipService.ToolTip>
</TextBlock> 

Placement

By default, a ToolTip is displayed centered above the pointer. The placement is not constrained by the app window, so the ToolTip might be displayed partially or completely outside of the app window bounds.

If a ToolTip obscures the content it is referring to, you can adjust it's placement. Use the Placement property or ToolTipService.Placement attached property to place the ToolTip above, below, left, or right of the pointer. You can set the VerticalOffset and HorizontalOffset properties to change the distance between the pointer and the ToolTip.

Control style and template

You can modify the default Style and ControlTemplate to give the control a unique appearance. For information about modifying a control's style and template, see Styling controls. The default style, template, and resources that define the look of the control are included in the generic.xaml file. For design purposes, generic.xaml is available in the (Program Files)\Windows Kits\10\DesignTime\CommonConfiguration\Neutral\UAP&lt;SDK version>\Generic folder from a Windows Software Development Kit (SDK) installation. Styles and resources from different versions of the SDK might have different values.

Starting in Windows 10, version 1607 (Windows Software Development Kit (SDK) version 10.0.14393.0), generic.xaml includes resources that you can use to modify the colors of a control in different visual states without modifying the control template. In apps that target this software development kit (SDK) or later, modifying these resources is preferred to setting properties such as Background and Foreground. For more info, see the Light-weight styling section of the Styling controls article.

This table shows the resources used by the ToolTip control.

Resource keyDescription
ToolTipForegroundText color in tool tip
ToolTipBackgroundBackground color
ToolTipBorderBrushBorder color

Notes for previous versions

Windows 8.x ToolTip is intended only for use in Windows. The ToolTip type is available in Windows Phone projects for compatibility with universal project templates, but the ToolTip is not shown in the Windows Phone UI.

ToolTip is displayed only within the bounds of the app window. It's placement might be adjusted to stay within those bounds.

Examples

This example demonstrates basic tooltips and the properties for placement.

<!-- A button with a simple ToolTip. -->
<Button Content="Button with a simple ToolTip." 
        ToolTipService.ToolTip="Simple ToolTip" />

<!-- A TextBlock with an offset ToolTip. -->
<TextBlock Text="TextBlock with an offset ToolTip.">
    <ToolTipService.ToolTip> 
        <ToolTip Content="Offset ToolTip." 
                 HorizontalOffset="20" VerticalOffset="30"/>
    </ToolTipService.ToolTip>
</TextBlock>

Constructors

ToolTip() ToolTip() ToolTip()

Initializes a new instance of the ToolTip class.

public ToolTip()public ToolTip()Public Sub New()
Attributes

Properties

HorizontalOffset HorizontalOffset HorizontalOffset

Gets or sets the horizontal distance between the target origin and the pop-up alignment point.

public double HorizontalOffset { get; set; }public double HorizontalOffset { get; set; }Public ReadWrite Property HorizontalOffset As double
<ToolTip HorizontalOffset="double"/>
Value
double double double

The horizontal distance between the target origin and the pop-up alignment point. The default is 0.

Attributes

HorizontalOffsetProperty HorizontalOffsetProperty HorizontalOffsetProperty

Identifies the HorizontalOffset dependency property.

public static DependencyProperty HorizontalOffsetProperty { get; }public static DependencyProperty HorizontalOffsetProperty { get; }Public Static ReadOnly Property HorizontalOffsetProperty As DependencyProperty
Value
DependencyProperty DependencyProperty DependencyProperty

The identifier for the HorizontalOffset dependency property.

Attributes

IsOpen IsOpen IsOpen

Gets or sets a value that indicates whether the ToolTip is visible.

public bool IsOpen { get; set; }public bool IsOpen { get; set; }Public ReadWrite Property IsOpen As bool
Value
bool bool bool

true if the ToolTip is visible; otherwise, false. The default is false.

Attributes

Remarks

This property is not typically set in XAML.

A ToolTip must be assigned to another UI element that is its owner. In XAML, use the ToolTipService.Tooltip attached property to assign the ToolTip to an owner. In code, use the ToolTipService.SetToolTip method to assign the ToolTip to an owner. If you set the IsOpen property to true in your app code before the ToolTip is assigned to an owner, an exception is thrown.

IsOpenProperty IsOpenProperty IsOpenProperty

Identifies the IsOpen dependency property.

public static DependencyProperty IsOpenProperty { get; }public static DependencyProperty IsOpenProperty { get; }Public Static ReadOnly Property IsOpenProperty As DependencyProperty
Value
DependencyProperty DependencyProperty DependencyProperty

The identifier for the IsOpen dependency property.

Attributes

Placement Placement Placement

Gets or sets how a ToolTip is positioned in relation to the placement target element.

public PlacementMode Placement { get; set; }public PlacementMode Placement { get; set; }Public ReadWrite Property Placement As PlacementMode
<ToolTip Placement="placementModeMemberName"/>
Attributes

Remarks

If there is no explicit PlacementTarget, the placement target for a ToolTip is the element that specifies the ToolTip as the value for its TooltipService.ToolTip attached property value, and any Placement value applies to that target.

Placement and PlacementTarget are usually left as the defaults. The scenario for specifying either or both of these properties is if you are trying to avoid a case where the tooltip obscures the content it is referring to while the tooltip is displayed.

Examples

The following code example demonstrates the placement modes for a ToolTip.

<StackPanel Margin="120" >
    <TextBlock Text="ToolTip Control" Margin="5" 
               Style="{StaticResource HeaderTextStyle}" />
    <TextBlock Text="Hover over an item to see its ToolTip: " 
               Style="{StaticResource ItemTextStyle}" Margin="10" />
    <ListBox Width="100">
        <ListBoxItem Content="Left" 
            ToolTipService.ToolTip="ToolTip to the left." 
            ToolTipService.Placement="Left" />
        <ListBoxItem Content="Right" 
            ToolTipService.ToolTip="ToolTip to the right." 
            ToolTipService.Placement="Right" />
        <ListBoxItem Content="Top" 
            ToolTipService.ToolTip="ToolTip at the top." 
            ToolTipService.Placement="Top" />
        <ListBoxItem Content="Bottom" 
            ToolTipService.ToolTip="ToolTip at the bottom." 
            ToolTipService.Placement="Bottom"/>
        <ListBoxItem Content="Mouse" 
            ToolTipService.ToolTip="ToolTip based on the cursor position." 
            ToolTipService.Placement="Mouse"/>
    </ListBox>
</StackPanel>

PlacementProperty PlacementProperty PlacementProperty

Identifies the Placement dependency property.

public static DependencyProperty PlacementProperty { get; }public static DependencyProperty PlacementProperty { get; }Public Static ReadOnly Property PlacementProperty As DependencyProperty
Value
DependencyProperty DependencyProperty DependencyProperty

The identifier for the Placement dependency property.

Attributes

PlacementTarget PlacementTarget PlacementTarget

Gets or sets the visual element or control that the tool tip should be positioned in relation to when opened by the ToolTipService.

public UIElement PlacementTarget { get; set; }public UIElement PlacementTarget { get; set; }Public ReadWrite Property PlacementTarget As UIElement
<ToolTip PlacementTarget="{Binding ElementName=placementTargetName}"/>
Value
UIElement UIElement UIElement

The visual element or control that the tool tip is positioned in relation to when opened by the ToolTipService. The default is null.

Attributes

Remarks

If there is no explicit PlacementTarget, the placement target for a ToolTip is the element that specifies the ToolTip as the value for its TooltipService.ToolTip attached property value, and any Placement value applies to that target. The placement target determination is based on visual tree composition, and whether to display a tooltip at all is parallel to the target's hit test characteristics. A Control instance where IsEnabled is false will not display a ToolTip.

Placement and PlacementTarget are usually left as the defaults. The scenario for specifying either or both of these properties is if you are trying to avoid a case where the tooltip obscures the content it is referring to while the tooltip is displayed.

PlacementTargetProperty PlacementTargetProperty PlacementTargetProperty

Identifies the PlacementTarget dependency property.

public static DependencyProperty PlacementTargetProperty { get; }public static DependencyProperty PlacementTargetProperty { get; }Public Static ReadOnly Property PlacementTargetProperty As DependencyProperty
Value
DependencyProperty DependencyProperty DependencyProperty

The identifier for the PlacementTarget dependency property.

Attributes

TemplateSettings TemplateSettings TemplateSettings

Gets an object that provides calculated values that can be referenced as TemplateBinding sources when defining templates for a ToolTip.

public ToolTipTemplateSettings TemplateSettings { get; }public ToolTipTemplateSettings TemplateSettings { get; }Public ReadOnly Property TemplateSettings As ToolTipTemplateSettings
Value
ToolTipTemplateSettings ToolTipTemplateSettings ToolTipTemplateSettings

An object that provides calculated values for templates.

Attributes

VerticalOffset VerticalOffset VerticalOffset

Gets or sets the vertical distance between the target origin and the pop-up alignment point.

public double VerticalOffset { get; set; }public double VerticalOffset { get; set; }Public ReadWrite Property VerticalOffset As double
<ToolTip VerticalOffset="double"/>
Value
double double double

The vertical distance between the target origin and the pop-up alignment point. The default is 0.

Attributes

VerticalOffsetProperty VerticalOffsetProperty VerticalOffsetProperty

Identifies the VerticalOffset dependency property.

public static DependencyProperty VerticalOffsetProperty { get; }public static DependencyProperty VerticalOffsetProperty { get; }Public Static ReadOnly Property VerticalOffsetProperty As DependencyProperty
Value
DependencyProperty DependencyProperty DependencyProperty

The identifier for the VerticalOffset dependency property.

Attributes

Events

Closed Closed Closed

Occurs when a ToolTip is closed and is no longer visible.

public event RoutedEventHandler Closedpublic event RoutedEventHandler ClosedPublic Event Closed
<ToolTip Closed="eventhandler"/>
Attributes

Opened Opened Opened

Occurs when a ToolTip becomes visible.

public event RoutedEventHandler Openedpublic event RoutedEventHandler OpenedPublic Event Opened
<ToolTip Opened="eventhandler"/>
Attributes

See Also