Add an event on ListBoxItems build with ItemTemplate - wpf

I have a ListBox like this :
<ListBox DataContext="{Binding UpdateSourceTrigger=PropertyChanged}"
ItemsSource="{Binding UpdateSourceTrigger=PropertyChanged}"
ListBoxItem.Selected="ListBoxItem_Selected">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<DockPanel>
<Label Content="{Binding Path=Attribute[rdv].Value, UpdateSourceTrigger=PropertyChanged}" />
</DockPanel>
<DockPanel>
<Label Content="{Binding Path=Attribute[type].Value, UpdateSourceTrigger=PropertyChanged}" />
<Label Content="{Binding Path=Element[ville].Attribute[saisie].Value, UpdateSourceTrigger=PropertyChanged}" />
<Label Content=":" />
<Label Content="{Binding Path=Element[adresse].Attribute[saisie].Value, UpdateSourceTrigger=PropertyChanged}" />
</DockPanel>
<Separator />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I whant to rise an event when an ListeBoxItem is selected.
As you can see, I've tried with ListBoxItem.Selected="ListBoxItem_Selected" but it does not work.
Do you have an idea ?
Tanks by advance !

You handler doesn't get called because the Selected event is already handled by the ListBox. You should handle the SelectionChanged event in the ListBox instead:
<ListBox DataContext="{Binding UpdateSourceTrigger=PropertyChanged}"
ItemsSource="{Binding UpdateSourceTrigger=PropertyChanged}"
SelectionChanged="ListBox_SelectionChanged">
Alternatively, you can use an ItemContainerStyle to attach the handler to every ListBoxItem:
<ListBox DataContext="{Binding UpdateSourceTrigger=PropertyChanged}"
ItemsSource="{Binding UpdateSourceTrigger=PropertyChanged}">
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<EventSetter Event="Selected" Handler="ListBoxItem_Selected"/>
</Style>
</ListBox.ItemContainerStyle>

Related

Tree View IsSelected with hierarchical data template

I have found a couple examples of binding an IsSelected Property in the view model. However none of these deal with a TreeView with Hierachical data templates.
My Hierachy is like this
VM_Part
VM_Step
VM_Step
VM_Step
VM_Part
VM_Step
VM_Step
I would like to be able to select multiple VM_Part instances or Multiple VM_Steps under one part. The idea being I can have a context menu and perform various commands on the selected items
<Window x:Class="NameSpace1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:Hipot_Sequence_Editor"
xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
mc:Ignorable="d"
Title="MainWindow" Height="677.538" Width="896.456">
<Window.DataContext>
<local:VM_Main></local:VM_Main>
</Window.DataContext>
<Grid>
<TreeView x:Name="treeView" Grid.Column="1" HorizontalAlignment="Left" Height="628" Margin="10.2,10,0,0" VerticalAlignment="Top" Width="237" Grid.RowSpan="2" ItemsSource="{Binding Parts}">
<TreeView.Resources>
<HierarchicalDataTemplate DataType="{x:Type viewModels:VM_Part}" ItemsSource="{Binding VM_Steps}">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding SequenceNumber}" />
<TextBlock Text=" - "></TextBlock>
<TextBlock Text="{Binding PartNumber}" />
</StackPanel>
</HierarchicalDataTemplate>
<DataTemplate DataType="{x:Type viewModels:VM_Step}">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Name}" />
</StackPanel>
</DataTemplate>
</TreeView.Resources>
</TreeView>
</Grid>
This seems to me the closet example to what I need. I tried the first answered suggested
<TreeView.Resources>
<Style TargetType="TreeViewItem">
<Setter Property="IsSelected"
Value="{Binding Path=IsSelected, Mode=TwoWay}" />
</Style>
</TreeView.Resources>
However it seems that this code assumes IsSelected is in VM_Main and not in VM_Part or VM_Step
each TreeViewItem in a hierarchy
VM_Part TreeViewItem
VM_Step TreeViewItem
VM_Step TreeViewItem
VM_Step TreeViewItem
has its own DataContext (VM_Part or VM_Step)
so if VM_Part and VM_Step have IsSelected property, then style for TreeViewItem is defined correctly
<Style TargetType="TreeViewItem">
<Setter Property="IsSelected"
Value="{Binding Path=IsSelected, Mode=TwoWay}" />
</Style>
however, multiselection in TreeView is probably simpler with CheckBoxes added to item template and bound to view model IsSelected property:
<HierarchicalDataTemplate DataType="{x:Type viewModels:VM_Part}" ItemsSource="{Binding VM_Steps}">
<StackPanel Orientation="Horizontal">
<CheckBox IsChecked="{Binding IsSelected, UpdateSourceTrigger=PropertyChanged}" />
<TextBlock Text="{Binding SequenceNumber}" />
<TextBlock Text=" - "/>
<TextBlock Text="{Binding PartNumber}" />
</StackPanel>
</HierarchicalDataTemplate>
<DataTemplate DataType="{x:Type viewModels:VM_Step}">
<StackPanel Orientation="Horizontal">
<CheckBox IsChecked="{Binding IsSelected, UpdateSourceTrigger=PropertyChanged}" />
<TextBlock Text="{Binding Name}" />
</StackPanel>
</DataTemplate>

