WPF Important bindings
Post date: Nov 11, 2014 4:18:35 AM
1. How to bind relay command in wpf component interaction
//Include this on top
xmlns:interactivity="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
<!--List view selection event on mouse left button up -->
<ListView Name="SearchOrRecentTable"
BorderBrush="Transparent"
BorderThickness="0"
Margin="0,0,0,10"
Height="400"
ItemsSource="{Binding LstFilteredResource}"
VerticalContentAlignment="Stretch"
VerticalAlignment="Stretch"
HorizontalContentAlignment="Stretch"
HorizontalAlignment="Stretch"
ItemContainerStyle="{StaticResource PlanListItem}"
SelectedItem="{Binding SelectedResourceInfo, ElementName=userControl, Mode=TwoWay}"
SelectedValue="{Binding SelectedResourceInfo, ElementName=userControl, Mode=TwoWay}"
ItemTemplate="{StaticResource EmployeeRowTemplate}" >
<interactivity:Interaction.Triggers>
<interactivity:EventTrigger EventName="MouseLeftButtonUp">
<interactivity:InvokeCommandAction Command="{Binding OnResourceSelectedCommand}"/>
</interactivity:EventTrigger>
</interactivity:Interaction.Triggers>
</ListView>
2. How to change Listview selected item background color in WPF ?
<Style x:Key="ListViewItemOptionStyle" TargetType="ListViewItem">
<Setter Property="Template">
<Setter.Value>
<!-- Trun off default selection-->
<ControlTemplate TargetType="{x:Type ListViewItem}">
<Border x:Name="Bd" BorderBrush="Gray" BorderThickness="0,1,0,1"
Background="{TemplateBinding Background}"
Padding="{TemplateBinding Padding}"
SnapsToDevicePixels="true">
<ContentPresenter
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground"
Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="True" />
</MultiTrigger.Conditions>
<MultiTrigger.Setters>
<Setter Property="Background" Value="Green" />
<Setter Property="BorderBrush" Value="Green" />
<Setter Property="Foreground" Value="White"/>
</MultiTrigger.Setters>
</MultiTrigger>
</Style.Triggers>
</Style>
2. How to change datatemplate image based on selected item in ListView?
<DataTemplate x:Key="SmartNotesDT">
<Grid Width="300">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="8.5*"/>
<ColumnDefinition Width="1.5*"/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0" Margin="0,10,0,10">
<TextBlock Text="{Binding Title}" Style="{StaticResource Txt_Note_Header}" Name="Title">
</TextBlock>
<TextBlock Text="{Binding Message}" Style="{StaticResource Txt_Smart_Notes_Description}" Name="Description" />
</StackPanel>
<!-- if IsNegativeResponseInjuredNote is true then load RED image , else load Green Image -->
<Image Grid.Column="1" Name="ImgNotes" HorizontalAlignment="Right">
<Image.Style>
<Style TargetType="{x:Type Image}">
<Style.Triggers>
<DataTrigger Value="True" Binding="{Binding IsNegativeResponseInjuredNote}">
<Setter Property="Source" Value="component/Assets/red-notes-green.png"/>
</DataTrigger>
<DataTrigger Value="False" Binding="{Binding IsNegativeResponseInjuredNote}">
<Setter Property="Source" Value="component/Assets/grey-notes-green.png"/>
</DataTrigger>
</Style.Triggers>
</Style>
</Image.Style>
</Image>
</Grid>
<!-- Trigger to define the ListView selected row -->
<DataTemplate.Triggers>
<DataTrigger
Binding="{Binding RelativeSource=
{RelativeSource Mode=FindAncestor, AncestorType=
{x:Type ListViewItem}},Path=IsSelected}"
Value="True" >
<Setter TargetName="Title" Property="Foreground" Value="#ffffff"/>
<Setter TargetName="Description" Property="Foreground" Value="#ffffff"/>
</DataTrigger>
<!-- MultiDataTrigger to change the images based on multiple condition with selected List item -->
<MultiDataTrigger>
<MultiDataTrigger.Conditions>
<Condition Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=
{x:Type ListViewItem}},Path=IsSelected}" Value="True"/>
<Condition Value="True" Binding="{Binding IsNegativeResponseInjuredNote}" />
</MultiDataTrigger.Conditions>
<MultiDataTrigger.Setters>
<Setter TargetName="ImgNotes" Property="Source" Value="component/Assets/red-notes-green.png"/>
</MultiDataTrigger.Setters>
</MultiDataTrigger>
<MultiDataTrigger>
<MultiDataTrigger.Conditions>
<Condition Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=
{x:Type ListViewItem}},Path=IsSelected}" Value="True"/>
<Condition Value="False" Binding="{Binding IsNegativeResponseInjuredNote}" />
</MultiDataTrigger.Conditions>
<MultiDataTrigger.Setters>
<Setter TargetName="ImgNotes" Property="Source" Value="component/Assets/grey-notes-green.png"/>
</MultiDataTrigger.Setters>
</MultiDataTrigger>
</DataTemplate.Triggers>
</DataTemplate>