|
1 | 1 | # WPF-GridControl-ToolTip |
2 | | -This repository contains the sample which shows add or remove the tooltip to a specific cell or row or column in WPF GridControl. |
| 2 | + |
| 3 | +This repository contains the sample which shows add or remove the tooltip to a specific cell or row or column in [WPF GridControl](https://help.syncfusion.com/wpf/gridcontrol/overview). |
| 4 | + |
| 5 | +### ToolTip for row and column |
| 6 | + |
| 7 | +ToolTip can be displayed for any row or column by setting the [ShowToolTip](https://help.syncfusion.com/cr/wpf/Syncfusion.Windows.Controls.Grid.GridStyleInfo.html#Syncfusion_Windows_Controls_Grid_GridStyleInfo_ShowTooltip) and ToolTip text can be customized by setting the [ToolTip](https://help.syncfusion.com/cr/wpf/Syncfusion.Windows.Controls.Grid.GridStyleInfo.html#Syncfusion_Windows_Controls_Grid_GridStyleInfo_ToolTip). |
| 8 | + |
| 9 | +``` csharp |
| 10 | +//Adding tooltip to the specific row |
| 11 | +gridcontrol.Model.RowStyles[1].ToolTip = "First row"; |
| 12 | +gridcontrol.Model.RowStyles[1].ShowTooltip = true; |
| 13 | + |
| 14 | +//Adding tooltip to the specific column |
| 15 | +gridcontrol.Model.ColStyles[1].ToolTip = "First column"; |
| 16 | +gridcontrol.Model.ColStyles[1].ShowTooltip = true; |
| 17 | +``` |
| 18 | + |
| 19 | +### Set ToolTip in QueryCellInfo event |
| 20 | + |
| 21 | +You can set the ToolTip to a specific cell or row or column by using the [QueryCellInfo](https://help.syncfusion.com/cr/wpf/Syncfusion.Windows.Controls.Grid.GridControlBase.html#Syncfusion_Windows_Controls_Grid_GridControlBase_QueryCellInfo) event. |
| 22 | + |
| 23 | +``` csharp |
| 24 | +private void Gridcontrol_QueryCellInfo(object sender, GridQueryCellInfoEventArgs e) |
| 25 | +{ |
| 26 | + e.Style.ShowTooltip = true; |
| 27 | + //Show tooltip for specific index |
| 28 | + if (e.Cell.RowIndex == 1 && e.Cell.ColumnIndex == 1) |
| 29 | + e.Style.ToolTip = " Grid (" + gridcontrol.Model[1, 1].CellValue +") "; |
| 30 | + // Show tooltip for row. |
| 31 | + if (e.Cell.ColumnIndex > 0 && e.Cell.RowIndex == 5) |
| 32 | + e.Style.ToolTip = " Row " + "(" + e.Cell.RowIndex + "," + e.Cell.ColumnIndex + ") "; |
| 33 | + // Show tooltip for column. |
| 34 | + if (e.Cell.RowIndex > 0 && e.Cell.ColumnIndex == 4) |
| 35 | + e.Style.ToolTip = " Column " + "(" + e.Cell.RowIndex + "," + e.Cell.ColumnIndex + ") "; |
| 36 | +} |
| 37 | +``` |
| 38 | + |
| 39 | +### Hide ToolTip for disabled cell |
| 40 | + |
| 41 | +You can disable the cell by setting `Enabled` property to `false`. If you want to hide the tooltip for this disabled cell, you need to set the [ShowToolTip](https://help.syncfusion.com/cr/wpf/Syncfusion.Windows.Controls.Grid.GridStyleInfo.html#Syncfusion_Windows_Controls_Grid_GridStyleInfo_ShowTooltip) property to `false`. |
| 42 | + |
| 43 | +``` csharp |
| 44 | +gridcontrol.Model[1, 1].Enabled = false; |
| 45 | +gridcontrol.Model[1, 1].ToolTip = " Grid (" + gridcontrol.Model[1, 1].CellValue + ") "; |
| 46 | +gridcontrol.Model[1, 1].ShowTooltip = false; |
| 47 | + |
| 48 | +//Using QueryCellInfo |
| 49 | +private void Gridcontrol_QueryCellInfo(object sender, GridQueryCellInfoEventArgs e) |
| 50 | +{ |
| 51 | + if (e.Cell.RowIndex == 1 && e.Cell.ColumnIndex == 1) |
| 52 | + { |
| 53 | + e.Style.Enabled = false; |
| 54 | + e.Style.ToolTip = " Grid (" + e.Cell.RowIndex + "," + e.Cell.ColumnIndex + ") "; |
| 55 | + e.Style.ShowTooltip = false; |
| 56 | + } |
| 57 | +} |
| 58 | +``` |
| 59 | + |
| 60 | +### Customize the ToolTip |
| 61 | + |
| 62 | +The tooltip appearance can be customized by defining DataTemplate. The DataTemplate can be assigned to the GridStyleInfo.ToolTipTemplateKey or GridStyleInfo.ToolTipTemplate property. If you are using tooltipTemplate1 then you need to assign template to its corresponding template key property namely GridStyleInfo.ToolTipTemplate or GridStyleInfo.ToolTipTemplateKey. |
| 63 | + |
| 64 | +GridStyleInfo which holds cell information is the DataContext for data template of ToolTip. |
| 65 | + |
| 66 | +#### XAML |
| 67 | + |
| 68 | +``` xml |
| 69 | +<Window.Resources> |
| 70 | + <DataTemplate x:Key="tooltipTemplate1"> |
| 71 | + <Border Name="Border" |
| 72 | + Background="Green" |
| 73 | + BorderBrush="Black" |
| 74 | + BorderThickness="1" Width="60" Height="20" |
| 75 | + CornerRadius="0"> |
| 76 | + <TextBlock Background="Transparent" Text="{Binding Path=ToolTip}" Padding="2" /> |
| 77 | + </Border> |
| 78 | + </DataTemplate> |
| 79 | +</Window.Resources> |
| 80 | +``` |
| 81 | + |
| 82 | +#### Using ToolTipTemplateKey |
| 83 | + |
| 84 | +``` csharp |
| 85 | +//Set the template key to a particular index |
| 86 | +gridcontrol.Model[1, 1].TooltipTemplateKey = "tooltipTemplate1"; |
| 87 | + |
| 88 | +//Using QueryCellInfo event |
| 89 | +private void Gridcontrol_QueryCellInfo(object sender, GridQueryCellInfoEventArgs e) |
| 90 | +{ |
| 91 | + if (e.Cell.RowIndex == 1 && e.Cell.ColumnIndex == 1) |
| 92 | + { |
| 93 | + e.Style.ToolTip = " Grid (" + e.Cell.RowIndex + "," + e.Cell.ColumnIndex + ") "; |
| 94 | + e.Style.TooltipTemplateKey = "tooltipTemplate1"; |
| 95 | + } |
| 96 | +} |
| 97 | +``` |
| 98 | + |
| 99 | +#### Using ToolTipTemplate |
| 100 | + |
| 101 | +``` csharp |
| 102 | +//Set the template key to a particular index |
| 103 | +gridcontrol.Model[1, 1].TooltipTemplate = (DataTemplate)this.Resources["tooltipTemplate1"]; |
| 104 | + |
| 105 | +//Using QueryCellInfo event |
| 106 | +private void Gridcontrol_QueryCellInfo(object sender, GridQueryCellInfoEventArgs e) |
| 107 | +{ |
| 108 | + if (e.Cell.RowIndex == 1 && e.Cell.ColumnIndex == 1) |
| 109 | + { |
| 110 | + e.Style.ToolTip = " Grid (" + e.Cell.RowIndex + "," + e.Cell.ColumnIndex + ") "; |
| 111 | + e.Style.TooltipTemplate = (DataTemplate)this.Resources["tooltipTemplate1"]; |
| 112 | + } |
| 113 | +} |
| 114 | +``` |
| 115 | + |
| 116 | + |
0 commit comments