WPF Element Binding not working in XAML

This should be fairly simple and straightforward but element binding is not working in XAML when using it from resource. It is working fine when using it directly in XAML.
Resources:
<Window.Resources>
<StackPanel x:Key="panel">
<CheckBox x:Name="chkDefaultValue" Content="Default Value"
IsChecked="{Binding ElementName=txtDefaultValue, Path=Text.Length, Mode=OneWay}" />
<TextBox x:Name="txtDefaultValue"
Text="{Binding DefaultValue, Mode=TwoWay, ValidatesOnDataErrors=True}"
IsEnabled="{Binding ElementName=chkDefaultValue, Path=IsChecked}" />
</StackPanel>
</Window.Resources>
XAML:
<StackPanel>
<!-- BINDING NOT WORKING -->
<ContentControl Content="{StaticResource panel}" />
<!-- BINDING WORKING HERE -->
<CheckBox x:Name="chkDefaultValue" Content="Default Value"
IsChecked="{Binding ElementName=txtDefaultValue, Path=Text.Length, Mode=OneWay}" />
<TextBox x:Name="txtDefaultValue"
Text="{Binding DefaultValue, Mode=TwoWay, ValidatesOnDataErrors=True}"
IsEnabled="{Binding ElementName=chkDefaultValue, Path=IsChecked}" />
</StackPanel>
How could i fix it?
You should use DataTemplate
<Window.Resources>
<DataTemplate DataType="{x:Type ContentControl}" x:Key="panel">
<StackPanel>
<CheckBox x:Name="chkDefaultValue" Content="Default Value"
IsChecked="{Binding ElementName=txtDefaultValue, Path=Text.Length, Mode=OneWay}" />
<TextBox x:Name="txtDefaultValue"
Text="{Binding DefaultValue, Mode=TwoWay, ValidatesOnDataErrors=True}"
IsEnabled="{Binding ElementName=chkDefaultValue, Path=IsChecked}" />
</StackPanel>
</DataTemplate>
</Window.Resources>
and
<ContentControl ContentTemplate="{StaticResource panel}" />
didn't check, but probably works
And you can use ControlTemplate
<Window.Resources>
<ControlTemplate x:Key="panel">
<StackPanel>
<CheckBox x:Name="chkDefaultValue"
Content="Default Value"
IsChecked="{Binding ElementName=txtDefaultValue,
Path=Text.Length,
Mode=OneWay}" />
<TextBox x:Name="txtDefaultValue"
IsEnabled="{Binding ElementName=chkDefaultValue,
Path=IsChecked}"
Text="{Binding DefaultValue,
Mode=TwoWay,
ValidatesOnDataErrors=True}" />
</StackPanel>
</ControlTemplate>
</Window.Resources>
and
<ContentControl Template="{StaticResource panel}" />

How to bind a property of ViewModel to an element in HierarchicalDataTemplate of a Treeview?

How to bind a property of ViewModel to an element in HierarchicalDataTemplate of a Treeview (the property is is out of HierarchicalDataTemplate.Itemsource)
this is the example and the probelm is in this line: Visibility="{Binding IsCheckBoxVisible , RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=UserControl}, Converter={StaticResource debuger}}"/>
<UserControl ....>
<Grid>
<TreeView ItemsSource="{Binding Roots}" Grid.Row="0">
<TreeView.ItemContainerStyle>
</TreeView.ItemContainerStyle>
<TreeView.ItemTemplate >
<HierarchicalDataTemplate ItemsSource="{Binding ConfigedChildren}">
<StackPanel Orientation="Horizontal" >
<CheckBox IsChecked="{Binding IsChecked}" Visibility="{Binding IsCheckBoxVisible, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=UserControl}, Converter={StaticResource debuger}}"/>
<Label Content="{Binding Title}"/>
</StackPanel>
</HierarchicalDataTemplate>
</TreeView.ItemTemplate>
</TreeView>
</Grid>
<CheckBox IsChecked="{Binding IsChecked}" Visibility="{Binding DataContext.IsCheckBoxVisible, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=UserControl}, Converter={StaticResource debuger}}"/>
Use DataContext.IsCheckBoxVisible. Hope this will work

