简体   繁体   中英

Can't change properties of ControlTemplate at runtime

I have a custom 3 state Button that is supposed to cycle between 3 different states (colours) as it is clicked. However the click handler I've written doesn't have any effect on the background colour of the Border within the ControlTemplate .

I'm probably missing something very simple, but I'd really appreciate a fresh pair of eyes to spot what it may be.

The ControlTemplate and Button.Click handler are below:

<Style x:Key="FilterButtonStyle"  TargetType="{x:Type local:FilterButton}"
           BasedOn="{StaticResource {x:Type Button}}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border x:Name="ButtonBackground" BorderThickness="0" Padding="0"
                    Margin="0" CornerRadius="6"
                    Background="{StaticResource blueShader}" >
                    <ContentPresenter HorizontalAlignment="Center"
                        VerticalAlignment="Center"/>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Effect" Value="{StaticResource glowShadow}">
                        </Setter>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="Foreground" Value="{StaticResource textBrush}"/>
    <Setter Property="Margin" Value="4,4,0,4"></Setter>
    <Setter Property="Padding" Value="4"></Setter>
    <Setter Property="Height" Value="55"></Setter>
    <Setter Property="Width" Value="55"></Setter>
    <Setter Property="FontSize" Value="10"/>
    <Setter Property="FontWeight" Value="Normal"/>
    <Setter Property="TextBlock.TextWrapping" Value="Wrap"></Setter>
    <Setter Property="HasDisabledState" Value="True"></Setter>
    <Setter Property="OnColour" Value="{StaticResource greenShader}"></Setter>
    <Setter Property="OffColour" Value="{StaticResource blueShader}"></Setter>
    <Setter Property="DisabledColour" Value="{StaticResource redShader}"></Setter>
</Style>
private void FilterButton_Click(object sender, RoutedEventArgs e)
{
    if (!this.CanChangeState) { return; }

    // Get child border element.
    Border border = this.Template.LoadContent() as Border;

    // Cycle through button states.
    switch (this.ButtonState)
    {
        case ButtonStates.Off:
            this.ButtonState = ButtonStates.On;
            border.Background = this.OnColour;
            break;

        case ButtonStates.On:
            if (this.HasDisabledState)
            {
                this.ButtonState = ButtonStates.Disabled;
                border.Background = this.DisabledColour;
            }
            else
            {
                this.ButtonState = ButtonStates.Off;
                border.Background = this.OffColour;
            }
            break;

        case ButtonStates.Disabled:
            this.ButtonState = ButtonStates.Off;
            border.Background = this.OffColour;
            break;
    }
}

Never mind, I found that a better way of handling this was to use ControlTemplate triggers to change the Button colour based on the ButtonState property.

    <Style x:Key="FilterButtonStyle"  TargetType="{x:Type local:FilterButton}"
       BasedOn="{StaticResource {x:Type Button}}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border x:Name="ButtonBackground" BorderThickness="0" Padding="0" Margin="0" CornerRadius="6"
                    Background="{StaticResource blueShader}" >
                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Effect" Value="{StaticResource glowShadow}">
                        </Setter>
                    </Trigger>
                    <Trigger Property="local:FilterButton.ButtonState" Value="On">
                        <Setter TargetName="ButtonBackground" Property="Background" Value="{StaticResource greenShader}"></Setter>
                    </Trigger>
                    <Trigger Property="local:FilterButton.ButtonState" Value="Off">
                        <Setter TargetName="ButtonBackground" Property="Background" Value="{StaticResource blueShader}"></Setter>
                    </Trigger>
                    <Trigger Property="local:FilterButton.ButtonState" Value="Disabled">
                        <Setter TargetName="ButtonBackground" Property="Background" Value="{StaticResource redShader}"></Setter>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="Foreground" Value="{StaticResource textBrush}"/>
    <Setter Property="Margin" Value="4,4,0,4"></Setter>
    <Setter Property="Padding" Value="4"></Setter>
    <Setter Property="Height" Value="55"></Setter>
    <Setter Property="Width" Value="55"></Setter>
    <Setter Property="FontSize" Value="10"/>
    <Setter Property="FontWeight" Value="Normal"/>
    <Setter Property="TextBlock.TextWrapping" Value="Wrap"></Setter>
    <Setter Property="HasDisabledState" Value="True"></Setter>
</Style>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM