DataTrigger not working on CheckBox - wpf

I have the following DataTrigger in a WPF form:
<CheckBox IsChecked="{Binding ConcentratorViewModel.Integrated}">
<CheckBox.Style>
<Style TargetType="{x:Type CheckBox}">
<Setter Property="Margin" Value="0,10,0,0"/>
<Setter Property="Width" Value="20"/>
<Setter Property="VerticalAlignment" Value="Center"/>
<!--<Setter Property="IsEnabled" Value="False"/>-->
<!--<Setter Property="IsChecked" Value="False"/>-->
<Style.Triggers>
<DataTrigger Binding="{Binding ConcentratorViewModel.Manufacturer}" Value="ZIV">
<Setter Property="Background" Value="Red"/>
<Setter Property="IsChecked" Value="True"/>
</DataTrigger>
<DataTrigger Binding="{Binding ConcentratorViewModel.Manufacturer}" Value="Landis+Gyr">
<Setter Property="IsChecked" Value="False"/>
</DataTrigger>
</Style.Triggers>
</Style>
</CheckBox.Style>
</CheckBox>
The CheckBox must be Checked or Unchecked depending on the selected manufacturer. I added a converter to see the value on the trigger and it's correct. I've also added the Background property and it changes correctly, but the IsChecked doesn't work.

Well you need to move the IsChecked Binding inside the Style. Setting it directly on the Checkbox gives it precedence and the Trigger's cannot change that value.
So something like:
<CheckBox>
<CheckBox.Style>
<Style TargetType="{x:Type CheckBox}">
<Setter Property="Margin"
Value="0,10,0,0" />
<Setter Property="Width"
Value="20" />
<Setter Property="VerticalAlignment"
Value="Center" />
<Setter Property="IsChecked"
Value="{Binding ConcentratorViewModel.Integrated}" />
<Style.Triggers>
<DataTrigger Binding="{Binding ConcentratorViewModel.Manufacturer}"
Value="ZIV">
<Setter Property="Background"
Value="Red" />
<Setter Property="IsChecked"
Value="True" />
</DataTrigger>
<DataTrigger Binding="{Binding ConcentratorViewModel.Manufacturer}"
Value="Landis+Gyr">
<Setter Property="IsChecked"
Value="False" />
</DataTrigger>
</Style.Triggers>
</Style>
</CheckBox.Style>
</CheckBox>
Note:
Remember by doing this, your Binding only applies when the DataTrigger's do not evaluate to "True". Thus if your Manufacturer property is "ZIV" or "Landis+Gyr" then your Integrated property is not going to see any CheckBox updates even with a TwoWay binding as it just isn't being used.

Related

Devexpress- Background and grid lines in a gridcontrol

I have run into a few issues with gridcontrol.
I have to style and format a grid column with padding,colors,fonts and hover effects.
<Style x:Key="SelectedRowStyle" TargetType="{x:Type dxg:RowControl}">
<Setter Property="Foreground" Value="Black" />
<Setter Property="FontFamily" Value="pack://application:,,,/PA.Tos.UI;component/ResourceDictionaries/#Brandon Grotesque Black" />
<Setter Property="FontSize" Value="12" />
<Setter Property="FontWeight" Value="Regular" />
<Style.Triggers>
<DataTrigger Binding="{Binding
ElementName=GroupCodeListView,Path=DataContext.SelectedGroupCode.Deleted,
UpdateSourceTrigger=PropertyChanged}" Value="true">
<Setter Property="Background" Value="Red" />
<Setter Property="Foreground" Value="Black" />
</DataTrigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="{StaticResource HoverRowBorderColor}" />
<Setter Property="Foreground" Value="Black" />
</Trigger>
<Trigger Property="dxg:GridViewBase.IsFocusedRow" Value="True">
<Setter Property="Background" Value="{StaticResource HoverRowBorderColor}" />
<Setter Property="BorderBrush" Value="{StaticResource HoverStrokeColor}" />
<Setter Property="BorderThickness" Value="1" />
<Setter Property="Foreground" Value="Black" />
</Trigger>
</Style.Triggers>
</Style>
<Style x:Key="CustomCellStyle" BasedOn="{StaticResource {dxgt:GridRowThemeKey
ResourceKey=LightweightCellStyle}}" TargetType="{x:Type dxg:LightweightCellEditor}">
<Setter Property="MaxHeight" Value="25"/>
<Setter Property="MinHeight" Value="25"/>
<Style.Triggers>
</Style.Triggers>
In response to a mouse hover or row selection, i have to set the border blue across all grid lines. Only the bottom grid line is blue as of
now from the above. Code applicable to cellcontent presenter won't be possible here.
In response to a trash icon clicked, i have to display light red background for the particular row.
I bind (viewmodel property)SelectedGroupCode.Deleted=true to the background.The binding is shown in the code.
but all rows are painted red except the row in question.
The grid lines width has to be set. i have managed to set it for the horizontal lines only using gridrowthemekey_rowcontrolcontainertemplate.
I assure you i have read through some previous threads but its taking too much time for a scrum sprint.
What is missing?
If you want to change the cell style in response to a mouse hover then you can use RelativeSource markup extension in DataTrigger's binding. If you want to check whether the row is focused, then you can use RowData.IsFocused property.
Here is example:
<Style x:Key="CustomCellStyle" TargetType="{x:Type dxg:LightweightCellEditor}" BasedOn="{StaticResource {dxgt:GridRowThemeKey ResourceKey=LightweightCellStyle}}">
<Style.Triggers>
<DataTrigger Binding="{Binding IsMouseOver, RelativeSource={RelativeSource AncestorType={x:Type dxg:RowControl}}}" Value="True">
<Setter Property="BorderBrush" Value="Blue" />
</DataTrigger>
<DataTrigger Binding="{Binding RowData.IsFocused}" Value="true">
<Setter Property="BorderBrush" Value="Blue" />
</DataTrigger>
</Style.Triggers>
</Style>
For displaying custom style for particular row I suggest you to use Conditional Formatting.
Here is example:
<dxg:GridControl ...>
...
<dxg:GridControl.View>
<dxg:TableView>
<dxg:TableView.FormatConditions>
<dxg:FormatCondition Expression="[Deleted]" FieldName="Profit">
<dxc:Format Foreground="Red"/>
</dxg:FormatCondition>
</dxg:TableView.FormatConditions>
</dxg:TableView>
</dxg:GridControl.View>
</dxg:GridControl>

Change ListView item base on condition

I have ListView with my object and one of my object properties is of bool value:
<GridViewColumn Width="100" Header="FileCheck " DisplayMemberBinding="{Binding IsFileOK}" />
Instead of displaying this variable value (true or false) how can I replace this with my own text and my own color ?
For example:
File is OK // green color
File damage // red color
This is what i have try:
<Style TargetType="ListViewItem">
<Style.Triggers>
<DataTrigger Binding="{Binding IsFileOK}" Value="false">
<Setter Property="Background" Value="Green" />
</DataTrigger>
<DataTrigger Binding="{Binding IsFileOK}" Value="true">
<Setter Property="Background" Value="Red" />
</DataTrigger>
</Style.Triggers>
</Style>
Try this one
<ListView.ItemContainerStyle>
<Style TargetType="{x:Type ListBoxItem}">
<Style.Triggers>
<DataTrigger Binding="{Binding IsFileOK}" Value="False">
<Setter Property="Background" Value="Green" />
</DataTrigger>
<DataTrigger Binding="{Binding IsFileOK}" Value="True">
<Setter Property="Background" Value="Red" />
</DataTrigger>
</Style.Triggers>
</Style>
</ListView.ItemContainerStyle>
Idea is to modify the background and text using Style and Triggers.
e.g.
<ListView.Resources>
<Style TargetType="ListViewItem">
<Setter Property="Background" Value="Blue"></Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="Red"></Setter>
</Trigger>
</Style.Triggers>
</Style>
</ListView.Resources>
So you can replace Trigger with DataTrigger to use properties from view model.
Use below code to achieve this,
<ListView.Resources>
<Style TargetType="ListViewItem">
<Setter Property="Background" Value="Blue"></Setter>
<Style.Triggers>
<DataTrigger Binding="{Binding IsFileOK}" Value="True">
<Setter Property="Background" Value="Red"></Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</ListView.Resources>

