diff --git a/README.md b/README.md index f4b49a4..b18ee1d 100644 --- a/README.md +++ b/README.md @@ -1,2 +1,41 @@ -# How to customize the tooltip using DataTemplate in winui datagrid? -This repository explains how to customize the tooltip using DataTemplate in winui datagrid. +# How to customize the tooltip using DataTemplate in WinUI DataGrid + +This repository explains how to customize the tooltip using DataTemplate in [WinUI DataGrid](https://www.syncfusion.com/winui-controls/datagrid) (SfDataGrid). + +You can customize the appearance of the ToolTip for particular column by setting `GridColumn.ToolTipTemplate`. And you can also customize the appearance of header ToolTip for particular column by [GridColumn.HeaderToolTipTemplate](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Grids.GridColumnBase.html#Syncfusion_UI_Xaml_Grids_GridColumnBase_HeaderToolTipTemplate) property. + +#### XAML + +``` xml + + + + + + + + + + + + +``` + +#### C# + +``` csharp +public class StringToImageConverter : IValueConverter +{ + public object Convert(object value, Type targetType, object parameter, string language) + { + string imagename = value.ToString(); + return "Assets/" + imagename + @".png"; + } + public object ConvertBack(object value, Type targetType, object parameter, string language) + { + return value; + } +} +``` + +![customize the tooltip](customize_the_tooltip.png) \ No newline at end of file diff --git a/customize_the_tooltip.png b/customize_the_tooltip.png new file mode 100644 index 0000000..ffddc98 Binary files /dev/null and b/customize_the_tooltip.png differ