How to display tooltip value in WPF?

Question

In WPF, I created a rectangle like this:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"                    
                    xmlns:s="clr-namespace:DiagramDesigner"
                    xmlns:c="clr-namespace:DiagramDesigner.Controls"
                    x:Class="GeoOvwSample.RectangleGeometryRoundedCornerExample"
                >

<Brush x:Key="ItemStroke">#FFD69436</Brush>
<LinearGradientBrush x:Key="ItemBrush" StartPoint="0,0" EndPoint="0,1">
    <LinearGradientBrush.GradientStops>
        <GradientStop Color="#FAFBE9" Offset="0" />
        <GradientStop Color="Orange" Offset="1" />
    </LinearGradientBrush.GradientStops>
</LinearGradientBrush>

<Brush x:Key="ItemStroke1">#ACADCD</Brush>
<LinearGradientBrush x:Key="ItemBrush1" StartPoint="0,0" EndPoint="0,1" >
    <GradientStop Color="#FEFEFE" Offset="0"/>
    <GradientStop Color="#BDBEDE" Offset="1"/>
</LinearGradientBrush>

<Style x:Key="FlowChartRectangleStyle" TargetType="Rectangle">
    <Setter Property="Fill" Value="{StaticResource ItemBrush}"/>
    <Setter Property="Stroke" Value="{StaticResource ItemStroke}"/>
    <Setter Property="StrokeThickness" Value="1"/>
    <Setter Property="StrokeLineJoin" Value="Round"/>
    <Setter Property="Stretch" Value="Fill"/>
    <Setter Property="IsHitTestVisible" Value="False"/>
    <Setter Property="SnapsToDevicePixels" Value="True"/>    
</Style>

    <Style x:Key="Data" TargetType="Rectangle" BasedOn="{StaticResource FlowChartRectangleStyle}">             
</Style>

<Style x:Key="Data_DragThumb" TargetType="Rectangle" BasedOn="{StaticResource Data}">
    <Setter Property="IsHitTestVisible" Value="true"/>
    <Setter Property="Height" Value="300"/>
    <Setter Property="Width" Value="200"/>        
    <Setter Property="Tag" Value="DataShape" />   
</Style>


<s:Toolbox x:Key="FlowChartStencils" ItemSize="100,90" SnapsToDevicePixels="True"
         ScrollViewer.HorizontalScrollBarVisibility="Disabled">
    <ItemsControl.Items>

   <Rectangle Style="{StaticResource Data}" ToolTip="DataTest" StrokeThickness="2">                                
    <s:DesignerItem.DragThumbTemplate>                    
        <ControlTemplate>                        
            <Rectangle Style="{StaticResource Data_DragThumb}" x:Name="DataShape" Tag="DataShapeTag" />
         </ControlTemplate>
     </s:DesignerItem.DragThumbTemplate>                
    </Rectangle>

    </ItemsControl.Items>

    </s:Toolbox>
</ResourceDictionary>

This displays a rectangle on the panel, and I can select and drag it in my GUI. Now I want to create a kind of textblock on the shape so that it displays its tooltip value, and thus the tooltip value appears together with the shape all together. I tried to create the textblock and bind it with the rectangle shape but somehow my code is not correct. How to do it? Or is there a simpler method? Thank you.

Go through this link http://stackoverflow.com/questions/1502964/how-to-programatically-show-a-wpf-c-windows-control-tooltip — user3494837, Jul 10 '14 at 13:01
I am looking for a way to do it in the xaml but not in the code behind. Any suggestion? — E_learner, Jul 10 '14 at 13:03
Silverlight offers a class called "ToolTipService" which can be used to display tooltips for Silverlight controls. This class can be attached to most of the UI elements in Silverlight to display tooltips. — user3494837, Jul 10 '14 at 13:05
Please go through this link http://www.codeproject.com/Articles/36930/Tooltip-service-and-tooltip-facility-of-WPF.it should be helpful — user3494837, Jul 10 '14 at 13:08

score 0 · Answer 1 · answered Jul 10 '14 at 13:08

0

You can simply add the TextBlock into any container control with (but after) the Rectangle element and then data bind the value of the Rectangle.ToolTip to the TextBlock.Text property. Try something like this:

<StackPanel>
    <Rectangle Name="Rectangle" Style="{StaticResource Data}" ToolTip="DataTest" 
        StrokeThickness="2" />
    <TextBlock Text="{Binding ToolTip, ElementName=Rectangle}" />
</StackPanel>

answered Jul 10 '14 at 13:08

Sheridan

68,826
24
143
183

I tried as you said, added "" right after "" but it didn't work. – E_learner Jul 10 '14 at 13:21
Could that be because you are using "StackPanel"? Because mine is "s:ToolBox" and "Rectangle" comes inside "ItemsControl.Items". – E_learner Jul 10 '14 at 13:38
It *could* be any reason... I can't see your code, so can't comment. – Sheridan Jul 10 '14 at 13:52
I updated my question with full code. Could you help? – E_learner Jul 10 '14 at 13:56
Just use the code that I provided you with in place of your `Rectangle`. To be honest though, your code is such a mess... anything could be going wrong. We just don't write XAML like that in WPF. We don't generally define items inside an `ItemsControl.Items` property like that. And does your code even compile? It shouldn't... you should have an error that says *The type 'Rectangle' does not support direct content.* – Sheridan Jul 10 '14 at 14:03
Sorry, but you've got too much wrong for me to help further. You need to learn WPF *before* you come here to ask questions... there's no point in wasting my time answering your questions if you won't understand the answers. I can't be your personal tutor. – Sheridan Jul 10 '14 at 14:19

How to display tooltip value in WPF?

1 Answers1