Wrong selection in ListBox with VirtualizationMode="Recycling" and SeclectionMode="Extended"? - wpf

I have a really strage behaviour. I have a ListBox in the View with a DataTemplate for its items including ViewModels. I bind the IsSelected to my ViewModel and use SelectionMode="Extended". Everything works fine.
BUT if I add VirtualiuationMode="Recycling" the I get the wrong items.
To reproduce: select items with Ctrl, then scroll down and select just one item. The normal behaviour deselects all items and just select the last one without holded Ctrl.
But if I check my ViewModel all the old items are selected!?!
<Grid>
<StackPanel>
<ListBox ItemsSource="{Binding People}" MaxHeight="100"
SelectionMode="Extended"
VirtualizationMode="Recycling">
<!--VirtualizingStackPanel.IsVirtualizing="True">-->
<ListBox.ItemContainerStyle>
<Style TargetType="{x:Type ListBoxItem}">
<Setter Property="IsSelected" Value="{Binding Path=IsSelected, Mode=TwoWay}" />
</Style>
</ListBox.ItemContainerStyle>
<ListBox.ItemTemplate>
<DataTemplate>
<views:PeopleView />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Button Click="Button_Click">
OK
</Button>
</StackPanel>
</Grid>
The item template
<UserControl x:Class="WpfApplication1.View.PeopleView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Height="Auto" Width="Auto">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" SharedSizeGroup="A"/>
<ColumnDefinition Width="Auto" SharedSizeGroup="B"/>
</Grid.ColumnDefinitions>
<TextBox Text="{Binding Path=Name}"
Name="tbx_Name"
Grid.Column="0"/>
<CheckBox IsChecked="{Binding Path=IstAktiv}"
Name="cbx_IstAktiv"
Grid.Column="1"/>
</Grid>
Any idea?

I got a workaround but why do I have to change it "manually" in the change event and not by databinding?
private void Lbx_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
ListBox lbx = (ListBox)sender;
foreach (PersonViewModel item in lbx.Items)
{
item.IsSelected = lbx.SelectedItems.Contains(item);
}
}

Another option related to KCT's earlier answer is to use the AddedItems and RemovedItems from the SelectionChangedEventArgs and target the changes, such as:
private void Lbx_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
foreach (var item in e.AddedItems)
{
((PersonViewModel)item).IsSelected = true;
}
foreach (var item in e.RemovedItems)
{
((PersonViewModel)item).IsSelected = false;
}
}
This may give better performance with larger collections (I've got about 15,000 entries in a Virtualizing Tile Panel in a ListBox).

Related

How to disable deselection of items in ListView?

I've got
<ListView SelectionMode="Single" SelectedIndex="0" ItemsSource="{Binding AccountViewModels}" SelectedItem="{Binding SelectedItem}" Style="{StaticResource AccountsList}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<LocalViews:AccountView Margin="{StaticResource ControlMargin}" />
</DataTemplate>
</ItemsControl.ItemTemplate>
</ListView>
Is there a way to disable deselection of an item from the ListView (i.e. ctrl+click)? In other words, I don't want the user to be able to de-select an item, but of course it's OK to select another item.
Since this functionality is purely view/control related it should not be implemented in the view model but you could handle the PreviewMouseLeftButtonDown event of the ListBoxItem container like this:
<ListView SelectionMode="Single" SelectedIndex="0" ItemsSource="{Binding AccountViewModels}" SelectedItem="{Binding SelectedItem}" Style="{StaticResource AccountsList}">
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<EventSetter Event="PreviewMouseLeftButtonDown" Handler="ItemPreviewMouseLeftButtonDown" />
</Style>
</ListBox.ItemContainerStyle>
<ItemsControl.ItemTemplate>
<DataTemplate>
<LocalViews:AccountView Margin="{StaticResource ControlMargin}" />
</DataTemplate>
</ItemsControl.ItemTemplate>
</ListView>
private void ItemPreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
ListBoxItem lbi = sender as ListBoxItem;
e.Handled = lbi.IsSelected;
}
One way to handle this would be to use binding and add logic to disallow de-selection in the view model.
From this answer, change the IsSelected as follows:
private bool isSelected;
public bool IsSelected
{
get { return isSelected; }
set
{
if (value && !isSelected)
{
isSelected = value;
RaisePropertyChanged("IsSelected");
}
}
}

