Vaccano
Vaccano

Reputation: 82467

WPF Style to have a different color in the template when the ControlTemplate object is disabled

Say I have a style that looks like this:

<Style TargetType="{x:Type ScrollBar}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ScrollBar}">
                <Grid x:Name="Bg" Background="Grey">

                    <!-- Non-Relevant Stuff Here -->

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

And I want the grid background to be Red when the scrollbar is disabled. I could do this:

<Style TargetType="{x:Type ScrollBar}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ScrollBar}">
                <Grid x:Name="Bg" Background="Grey">

                    <!-- Non-Relevant Stuff Here -->

                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="IsEnabled" Value="False">
          <Setter Property="Template">
            <Setter.Value>
               <ControlTemplate TargetType="{x:Type ScrollBar}">
                   <Grid x:Name="Bg" Background="Red">

                       <!-- Non-Relevant Stuff Here -->

                   </Grid>
               </ControlTemplate>
           </Setter.Value>
        </Trigger>
    </Style.Triggers>
</Style>

But that duplicates all of my template. So now any changes have to be done in two places.

How can I get this trigger to allow me to change just the background of the grid in the template?

(Note: Adding a Setter for the Background property of the on the actual ScrollBar does not have any effect.)

Upvotes: 0

Views: 446

Answers (2)

John Bowen
John Bowen

Reputation: 24453

Just put the Trigger in the ControlTemplate instead of the Style:

<Style TargetType="{x:Type ScrollBar}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ScrollBar}">
                <Grid x:Name="Bg" Background="Grey">

                    <!-- Non-Relevant Stuff Here -->

                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsEnabled" Value="False">
                      <Setter TargetName="Bg" Property="Template" Value="Red"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Upvotes: 1

Kent Boogaart
Kent Boogaart

Reputation: 178780

You need to have your template reach out to obtain the value for the background from elsewhere, generally a property on the control. For example:

<Grid x:Name="Bg" Background="{TemplateBinding Background}">

Then your style trigger can simply change the Background property instead:

<Setter Property="Background" Value="Gray"/>

You will also likely want to set the default value for the background in your style. So you'll end up with something like this:

<Style TargetType="{x:Type ScrollBar}">
    <Setter Property="Background" Value="Gray"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ScrollBar}">
                <Grid x:Name="Bg" Background="{TemplateBinding Background}">

                    <!-- Non-Relevant Stuff Here -->

                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="IsEnabled" Value="False">
            <Setter Property="Background" Value="Red"/>
        </Trigger>
    </Style.Triggers>
</Style>

Upvotes: 2

Related Questions