WPF ComboBox – Tooltip for each item

Many readers ask me a question regarding how we can add a tooltip for each item of ComboBox in WPF. Here I am presenting a very simple solution.

In the below example, I am creating a simple combobox. ComboBox DataTemplate defines a ListBoxItem for each item in combobox. ListBoxItem has both Content and Tooltip property.  As we cannot use String.Format in Tooltip binding, we must create a property in the view model to show our custom data.

Below is the example:

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:WpfApplication1"
        Title="ComBoxBox Tooltip Example" Height="350" Width="525">
    <Window.Resources>
        <local:MainViewModel x:Key="MainVM" />
    </Window.Resources>
    <StackPanel DataContext="{StaticResource MainVM}">
        <ComboBox Margin="50" Height="30" Width="200" ItemsSource="{Binding Employees}">
            <ComboBox.ItemTemplate>
                <DataTemplate>
                    <ListBoxItem Content="{Binding Name}" ToolTip="{Binding IsMarriedTooltip}" >
                    </ListBoxItem>
                </DataTemplate>
            </ComboBox.ItemTemplate>
        </ComboBox>
    </StackPanel>
</Window>

using System;
using System.Collections.ObjectModel;

namespace WpfApplication1
{
    public class MainViewModel
    {
        ObservableCollection<Employee> employees;

        public MainViewModel()
        {
            employees = new ObservableCollection<Employee>();
            LoadEmployees();
        }

        public ObservableCollection<Employee> Employees
        {
            get
            {
                return employees;
            }
        }

        public void LoadEmployees()
        {
            employees.Add(new Employee { Name = "Kapil Malhotra", IsMarried = true });
            employees.Add(new Employee { Name = "James Landridge", IsMarried = false });
            employees.Add(new Employee { Name = "Swati Gupta", IsMarried = true });
            employees.Add(new Employee { Name = "Lory", IsMarried = false });

        }
    }

    public class Employee
    {
        public string Name { get; set; }
        public bool IsMarried { get; set; }

        public string IsMarriedTooltip
        {
            get
            {
                return "Is Married: " + IsMarried;
            }
        }
    }
}

In the above example, I have created a “IsMarriedTooltip” property in the MainViewModel class. In the property, I have set the property with custom string (“IsMarried: ” + IsMarried). In the XAML, I have binded IsMarriedTooltip property to ToolTip property of ListBoxItem.

Below is the screenshot.

I hope you like the above post. Kindly post your more questions in the Comments area.