Switch datatemplate depending on a selected string value in combobox

Based on a selected string value in the combobox I want to either show red/blue datatempalte inside the grid.
Can this be done without a ContentControl?
<UserControl.Resources >
<DataTemplate x:Key="red">
<TextBox Text="red" />
</DataTemplate>
<DataTemplate x:Key="blue">
<TextBox Text="blue" />
</DataTemplate>
</UserControl.Resources>
<ComboBox ??? />
<Grid>
// Show red or blue datatemplate here
</Grid>
Why not use a ContentControl?
To make this work simply i would put the templates in an array, which the ComboBox then can bind to:
<x:Array x:Key="templates" Type="{x:Type DataTemplate}">
<DataTemplate>
<DataTemplate.Resources>
<sys:String x:Key="DisplayString">Red</sys:String>
</DataTemplate.Resources>
<TextBox Text="red" />
</DataTemplate>
<DataTemplate>
<DataTemplate.Resources>
<sys:String x:Key="DisplayString">Blue</sys:String>
</DataTemplate.Resources>
<TextBox Text="blue" />
</DataTemplate>
</x:Array>
<ComboBox Name="combo" ItemsSource="{StaticResource templates}">
<ComboBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Resources[DisplayString]}" />
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
<Grid>
<ContentControl ContentTemplate="{Binding SelectedItem, ElementName=combo}" />
</Grid>

WPF : InputBindings on a StackPanel

I want to put a command on a ListBoxItem. The ListBoxItem use a DataTemplate composed of a StackPanel (containing an Image and a TextBlock, both using Binding). I want that the doubleclick on that ListBoxItem fire the command.
I have tried this :
<DataTemplate>
<StackPanel>
<StackPanel.Resources>
<CommonUI:CommandReference x:Key="DoubleClickCommand" Command="{Binding Path=DefaultCommand}" />
</StackPanel.Resources>
<StackPanel.InputBindings>
<MouseBinding Gesture="LeftDoubleClick" Command="{StaticResource DoubleClickCommand}" />
</StackPanel.InputBindings>
<Image Source="{Binding Path=Thumbnail, IsAsync=True}" IsHitTestVisible="False"/>
<TextBlock Text="{Binding Path=Name}" IsHitTestVisible="False">
</StackPanel>
</DataTemplate>
I have also tried to put the Command Resources on a StackPanel containing this StackPanel, without any change.
I am certain of my binding because when I put the InputBindings part on the TextBlock, it works.
Thanks
Try handling the event in the ListBox instead of the StackPanel:
<ListBox>
<ListBox.Resources>
<CommonUI:CommandReference x:Key="DoubleClickCommand" Command="{Binding Path=DefaultCommand}" />
</ListBox.Resources>
<ListBox.InputBindings>
<MouseBinding Gesture="LeftDoubleClick" Command="{StaticResource DoubleClickCommand}" />
</ListBox.InputBindings>
<DataTemplate>
<StackPanel>
<Image Source="{Binding Path=Thumbnail, IsAsync=True}" />
<TextBlock Text="{Binding Path=Name}" />
</StackPanel>
</DataTemplate>
</ListBox>
My code finally looks like this :
<DataTemplate>
<StackPanel Orientation="Vertical">
<StackPanel.Resources>
<CommonUI:CommandReference x:Key="DoubleClickCommand" Command="{Binding Path=DefaultCommand}" />
</StackPanel.Resources>
<StackPanel.InputBindings>
<MouseBinding Gesture="LeftDoubleClick" Command="{StaticResource DoubleClickCommand}" />
</StackPanel.InputBindings>
<Image Source="{Binding Path=Thumbnail, IsAsync=True}" />
<TextBlock Text="{Binding Path=Name}" />
</StackPanel>
</DataTemplate>
Thanks anyway, Mr Poulin.

Resources