How to make a "SelectButton" with Button, Extender and ListBox to have width it needs?

I'm trying to take into use a SelectButton (https://gist.github.com/loraderon/580405) but I need to specify MinWidth for it. Otherwise it's width is just the width of Extender. Removing ColumnSpan or setting 1st column Auto are not doing the trick. I would really like it to always have width of most wide element in list + extender symbol.
<UserControl x:Class="loraderon.Controls.SelectButton"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:my="clr-namespace:loraderon.Controls"
mc:Ignorable="d"
SizeChanged="UserControl_SizeChanged"
d:DesignHeight="30" d:DesignWidth="100">
<Grid
x:Name="SplitGrid"
>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="23" />
</Grid.ColumnDefinitions>
<Button
x:Name="Button"
Click="Button_Click"
Grid.ColumnSpan="2"
Padding="0"
HorizontalContentAlignment="Left"
>
<ContentControl
x:Name="ButtonContent"
HorizontalContentAlignment="Center"
ContentTemplate="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type my:SelectButton}}, Path=ItemTemplate}"
/>
</Button>
<Expander
x:Name="Expander"
Expanded="Expander_Expanded"
Collapsed="Expander_Collapsed"
Grid.Column="1"
VerticalAlignment="Center"
IsExpanded="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type my:SelectButton}}, Path=IsExpanded}"
/>
<Popup
IsOpen="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type my:SelectButton}}, Path=IsExpanded}"
PlacementTarget="{Binding ElementName=Button}"
PopupAnimation="Fade"
StaysOpen="False"
>
<ListBox
x:Name="ListBox"
SelectionMode="Single"
SelectionChanged="ListBox_SelectionChanged"
SelectedIndex="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type my:SelectButton}}, Path=SelectedIndex, Mode=TwoWay}"
ItemTemplate="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type my:SelectButton}}, Path=ItemTemplate}"
ItemsSource="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type my:SelectButton}}, Path=ItemsSource}"
/>
</Popup>
</Grid>
</UserControl
EDIT: The window I placed the control had:
SizeToContent="WidthAndHeight"
which resulted both answers below not to work. Is there more robust solution that would work when placing the button in variety of controls/containers? It seems that the way the control was built is not very robust. Popup not being the part of visual tree makes it a bad choice.
The easy part is binding to the ListBox' ActualWidth
<Grid.ColumnDefinitions>
<ColumnDefinition Width="{Binding ElementName=ListBox, Path=ActualWidth}"/>
<ColumnDefinition Width="23" />
</Grid.ColumnDefinitions>
The tricky part is that since the ListBox is located in a Popup, with it's own visual tree (Remarks),
it only gets rendered when IsOpen is set to true.
The workaround is a swift open / close when the Control is loaded
public SelectButton()
{
InitializeComponent();
Loaded += (o, e) => Initialize();
}
void Initialize()
{
IsExpanded = true;
IsExpanded = false;
}
and an updated Expander_Expanded Method
private DateTime startUpTime = DateTime.Now;
private DateTime collapsedAt = DateTime.MinValue;
private void Expander_Expanded(object sender, RoutedEventArgs e)
{
if (DateTime.Now - startUpTime <= TimeSpan.FromMilliseconds(200))
{
IsExpanded = true;
return;
}
if (DateTime.Now - collapsedAt <= TimeSpan.FromMilliseconds(200))
{
Expander.IsExpanded = false;
IsExpanded = false;
return;
}
IsExpanded = true;
}
EDIT
Turns out the TimeSpan of 200ms can be too small dependent on the system used, added a more robust solution
private bool startUp = true;
private DateTime collapsedAt = DateTime.MinValue;
private void Expander_Expanded(object sender, RoutedEventArgs e)
{
if (startUp)
{
IsExpanded = true;
startUp = false;
return;
}
if (DateTime.Now - collapsedAt <= TimeSpan.FromMilliseconds(200))
{
Expander.IsExpanded = false;
IsExpanded = false;
return;
}
IsExpanded = true;
}
This is not pretty, but working. Since you already do Code-Behind, this might fit your needs:
First, the ItemsSourceProperty. Change it to:
public static readonly DependencyProperty ItemsSourceProperty =
DependencyProperty.Register("ItemsSource", typeof(IEnumerable), typeof(SelectButton), new PropertyMetadata(ItemsSourceChanged ));
Second, prepare Constructor:
public SelectButton() {
InitializeComponent();
this.ListBox.Loaded += this.ListBoxOnLoaded;
}
Third, implement ItemnsSourceChanged-Method:
private static void ItemsSourceChanged(DependencyObject d, DependencyPropertyChangedEventArgs e) {
var self = d as SelectButton;
self.ListBoxOnLoaded(self.ListBox, new RoutedEventArgs());
}
Fourth, do the magic:
private void ListBoxOnLoaded(object sender, RoutedEventArgs routedEventArgs) {
var lb = sender as ListBox;
lb.Measure(new Size(double.PositiveInfinity, double.PositiveInfinity));
this.col1.MinWidth = lb.DesiredSize.Width;
}
Last but not least, edit XAML:
<Grid x:Name="SplitGrid">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" Name="col1" />
<ColumnDefinition Width="23" />
</Grid.ColumnDefinitions>
When the listbox has loaded, we simply do the measuring by ourself and apply the desired size to the first column.
Hope it helps :)
This is horrible answer but might give somebody an idea. I create an invisible Listbox to same location where the button content is and bind Grid.Column="0" MinWidth to it's ActualWidth.
Somehow this is a bit too wide. The width of the ListBox is too wide to assign to Grid.Column="0". The items in the popuplistbox are a lot more narrow. Max of these should be the width assigned to Grid.Column="0".
I also tried to have a buttton there and created additional dependencyproperty for its content. That was best looking (size was perfect) but then you would have to know preferably all the items and their sizes in different languages or at least one item. This is of course huge disadvantage.
EDIT: If this same could be achieved with ContentControl/ContentPresenter somehow to avoid 2 ListBox this would be far better.
EDIT2: This does not work. The Width is width of the 1st element so order or ItemsSource is relevant.
Here is the xaml:
<UserControl x:Class="loraderon.Controls.SelectButton"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:my="clr-namespace:loraderon.Controls"
mc:Ignorable="d"
SizeChanged="UserControl_SizeChanged"
d:DesignHeight="30" d:DesignWidth="100">
<Grid
x:Name="SplitGrid"
>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" MinWidth="{Binding ActualWidth, ElementName=ContentListBox}"/>
<ColumnDefinition Width="23" />
</Grid.ColumnDefinitions>
<Button
x:Name="Button"
Click="Button_Click"
Grid.ColumnSpan="2"
Padding="0"
HorizontalContentAlignment="Left"
>
<ContentControl
x:Name="ButtonContent"
HorizontalContentAlignment="Center"
ContentTemplate="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type my:SelectButton}}, Path=ItemTemplate}"
/>
</Button>
<ListBox
Grid.Column="0"
x:Name="ContentListBox"
Visibility="Hidden"
MaxHeight="{Binding ActualHeight, ElementName=Button}"
HorizontalAlignment="Stretch"
ItemTemplate="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type my:SelectButton}}, Path=ItemTemplate}"
ItemsSource="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type my:SelectButton}}, Path=ItemsSource}"/>
<Expander
x:Name="Expander"
Expanded="Expander_Expanded"
Collapsed="Expander_Collapsed"
Grid.Column="1"
VerticalAlignment="Center"
IsExpanded="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type my:SelectButton}}, Path=IsExpanded}"
/>
<Popup
IsOpen="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type my:SelectButton}}, Path=IsExpanded}"
PlacementTarget="{Binding ElementName=Button}"
PopupAnimation="Fade"
StaysOpen="False"
>
<ListBox
x:Name="ListBox"
SelectionMode="Single"
SelectionChanged="ListBox_SelectionChanged"
SelectedIndex="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type my:SelectButton}}, Path=SelectedIndex, Mode=TwoWay}"
ItemTemplate="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type my:SelectButton}}, Path=ItemTemplate}"
ItemsSource="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type my:SelectButton}}, Path=ItemsSource}"
/>
</Popup>
</Grid>
</UserControl
You can create a temporary ListBox and measure it to find the desired size for the element.
The most appropriate place to compute the size is when the ItemsSource property changes. You can achieve this by modifying the dependency property as such:
public static readonly DependencyProperty ItemsSourceProperty =
DependencyProperty.Register("ItemsSource", typeof(IEnumerable), typeof(SelectButton), new PropertyMetadata(ItemSourceChanged));
In the ItemSourceChanged method you can create a temporary ListBox, make it have your items, and measure it:
private static void ItemSourceChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
ContentControl control = new ContentControl();
ListBox listBox = new ListBox();
control.Content = listBox;
IEnumerable enumerable = e.NewValue as IEnumerable;
SelectButton selectButton = d as SelectButton;
foreach (var item in enumerable)
{
listBox.Items.Add(item);
}
listBox.Measure(new Size(Double.MaxValue, Double.MaxValue));
selectButton.Button.Width = listBox.DesiredSize.Width;
}
Here the line control.Content = listBox; is necessary. If the ListBox is not contained within a control, desired size always returns 0.