Change image and textblock foreground on TabItem = IsSelected

I have some TabItems, each one containg one image and a textblock. Here is the code:
<TabItem.Header>
<ContentControl>
<ContentControl.Template>
<ControlTemplate>
<StackPanel x:Name="sp" Orientation="Horizontal">
<Image x:Name="img" Source="img0.png"/>
<TextBlock x:Name="tb" Text="Tab1" VerticalAlignment="Center" Foreground="Green"/>
</StackPanel>
<ControlTemplate.Triggers>
<Trigger Property="TabItem.IsSelected" Value="True">
<Setter TargetName="img" Property="Source" Value="img1.png" />
<Setter TargetName="tb" Property="Foreground" Value="Red" />
<Setter Property="FontWeight" Value="Bold"/>
</Trigger>
<Trigger SourceName="sp" Property="IsMouseOver" Value="True">
<Setter TargetName="img" Property="Source" Value="img1.png" />
<Setter TargetName="tb" Property="Foreground" Value="Red" />
<Setter Property="FontWeight" Value="Bold"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</ContentControl.Template>
</ContentControl>
What I'm trying to achieve is to change the image's source and textblock's foreground value when the TabItem is selected. The IsMouseOver behaviour is working properly but the TabItem.IsSelected is not working as expected.
Basically this code is not doing what I'm thinking it should do:
<Trigger Property="TabItem.IsSelected" Value="True">
<Setter TargetName="img" Property="Source" Value="img1.png" />
<Setter TargetName="tb" Property="Foreground" Value="Red" />
<Setter Property="FontWeight" Value="Bold"/>
Please share your opinion.
Thank you.
You are trying to reach the IsSelected property of the TabItem from the TabItem.Header and that can't be accomplished with an ordinary Trigger. Instead, you need to use a DataTrigger so that you can Bind to the IsSelected property with a RelativeSource Binding:
<DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource AncestorType=
{x:Type TabItem}}}" Value="True">
<Setter TargetName="img" Property="Source"
Value="/WpfApplication1;component/Images/Tulips.jpg" />
<Setter TargetName="tb" Property="Foreground" Value="Red" />
<Setter Property="TextElement.FontWeight" Value="Bold"/>
</DataTrigger>

WPF listview. How to support simultaneously row background color and alternateIndex for this row

