Trigger doesn't work on ToggleButton.IsChecked property - c#

Here is a simple XAML with trigger that should change ToggleButton content when it is checked. But for some reason it doesn't work. I have a silly feeling that I missed something extra small. Appreciate your help
<ToggleButton Content="<">
<ToggleButton.Style>
<Style TargetType="ToggleButton">
<Style.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter Property="Content" Value=">" />
</Trigger>
</Style.Triggers>
</Style>
</ToggleButton.Style>
</ToggleButton>

You must move Content="<" from ToggleButton to setter of Style.
Example:
<ToggleButton>
<ToggleButton.Style>
<Style TargetType="ToggleButton">
<Setter Property="Content" Value="<" />
<Style.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter Property="Content" Value=">" />
</Trigger>
</Style.Triggers>
</Style>
</ToggleButton.Style>
</ToggleButton>
Because local value has higher precedence order over Style setters and triggers:
Property system coercion.
Active animations, or animations with a Hold behavior.
3. Local value.
TemplatedParent template properties.
Implicit style.
6. Style triggers.
Template triggers.
8. Style setters.
...
For more information, please see:
MSDN: Dependency Property Value Precedence

You are overriding the Content set by the Trigger by setting the Content attribute at the control level. You want to set it using a Setter within the Style instead:
<ToggleButton>
<ToggleButton.Style>
<Style TargetType="ToggleButton">
<Setter Property="Content" Value="<" />
<Style.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter Property="Content" Value=">" />
</Trigger>
</Style.Triggers>
</Style>
</ToggleButton.Style>
</ToggleButton>

Related

Hover effect in style doesn't work (ToolBarPanel) - WPF c#

I have a toolbarpanel which I've made a custom style.
<Window.Resources>
<Style x:Key="toolbar_opciones" TargetType="{x:Type ToolBarPanel}">
<Setter Property="Background" Value="DeepSkyBlue"/> <!-- does not work -->
<Setter Property="Cursor" Value="Hand"/>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="CadetBlue"/>
</Trigger> <!-- does not work -->
</Style.Triggers>
</Style>
</Window.Resources>
<ToolBarPanel Style="{StaticResource toolbar_opciones}"/>
The cursor works but the background property no, why?
I tested your code, and here is the fix
<ToolBarPanel Style="{StaticResource toolbar_opciones}"/>
look at it closely, you were missing the double quotation which close the Style attribute. When I added it to the XAML, the Background has been applied.
Cheers.

Change background of toolkit:TimePicker?

I'm using toolkit:TimePicker in WPF as code below
<toolkit:TimePicker x:Name="datetimeBeginBackup"
Format="Custom"
FormatString="HH:mm:ss"
TextAlignment="Center"
Foreground="#FFFFFF">
<toolkit:TimePicker.Style>
<Style TargetType="toolkit:TimePicker">
<Setter Property="Background">
<ImageBrush ImageSource="Resources\backup_date_time_picker_bgr.png"/>
</Setter>
<Style.Triggers>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Background">
<ImageBrush ImageSource="Resources\backup_date_time_picker_disable_bgr.png"/>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
</toolkit:TimePicker.Style>
</toolkit:TimePicker>
When the datetimeBeginBackup is disable, the background will be changed with "backup_date_time_picker_disable_bgr.png", it is ok. But the background of TextBlock Time is white, this make user hard to see the text. I want to change the background of TextBlock Time, but I don't know to do it.
Someone can help me?
Many Thanks,
T&T
Move Foreground default value in setter and on trigger IsEnabled, change Foreground to desired value say Black using Style setter.
<toolkit:TimePicker x:Name="datetimeBeginBackup"
Format="Custom"
FormatString="HH:mm:ss"
TextAlignment="Center">
<toolkit:TimePicker.Style>
<Style TargetType="toolkit:TimePicker">
<Setter Property="Foreground" Value="#FFFFFF"/>
<Setter Property="Background">
<ImageBrush ImageSource="Resources\backup_date_time_picker_bgr.png"/>
</Setter>
<Style.Triggers>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Background">
<ImageBrush ImageSource="Resources\backup_date_time_picker_disable_bgr.png"/>
</Setter>
<Setter Property="Foreground" Value="#000000"/>
</Trigger>
</Style.Triggers>
</Style>
</toolkit:TimePicker.Style>
</toolkit:TimePicker>

