Question

I need to add a tooltip for a column header of a DataGrid (Silverlight 4). I will generate the number of columns and column header text dynamically.

GridColumnCreation(....)
{
    IEnumerable allHeaderText = /* Linq query */; 
}

How to use this collection to set a tooltip?

Answer 1

This can be done by using DataGridTextColumn & DataGridTextColumn.HeaderStyle. In the headerstyle tag, use the ToolTipService and bind the content to the dynamic values generated. Here’s a sample code for this…

        <data:DataGrid.Columns>
            <data:DataGridTextColumn Header="First Name" Binding="{Binding FName}" >
                <data:DataGridTextColumn.HeaderStyle>
                    <Style TargetType="dataprimitives:DataGridColumnHeader">
                        <Setter Property="ContentTemplate">
                            <Setter.Value>
                                <DataTemplate>
                                    <ContentControl Content="{Binding}">
                                        <ToolTipService.ToolTip>
                                            <ToolTip Content="Tooltip First" />
                                        </ToolTipService.ToolTip>
                                    </ContentControl>
                                </DataTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </data:DataGridTextColumn.HeaderStyle>
            </data:DataGridTextColumn>

            <data:DataGridTextColumn Header="Last Name" Binding="{Binding LName}">
                <data:DataGridTextColumn.HeaderStyle>
                    <Style TargetType="dataprimitives:DataGridColumnHeader">
                        <Setter Property="ContentTemplate">
                            <Setter.Value>
                                <DataTemplate>
                                    <ContentControl Content="{Binding}">
                                        <ToolTipService.ToolTip>
                                            <ToolTip Content="Tooltip Second"></ToolTip>
                                        </ToolTipService.ToolTip>
                                    </ContentControl>
                                </DataTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </data:DataGridTextColumn.HeaderStyle>
            </data:DataGridTextColumn>

            <data:DataGridTextColumn Header="City" Binding="{Binding City}">
                <data:DataGridTextColumn.HeaderStyle>
                    <Style TargetType="dataprimitives:DataGridColumnHeader">
                        <Setter Property="ContentTemplate">
                            <Setter.Value>
                                <DataTemplate>
                                    <ContentControl Content="{Binding}">
                                        <ToolTipService.ToolTip>
                                            <ToolTip Content="Tooltip Third"></ToolTip>
                                        </ToolTipService.ToolTip>
                                    </ContentControl>
                                </DataTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </data:DataGridTextColumn.HeaderStyle>
            </data:DataGridTextColumn>
        </data:DataGrid.Columns>

    </data:DataGrid>

</Grid>

where Custdetails.. is something like this..

class Customer
{
    public string LName { set; get; }
    public string FName { set; get; }
    public string City { set; get; }
}

DataBinding…

List<Customer> customers = new List<Customer>
                                    {
                                        new Customer { LName="Alan", FName="Ameen", City="New York" },
                                        new Customer { LName="Forgeard", FName="Steven", City="Mumbai" },
                                        new Customer { LName="Angur", FName="Paul", City="São Paulo" }
                                    };
dgCustDetails.ItemsSource = customers;

This would display the header tooltips… To make it dynamic.. Replace the ToolTip Content with Binding & the desired value…