I have a listview that contains log messages. I want to set the background color for each row in listview according to the severity of its corresponding entry. I do this using DataTrigger (see the example).
I would also like to support AlternationIndex for listview.
How can I combine them in xaml DataTrigger abd Trigger for background color of row?
For set background color for row I use the following code:
<ListView ... >
<ListView.ItemContainerStyle>
<Style TargetType="{x:Type ListViewItem}">
<Style.Triggers>
<DataTrigger Binding="{Binding Path=Severity} Value="Info">
<Setter
Property="Background"
Value="{Binding Path=Severity,
Converter=
{StaticResource msgSeverityToColorConverter}}"
/>
</DataTrigger>
<DataTrigger Binding="{Binding Path=Severity} Value="Error">
<Setter
Property="Background"
Value="{Binding Path=Severity,
Converter=
{StaticResource msgSeverityToColorConverter}}"
/>
</DataTrigger>
</Style.Triggers>
</Style>
</ListView.ItemContainerStyle>
</ListView>
And for AlternateIndex I have the following code:
<Style.Triggers>
<Trigger Property="ItemsControl.AlternationIndex" Value="1">
<Setter Property="Background" Value="LightBlue"></Setter>
</Trigger>
<Trigger Property="ItemsControl.AlternationIndex" Value="2">
<Setter Property="Background" Value="LightGray"></Setter>
</Trigger>
</Style.Triggers>
I need that when row with message is not Info or Error, it will be of color from AlternationIndex property.
It's all due to order of declarations of triggers. First declare the alternation triggers and then the severity triggers.
<Style.Triggers>
<Trigger Property="ItemsControl.AlternationIndex" Value="1">
<Setter Property="Background" Value="LightBlue"></Setter>
</Trigger>
<Trigger Property="ItemsControl.AlternationIndex" Value="2">
<Setter Property="Background" Value="LightGray"></Setter>
</Trigger>
<DataTrigger Binding="{Binding Path=Severity} Value="Info">
<Setter Property="Background"
Value="{Binding Path=Severity,
Converter="{StaticResource msgSeverityToColorConverter}}" />
</DataTrigger>
<DataTrigger Binding="{Binding Path=Severity} Value="Error">
<Setter Property="Background"
Value="{Binding Path=Severity,
Converter="{StaticResource msgSeverityToColorConverter}}" />
</DataTrigger>
</Style.Triggers>

Change background on WPF Listview item when it's selected

I have a WPF Listview, and I have overridden the ListView.ItemTemplate to change the background color of the items on the ListViewItem.IsMouseOver event like so:
<AlternationConverter x:Key="BackgroundConverter">
<SolidColorBrush>White</SolidColorBrush>
<SolidColorBrush>
<SolidColorBrush.Color>
<Color A="242" R="242" G="242" B="242" />
</SolidColorBrush.Color>
</SolidColorBrush>
</AlternationConverter>
<Style x:Key="alternatingWithBinding" TargetType="{x:Type ListViewItem}">
<Setter Property="Height" Value="31"/>
<Setter Property="Background"
Value="{Binding RelativeSource={RelativeSource Self},
Path=(ItemsControl.AlternationIndex),
Converter={StaticResource BackgroundConverter}}"/>
<Style.Triggers>
<Trigger Property="ListViewItem.IsSelected" Value="True">
<Setter Property="ListViewItem.Background" Value="Yellow" />
</Trigger>
<Trigger Property="ListBoxItem.IsMouseOver" Value="True">
<Setter Property="ListBoxItem.Background" Value="Blue" />
</Trigger>
</Style.Triggers>
</Style>
What I'm trying to achieve is to have a different color when hovered over the already selected item (which is yellow). So on all the items it will be a Blue hover-over, and on the selected Yellow item, it'll be green.
I tried the below attempt, using MultiTrigger, but that didn't do the trick:
<Style x:Key="alternatingWithBinding" TargetType="{x:Type ListViewItem}">
<Setter Property="Height" Value="31"/>
<Setter Property="Background"
Value="{Binding RelativeSource={RelativeSource Self},
Path=(ItemsControl.AlternationIndex),
Converter={StaticResource BackgroundConverter}}"/>
<Style.Triggers>
<Trigger Property="ListViewItem.IsSelected" Value="True">
<Setter Property="ListViewItem.Background" Value="Yellow" />
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="ListBoxItem.IsMouseOver" Value="True"/>
<Condition Property="ListBoxItem.IsSelected" Value="True"/>
</MultiTrigger.Conditions>
<Setter Property="ListBoxItem.Background" Value="Green" />
</MultiTrigger>
<Trigger Property="ListBoxItem.IsMouseOver" Value="True">
<Setter Property="ListBoxItem.Background" Value="Blue" />
</Trigger>
</Style.Triggers>
</Style>
Any ideas?
Thanks.
Are the triggers are applied in order? It might work if you move the MultiTrigger to the bottom, then it will apply after the IsMouseOver Trigger.

Resources