WPF: Welcome Super ToolTips - Office 2007 style

Posted on 2/13/2007 @ 4:17 PM in #Silverlight and WPF by | Feedback | 9780 views

Did it annoy you, ever, that the ToolTip class was so darned limited in the .NET Framework? For cryin' out loud - it used to be "Sealed". I have always maintained that making that class Sealed was not the right choice. And then to pour salt over my wounds, Microsoft introduced "Super Tooltips" in Office 2007. Super ToolTips that blogs.msdn.com brags so shamelessly about. A bit like, we can do this, but you can't. Nyah Nyah Nyah Nyah Nyah !!

Well, no more. WPF will let you create, your very own Super ToolTips. And it's pretty easy too .. .

First of all, what is a Super ToolTip? While a regular ToolTip looks like a yellow box with some text in it, a Super ToolTip can look like this -

As is evident from the above, a Super ToolTip conveys SO MUCH more information. Not only that, Super ToolTips can also offer interactivity to the End User by putting things such as ComboBoxes, and CheckBoxes - much like that annoying floater, I mean Floatie that Word 2007 has -

Tip: If you find that annoying, you can turn it off by going to the Word Options -> Turn off  "Show Mini Toolbar on Selection".
Suggestion: I wish Visual Studio Orcas makes use of Super ToolTips.

Getting to the point, how can you have fancy tooltips like those in your own programs? With .NET 2.x and before - you can't. With WPF, you can.

Say, I wish to create a button, whose ToolTip will be that fancy Super ToolTip. First, how can I create a button with a Tool Tip? You can, like this -

Button btn = new Button();
btn.Content = "My Button";
btn.Margin = new Thickness(48);
ToolTip tip = new ToolTip();
// Super ToolTip code comes here
Content = btn;

Now, how can we make this ToolTip "Super"? Well, like all WPF UIElements, ToolTip has a property called "Content". The cool thing about Content is, you can stuff in pretty much anything in there. A CheckBox, TextBox, your neighbor's dog - well - almost. The only restrictions are

  • Content can contain only one element at a time.
  • Window.Content = AnotherWindow is not allowed.

So that's it. Now replace that //Super ToolTip code comes here comment with this code below:

TextBlock txt = new TextBlock();
CheckBox chk = new CheckBox();
chk.Content = "Cool?";
txt.Inlines.Add(chk);
 
txt.Inlines.Add("\nLook, I have rich tooltips.\n");
txt.Inlines.Add(GetWinSmartsLogo());           
tip.Content = txt;
btn.ToolTip = tip;


The  GetWinSmartsLogo method simply returns an Image. Here's the code -

private Image GetWinSmartsLogo() 
{
    Uri uri = new Uri("http://blah.winsmarts.com/Images/logo_big.gif");
    BitmapImage bmp = new BitmapImage(uri);
    Image wsLogo = new Image();
    wsLogo.Source = bmp;
 
    return wsLogo;
}

Heh ! :-). Now check out the fancy tool tip yo !!

Heh !! Now if that ain't neat, I don't know what is.

Sound off but keep it civil:

Older comments..


On 11/5/2007 10:54:36 AM Tom said ..
How would it be possible to use this technique to display in a tooltip SharePoint calendar list event information in a tooltip when the user is in Month, Week, or Day view??

Thank you, Tom


On 4/23/2008 1:53:33 PM Mike Matheson said ..
Could you post a sample app with source showing this?

Thanks


Mike


On 4/26/2011 3:23:34 PM felipe said ..
Here is the code on VB

Dim tip As New ToolTip()


Dim txt As New TextBlock()


Dim stackMain As New StackPanel


Dim stack As New StackPanel


Dim Rn As New Run

stackMain.Background = Brushes.Honeydew


stackMain.Width = "600"

stack.Background = Brushes.BurlyWood


stack.Width = "600"


stack.Height = "30"

Dim header As New TextBlock


header.VerticalAlignment = Windows.VerticalAlignment.Top


header.Height = "30"


header.FontSize = "24"


header.HorizontalAlignment = Windows.HorizontalAlignment.Right


header.Width = "143"


'header.Inlines.Add(GetWinSmartsLogo())


header.Inlines.Add("Comments")

stack.Children.Add(header)

txt.Inlines.Add(vbLf & textBox8.Text & vbLf & "End Comments")


txt.TextWrapping = TextWrapping.Wrap


stackMain.Children.Add(stack)


stackMain.Children.Add(txt)

tip.Content = stackMain

lblclosedlead.ToolTip = tip

insted of a button is on a label named lblclosedlead