Wahlin on .NET

Using Element to Element Binding for ToolTips in Silverlight

Silverlight 3 or higher provides a feature called “element to element” binding that allows one element to bind to another element’s property.

Silverlight 3 or higher provides a feature called "element to element" binding that allows one element to bind to another element's property. It's quite useful when you need to tie two objects together so that when one object changes the other changes as well. Most of the samples shown for this particular feature tend to focus on using slider controls. For example, when a Slider control changes, its Value property can be bound to a TextBlock element's Text property to automatically update the text. An example of doing this using standard Silverlight binding syntax is shown next. Looking through the code you'll see that the ElementName keyword is used to bind the Text property to the Slider with a name of "TheSlider".

‹Slider x:Name="TheSlider"
        Value="50.0" /›
‹TextBlock FontFamily="Georgia"
        Text="{Binding Value, ElementName=TheSlider, Mode=OneWay}" /›
While this is useful for demonstrations, I don't typically have a need for sliders most of the time. Here's a simple yet effective way to leverage element to element binding for tooltips in Silverlight applications. The sample below shows a ComboBox control with a data template. When a user mouses over the ComboBox control a description of the selected item will be shown. With Silverlight 2 you'd have to write code since there wouldn't be a way for the tooltip service to bind to the selected item declaratively. With Silverlight 3 or higher you can do something like this (notice the ToolTipService attribute):

    ItemsSource="{Binding Source={StaticResource 
    Style="{StaticResource TimeSheetComboBoxStyle}" 
    ToolTipService.ToolTip="{Binding Path=SelectedItem.Description, 
            ‹StackPanel Orientation="Horizontal" Margin="0"›
                ‹TextBlock Text="{Binding WorkCodeID}" Width="30" 
                  Margin="5,0,0,0" /›
                ‹Rectangle Style="{StaticResource ComboBoxVerticalLine}" /›
                ‹TextBlock Text="{Binding Description}" Width="250" 
                  Margin="10,0,0,0" /›
In this case I'm binding the tooltip to the selected item's Description property. At first glance it looks like the ComboBox is binding to itself but in reality it's binding to the ToolTipService's Tooltip property. A simple little trick, but nice when you need it since it saves a line or two of C# code and provides end users with more information about the selected item in the ComboBox.

About the Author

Dan Wahlin (Microsoft MVP for ASP.NET and XML Web Services) is the founder of The Wahlin Group which specializes in .NET and SharePoint onsite, online and video training and consulting solutions. Dan also founded the XML for ASP.NET Developers Web site, which focuses on using ASP.NET, XML, AJAX, Silverlight and Web Services in Microsoft's .NET platform. He's also on the INETA Speaker's Bureau and speaks at conferences and user groups around the world. Dan has written several books on .NET including "Professional Silverlight 2 for ASP.NET Developers," "Professional ASP.NET 3.5 AJAX, ASP.NET 2.0 MVP Hacks and Tips," and "XML for ASP.NET Developers." Read Dan's blog here.

comments powered by Disqus


  • .NET for Apache Spark Debuts in Version 1.0

    The open source project .NET for Apache Spark has debuted in version 1.0, finally vaulting the C# and F# programming languages into Big Data first-class citizenship.

  • In-App Reviews Come to Xamarin.Forms Android

    Android is playing a little catch-up to iOS regarding in-app review functionality, just now coming tp Microsoft's Xamarin.Forms implementation.

  • C# Slides in Usage Ranking of Programming Languages

    "The fact that C# lost three places in the ranking of language communities during the last three years is mostly explained by its slower growth compared to C/C++ and PHP."

  • Telerik UI for Blazor Updated

    Progress announced an update to its Telerik UI for Blazor components, targeting Microsoft's open source Blazor framework that lets C# coders create web apps without having to rely upon JavaScript.

  • Infragistics Unveils UI Components for Blazor

    Infragistics, specializing in third-party UI/UX controls and tools, unveiled a new offering targeting Blazor, Microsoft's red-hot open source framework that allows for C#-based web development instead of traditional mainstay JavaScript.

Upcoming Events