WPF：样式化ContentControl

Question

I would like to create a style that could be applied to any ContentControl which would take the ToolTip and add an image to the ContentControl and apply the tool tip text from the object to the image. I have about a hundred of these that need to be done (in various projects) so being able to create a style would save a lot of typing.

What I am trying to recreate is this (ToolTip text is on the blue 'i' and not the 'Reload Employee Data':

which is accomplished via the following:

<StackPanel Orientation="Horizontal">
    <CheckBox Content="Reload Employee Data"
              IsChecked="{Binding AdjustmentSettings.ReloadEmployeeData}" 
              Grid.Row="0"
              Grid.Column="0">
    </CheckBox>
    <Image Source="/DelphiaLibrary;Component/Resources/info.ico" 
           ToolTip="Check if you want to re-upload ..."/>
</StackPanel>

What I am trying to avoid is creating a new stack panel each time I want to add the blue 'i' with the tool tip text on the 'i' and not on the text of the object.

I was able to create the following that works for a Label:

    <!-- Works for just Label -->
    <Style x:Key="LabelToolTipStyle"
           TargetType="{x:Type Label}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Label">
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Text="{TemplateBinding Content}" />
                        <Image Source="info.ico" ToolTip="{TemplateBinding ToolTip}"/>
                    </StackPanel>

                </ControlTemplate>                    
            </Setter.Value>
        </Setter>
    </Style>

And I can call this simply by adding the style to the label like so:

<Label Content="First Text" Style="{StaticResource LabelToolTipStyle}" ToolTip="Label with LabelToolTipStyle" />

I then tried to make this more generalized by creating a style targeting ContentControl but obviously doesn't work because this overrides the entire template (in the case of CheckBox control, the checkbox is missing):

    <!-- Works on Label but not CheckBox -->
    <Style x:Key="ContentToolTipStyle"
           TargetType="{x:Type ContentControl}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ContentControl">
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Text="{TemplateBinding Content}" />
                        <Image Source="info.ico" ToolTip="{TemplateBinding ToolTip}"/>
                    </StackPanel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

Is there a way that I could create a style for ContentControls that would allow me to ADD to the template without redefining the entire template? If it cannot be done to ContentControl I wouldn't be opposed to creating a separate style for each control type but would like to avoid redefining the entire template to do so.

Answer 1

You are almost there. You need to create a custom control template for a ContentControl :

<Style x:Key="ToolTipWrapper" TargetType="{x:Type ContentControl}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ContentControl}">
                <StackPanel Orientation="Horizontal">
                    <StackPanel.ToolTip>
                        <ToolTip Visibility="Hidden" />
                    </StackPanel.ToolTip>
                    <ContentPresenter />
                    <Image Source="info.ico" ToolTip="{TemplateBinding ToolTip}" />
                </StackPanel>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Then wrap your elements in a ContentControl and apply the style:

<ContentControl Style="{StaticResource ToolTipWrapper}" ToolTip="Hello world">
    <CheckBox Content="I am a check box" />
</ContentControl>

What you can't do is to automatically apply the custom style to all "content" controls: you will always need the extra ContentControl wrapped around each element you want to style in this way.