Skip to content

Commit 922d6b0

Browse files
ES-975464 - Resolve the ReadMe file length issue in this sample repository
1 parent ab93e57 commit 922d6b0

2 files changed

Lines changed: 115 additions & 1 deletion

File tree

Customize_the_ToolTip.png

30.6 KB
Loading

README.md

Lines changed: 115 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,116 @@
11
# 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+
![alt text](Customize_the_ToolTip.png)

0 commit comments

Comments
 (0)