Home > MVVM, Silverlight > Create a DataGridToolTipTextColumn for the Silverlight DataGrid

Create a DataGridToolTipTextColumn for the Silverlight DataGrid

Last I have created a DataGrid column which views a tooltip when you hover over the content (text) of the column. These can be usefull when you have many columns within long textdata.
For the tooltip I have used the ‘Silverlight Advanced ToolTips’ library of Xavier De Coster which you can find on CodePlex.

Create a new class in your project and paste the following code:

public class DataGridToolTipTextColumn : DataGridTextColumn
        protected override FrameworkElement GenerateElement(DataGridCell cell,
                                                            object dataItem)
            TextBlock textBlock = new TextBlock();
            textBlock.SetBinding(TextBlock.TextProperty, this.Binding);
            textBlock.Margin = new Thickness(0, 3, 0, 3); ;
            textBlock.VerticalAlignment = VerticalAlignment.Center;
            Silverlight.Controls.ToolTips.ToolTip toolTip =
                            new Silverlight.Controls.ToolTips.ToolTip();
            toolTip.InitialDelay = 2;
            toolTip.DisplayTime = new Duration(new TimeSpan(0, 0, 5));
            TextBlock textBlockForTt = new TextBlock();
            textBlockForTt.SetBinding(TextBlock.TextProperty, this.Binding);
            toolTip.Content = textBlockForTt;
            toolTip.Language = XmlLanguage.GetLanguage(Thread.CurrentThread.

            cell.Content = textBlock;

            return textBlock;


Add the namespace to XAML where the class is in and in the DataGrid control you can use the DataGridToolTipTextColumn with the following code:

<Controls:DataGridToolTipTextColumn Width="*"
                                    Binding="{Binding Ordername}" />
  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: