Backgroundcolor of entire ToolTip

Question

Does anyone know a simple XAML solution to change the entire background of a ToolTip?

I did the following:

<Image Height="16" Source="Images/Icons/Add2.png" Stretch="Fill" Width="16" Opacity="0.99" Grid.Column="0">
    <Image.ToolTip>
        <Grid Background="#000000">
             <Grid.RowDefinitions>
                <RowDefinition />
                <RowDefinition />
             </Grid.RowDefinitions>
             <TextBlock Text="Header1" FontSize="15" Grid.Row="0"/>
             <TextBlock Text="Subitem" FontSize="12" Grid.Row="1"/>
         </Grid>
    </Image.ToolTip>
</Image>

But the result looks like that:

Any suggestions?

Answer 1

The problem is that all you're really doing is setting the CONTENT of the tooltip, not the tooltip itself.

So you'll need to style the tooltip to make this happen. There are some ways to do it with resources as seen in this post:

WPF- Changing Tooltip background to Transparent

or you can change your code to wrap that grid with an explicit ToolTip and set its background property:

<Image.ToolTip>
    <ToolTip Background="Black">
        <Grid>
            ...
        </Grid>
    </ToolTip>
</Image.ToolTip>

Answer 2

To set the tooltip background you can override the style of the tooltip for the parent control. Below is your code with added style.

<Image Height="16" Source="Images/Icons/Add2.png" Stretch="Fill" Width="16" Opacity="0.99" Grid.Column="0">
    <Image.Resources>
        <Style TargetType="ToolTip" BasedOn="{StaticResource {x:Type ToolTip}}">
            <Setter Property="Background" Value="#000000" />
        </Style>
    </Image.Resources>
    <Image.ToolTip>
        <Grid>
             <Grid.RowDefinitions>
                <RowDefinition />
                <RowDefinition />
             </Grid.RowDefinitions>
             <TextBlock Text="Header1" FontSize="15" Grid.Row="0"/>
             <TextBlock Text="Subitem" FontSize="12" Grid.Row="1"/>
         </Grid>
    </Image.ToolTip>
</Image>