Change Button Background when is not enabled

I need to change my Button background (as SolidColorBrush for example) only when it is not enabled (IsEnabled == false). How can I do?
Have I to modify the Button Style using the XAML or can I do this work programmatically? What is the correct XAML code, to change only the Background when it is not enabled?
I tried the following XAML code but it has no effect:
<Button>
<Button.Style>
<Style TargetType="Button">
<Style.Triggers>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Background" Value="Red"></Setter>
</Trigger>
</Style.Triggers>
</Style>
</Button.Style>
</Button>
You can change the background by editing the template. You'll find the default template for Button here.
In the trigger for IsEnabled you can simply add something like this:
<Setter Property="Background" Value="{StaticResource DisabledBackgroundBrush}"/>
EDIT:
Try this instead then;
<Window.Resources>
<Style TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border x:Name="Overlay" CornerRadius="2">
<ContentPresenter/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter TargetName="Overlay" Property="Background" Value="Red"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<StackPanel>
<Button Content="Button" IsEnabled="False"/>
</StackPanel>
Just change it to suit your needs.
You can use a Style trigger:
<Image.Style>
<Style>
<Style.Triggers>
<DataTrigger Binding="{Binding IsEnabled}" Value="False">
<Setter Property="Image.Source" Value="pack://application:,,,/disabled.png" />
</DataTrigger>
</Style.Triggers>
</Style>
</Image.Style>

DataTemplate check if Binding exist

I had make an Button Style as DataTemplate in a ResourceDictionary. Here a small part:
<Style TargetType="{x:Type Button}">
<Setter Property="Focusable" Value="False"></Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border x:Name="border">
...
</Border>
<ControlTemplate.Triggers>
<DataTrigger Binding="{Binding IsSelected}" Value="True">
<Setter Property="Background" TargetName="border" Value="Red" />
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
In this Template a have a binding to a Propertie IsSelected. This Propertie is in one situation there and in a other not.
Is it possible to Check in Xaml if the binding path exist, then use it in other case forget it?
Now i had BindingExpression in the Debug output and i want to eliminate this.
The more pertinent question is: why do you have a DataTrigger in your ControlTemplate? This creates a dependency between the control and its data context, which is why you're experiencing this issue when your data context does not match the control template's expectations.
Are you certain you cannot use a more suitable mechanism? For example, could you instead use a style for those buttons where IsSelected should affect the Background?
<Style x:Key="SpecialButtonStyle" TargetType="Button">
<Style.Triggers>
<DataTrigger Binding="{Binding IsSelected}" Value="True">
<Setter Property="Background" Value="Red" />
</DataTrigger>
</Style.Triggers>
</Style>
...
<Button DataContext="relevant data context" Style="{StaticResource SpecialButtonStyle}"/>
Or, even better, could you define a data template for the specific data class you have that has the IsSelected property? This data template could automatically use the correct Button style.

Unable to style WPF ComboBox on Mouse Hover

Does anyone know how to style the background property of a WPF ComboBox when a mouse is hovering on top of it?
I cannot get rid of the blue-ish button like background off the ComboBox.
You can style it like anything else:
<Style TargetType="{x:Type ComboBox}" x:Key="HoverBox">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="Blue" />
</Trigger>
</Style.Triggers>
</Style>
usage:
<ComboBox Style="{StaticResource HoverBox}" ... />
And at the top of your UserControl/ Window you have to place the style:
<UserControl...>
<UserControl.Resources>
<Style TargetType="{x:Type ComboBox}" x:Key="HoverBox">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="Blue" />
</Trigger>
</Style.Triggers>
</Style>
</UserControl.Resources>
[CONTENT HERE]
</UserControl>
It will not work.Its because of the default control template of ComboBox.You may need to override the default template for this behavior.Have a look at
MouseOver highlighting style returning to default after a second (Caused by Aero?)
http://social.expression.microsoft.com/Forums/en/blend/thread/b210978c-24e8-431b-916b-a40a752b990c
http://social.msdn.microsoft.com/Forums/en/wpf/thread/a18891e9-8879-4819-9679-247341782f60

Categories

Resources