Custom templated combobox with special non templated item

I have a RadTreeView, in each item there is a RadCombobox with some elements. Now I need to add some "special" item into each combobox. User can click on this item to add new element in combobox:
My current code:
<DataTemplate x:Key="Monitor">
<Grid Height="Auto" Width="Auto" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="16" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Height="16" Width="16" Source="icons\monitor.png" />
<TextBlock Text="{Binding Name}" Margin="5 0 0 0" Grid.Column="1" Width="Auto" HorizontalAlignment="Stretch" VerticalAlignment="Center"/>
<!-- PROBLEM IS HERE -->
<telerik:RadComboBox Name="RadComboSchedule"
Grid.Column="2"
Margin="10 0 0 0"
Width="155"
ItemsSource="{Binding Source={StaticResource DataSource}, Path=ScheduleDataSource}"
ItemTemplate="{StaticResource ComboBoxTemplate}"
>
</telerik:RadComboBox>
<Button Name="BtnRemoveMonitor" Grid.Column="3" Style="{StaticResource ButtonListBoxItemStyle}" Template="{StaticResource RemoveButtonTemplate}" />
</Grid>
</DataTemplate>
<HierarchicalDataTemplate x:Key="Group"
ItemTemplate="{StaticResource Monitor}"
ItemsSource="{Binding Monitors}">
<TextBlock Text="{Binding Name}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
</HierarchicalDataTemplate>
<telerik:RadTreeView
Name="RadTreeViewGroups"
Height="auto"
Width="auto"
ItemsSource="{Binding Source={StaticResource DataSource}, Path=GroupsDataSource}"
ItemTemplate="{StaticResource Group}"
>
</telerik:RadTreeView>
So, I have all like at a screenshot without element "Add new item".
Any ideas?
PS It's not a problem to use standard WPF Combobox and TreeView controls.
You can create a new item in the DataSource of the ComboBox which name is "ADD NEW ITEM" and handle when the user select it.
private void SelectItem(object sender, SelectionChangedEventArgs e)
{
if (e.AddedItems[0].ToString() == "new")
{
string newItem = "completely new item";
dataSource.Add(newItem);
((ComboBox)sender).SelectedItem = newItem;
}
}
In this question you can see a better example that each item is an instance of a class, so it's easier to handle the "add item" request:
Databound WPF ComboBox with 'New...' item
Edit (about the 'add item' button template):
Based on the example above
Having this class
public class DisplayClass
{
public string Name { get; set; }
public bool IsDummy { get; set; }
}
You bind ComboBox.ItemsSource to an ObservableCollection like this one:
public ObservableCollection<DisplayClass> DataSource { get; set; }
Add that "dummy" item to the collection
DataSource.Add(new DisplayClass { Name = "ADD ITEM", IsDummy = true });
Then you handle the item selection with something like this:
private void SelectItem(object sender, SelectionChangedEventArgs e)
{
var comboBox = (ComboBox)sender;
var selectedItem = comboBox.SelectedItem as DisplayClass;
if (selectedItem != null && selectedItem.IsDummy)
{
//Creating the new item
var newItem = new DisplayClass { Name = comboBox.Items.Count.ToString(), IsDummy = false };
//Adding to the datasource
DataSource.Add(newItem);
//Removing and adding the dummy item from the collection, thus it is always the last on the 'list'
DataSource.Remove(selectedItem);
DataSource.Add(selectedItem);
//Select the new item
comboBox.SelectedItem = newItem;
}
}
To display the items properly, you'll need to change the ComboBox.ItemTemplate, making the image invisible when the item is dummy
<ComboBox ItemsSource="{Binding DataSource}" SelectionChanged="SelectItem">
<ComboBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Name}" Width="180" />
<Image HorizontalAlignment="Right" Source="..." MouseLeftButtonUp="DeleteItem">
<Image.Style>
<Style TargetType="Image">
<Style.Triggers>
<DataTrigger Binding="{Binding IsDummy}" Value="True">
<Setter Property="Visibility" Value="Hidden" />
</DataTrigger>
</Style.Triggers>
</Style>
</Image.Style>
</Image>
</StackPanel>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>

