Search code examples
c#.netsilverlightxamltooltip

How to add a tooltip for a datagrid header, where the header text is generated dynamically?


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?


Solution

  • 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...