2 states click - listbox item WPF

I have a ListboxItem with a checkbox in its template. When I click the checkbox, a section of the template gets visible. That works ok.
I am trying to simulate the same behaviour by clicking the item itself making it expand/collapse the respective section. It should always negate the current state of the item(expanded/collapsed)
I am using C#/WPF
<Grid x:Name="gridExpanded"
HorizontalAlignment="Stretch"
Margin="8"
Grid.RowSpan="1"
Width="Auto"
Height="Auto"
Visibility="{Binding IsChecked, Converter={StaticResource booleanToVisibilityConverter}, ElementName=checkBox}" />
It sounds like you are actually looking for the Expander control. This allows you to specify a header and content, and clicking on the header will toggle the visibility of the content
By WPF ListBox does not change CheckBox state when the corresponding label is clicked.
To solve this,
1) Add a IsVisibleFlag property to the item model
2) Add a handler for the PreviewMouseLeftButtonDown event of the item
3) In the handler use ItemContainerGenerator.ContainerFromItem to update the visibility flag on click
4) Associate the visibility of your template section with the IsVisibleFlag (or with the checkBox state).
The ItemModel:
publibc class MyItemModel : INotifyPropertyChanged
{
private bool _isVisibleFlag;
public bool IsVisibleFlag
{
get { return _isVisibleFlag; }
set
{
if (_isVisibleFlag != value)
{
_isVisibleFlag = value;
OnPropertyChanged(() => IsVisibleFlag);
}
}
}
// ItemText property goes here (I ommited it to save space)
}
In XAML:
<Window
<!--generated x:Class and xmlns goes here (I ommited them to save space) -->
DataContext="{Binding RelativeSource={RelativeSource Self}}"
>
<Window.Resources>
<Style TargetType="ListBoxItem">
<EventSetter Event="PreviewMouseLeftButtonDown" Handler="ListViewItem_PreviewMouseLeftButtonDown" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<CheckBox Name="chkVisible" Grid.Column="0" IsChecked="{Binding IsVisibleFlag}" />
<TextBlock Grid.Column="1" Text="{Binding ItemText}" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Grid>
<ListBox Name="MyListBox" ItemsSource="{Binding AddableWidgets}" />
</Grid>
</Window>
In code:
private void ListViewItem_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
for (int i = 0; i < MyListBox.Items.Count; i++)
{
object yourObject = MyListBox.Items[i];
ListBoxItem lbi = (ListBoxItem)MyListBox.ItemContainerGenerator.ContainerFromItem(yourObject);
if (lbi.IsFocused)
{
MyItemModel w = (MyItemModel)MyListBox.Items[i];
w.IsVisibleFlag = !w.IsVisibleFlag;
e.Handled = true;
}
}
}

WPF Treeview - Get status of checkbox

I have created a Treeview and used a stack panel to include a checkbox, icon image and text for each node in the tree.
These nodes are created at runtime.
I also have a button object.
The xaml is below.
The problem i have is that, when the click me button is clicked, i need to traverse thru the tree view and if a checkbox is checked, perform some function.
Does anyone know how to find out if the checkbox for a node in the tree is checked, from the C# code behind ???
<Window x:Class="WPF_Explorer_Tree.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WPF_Explorer_Tree"
Title="KryptoG" Height="424" Width="815" Loaded="Window_Loaded">
<Window.Resources>
<local:HeaderConverter x:Key="formatter" />
</Window.Resources>
<Grid>
<TreeView x:Name="foldersItem" SelectedItemChanged="foldersItem_SelectedItemChanged" Background="#FFFFFFFF" BorderBrush="#FFFFFFFF" Foreground="#FFFFFFFF" Margin="0,0,236,112" AllowDrop="True" Visibility="Visible">
<TreeView.Resources>
<Style TargetType="{x:Type TreeViewItem}">
<Setter Property="HeaderTemplate">
<Setter.Value>
<DataTemplate>
<StackPanel Name="ST" Orientation="Horizontal">
<CheckBox VerticalAlignment="Center" Name="SelectedCheckBox" IsChecked="False" Checked="CheckBox_Checked" Unchecked="CheckBox_Unchecked" />
<Image Name="img" Width="20" Stretch="Fill"
Source="{Binding
RelativeSource={RelativeSource
Mode=FindAncestor,
AncestorType={x:Type TreeViewItem}},
Path=Header,
Converter={x:Static local:HeaderToImageConverter.InstanceIcon}}"
/>
<TextBlock VerticalAlignment="Center" Text="{Binding
RelativeSource={RelativeSource
Mode=FindAncestor,
AncestorType={x:Type TreeViewItem}},
Path=Header,
Converter={StaticResource formatter}}"
/>
</StackPanel>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
</TreeView.Resources>
</TreeView>
<TreeView HorizontalAlignment="Right" Margin="0,0,12,12" Name="treeView1" Width="204" AllowDrop="True" BorderBrush="White" Foreground="White" />
<Button Height="23" HorizontalAlignment="Left" Margin="12,0,0,70" Name="button1" VerticalAlignment="Bottom" Width="75" Click="button1_Click">Click Me</Button>
<Button Height="23" HorizontalAlignment="Left" Margin="267,0,0,69" Name="button2" VerticalAlignment="Bottom" Width="75" Click="button2_Click">Click Me too</Button>
</Grid>
I would create a Two-Way data binding with that Check Box's IsChecked property to a ViewModel object instead. Much easier than navigating the tree.
Edit (per request of person asking):
Here's an example View Model (very simple that is only accounting for the IsChecked property):
public class ViewModel : System.ComponentModel.INotifyPropertyChanged
{
private bool? _isChecekd;
public bool? IsChecked
{
get { return _isChecekd; }
set
{
if (_isChecekd != value)
{
_isChecekd = value;
if (PropertyChanged != null)
{
PropertyChanged(this, new System.ComponentModel.PropertyChangedEventArgs("IsChecked"));
}
}
}
}
#region INotifyPropertyChanged Members
public event System.ComponentModel.PropertyChangedEventHandler PropertyChanged;
#endregion
}
Now that you have an object implementing INotifyPropertyChanged, you can bind UI element properties to them. So you would update the IsChecked property of your CheckBox to this property. To do that, you first have to set the DataContext of Window1 in some way (or you could just do this on the TreeView itself as well). In your Window1.xaml.cs:
public Window1()
{
InitializeComponent();
this.DataContext = new ViewModel();
}
Then, in your Window1.xaml file, update the CheckBox IsChecked property:
<CheckBox VerticalAlignment="Center" Name="SelectedCheckBox" IsChecked="{Binding Path=IsChecked, Mode=TwoWay}" Checked="CheckBox_Checked" Unchecked="CheckBox_Unchecked" />
And then, in whatever code you need to be able to interrogate the currently value of IsChecked, you can get to it this way (assuming this is Window1):
((ViewModel)this.DataContext).IsChecked
Hope that helps!
I think Tony Heupel's answer is the best approach, but to understand it you need to know about the MVVM (Model-View-ViewModel) design pattern. I suggest you read this excellent article by Josh Smith

Resources