英文:
Treeview, ICollectionView and binding to SelectedValue or SelectedItemChanged
问题
I will only provide translations for the code and not the explanations or additional content. Here is the translated code:
<Window x:Class="WPFUI.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:Behaviors="http://schemas.microsoft.com/xaml/behaviors"
xmlns:viewmodels="clr-namespace:WPFUI.ViewModels" d:DataContext="{d:DesignInstance Type=viewmodels:MainWindowViewModel}"
mc:Ignorable="d"
FontSize="16"
Title="Title" Height="450" Width="800">
<Grid Background="Black">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="4*"/>
<ColumnDefinition Width="2*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition Height="4*" />
<RowDefinition Height="4*" />
<RowDefinition Height="*" />
<RowDefinition Height="20" />
</Grid.RowDefinitions>
<Grid Grid.Row="0" Grid.ColumnSpan="3">
<DockPanel>
<Menu DockPanel.Dock="Top">
<MenuItem Header="_File">
<MenuItem Header="_Open" />
</MenuItem>
</Menu>
</DockPanel>
</Grid>
<Grid Grid.Row="1">
<TextBox Text="{Binding FilterValue, UpdateSourceTrigger=PropertyChanged}" />
</Grid>
<Grid Grid.Row="2" Grid.Column="1" Background="DarkGreen">
<DataGrid x:Name="Grid_Upper" Grid.Row="2"
ItemsSource="{Binding TreeViewCollection}"
AlternatingRowBackground="GreenYellow"
HeadersVisibility="Column" AutoGenerateColumns="False"
CanUserAddRows="False" CanUserDeleteRows="False" CanUserReorderColumns="True"
CanUserResizeColumns="True" CanUserResizeRows="True" CanUserSortColumns="True"
ScrollViewer.VerticalScrollBarVisibility="Auto"
VirtualizingStackPanel.IsVirtualizing="True" VirtualizingStackPanel.IsVirtualizingWhenGrouping="True"
VirtualizingStackPanel.VirtualizationMode="Recycling">
<DataGrid.Columns>
<DataGridTextColumn Header="Name" Binding="{Binding Name}" />
<DataGridTemplateColumn Header="Text">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" Padding="10,10,10,10" MinWidth="100" Width="300" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
<DataGrid.GroupStyle>
<GroupStyle>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<Label Content="{Binding Name}" FontWeight="Bold"/>
</DataTemplate>
</GroupStyle.HeaderTemplate>
</GroupStyle>
</DataGrid.GroupStyle>
</DataGrid>
</Grid>
<Grid Grid.Row="2" Grid.RowSpan="2">
<TreeView x:Name="TreeViewMyModelList" ItemsSource="{Binding TreeViewCollection.Groups}"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Recycling">
<Behaviors:Interaction.Triggers>
<Behaviors:EventTrigger EventName="SelectedItemChanged">
</Behaviors:EventTrigger>
</Behaviors:Interaction.Triggers>
<TreeView.ItemTemplate>
<HierarchicalDataTemplate ItemsSource="{Binding Path=Items}">
<TextBlock VerticalAlignment="Center" Text="{Binding Path=Name}">
</TextBlock>
</HierarchicalDataTemplate>
</TreeView.ItemTemplate>
<TreeView.ItemContainerStyle>
<Style TargetType="TreeViewItem">
<Setter Property="IsSelected" Value="{Binding IsSelected, Mode=TwoWay}" />
</Style>
</TreeView.ItemContainerStyle>
</TreeView>
</Grid>
<Grid Grid.Row="3" Grid.Column="1" Background="LightBlue">
<TextBlock>Second Grid shows group of selected item in TreeViewMyModelList</TextBlock>
</Grid>
<Grid Grid.Row="2" Grid.Column="2" Background="green" Grid.RowSpan="2">
<TextBlock>More information about MyModel</TextBlock>
</Grid>
<Grid Grid.Row="4" Height="300">
</Grid>
<Grid Grid.Row="5" Grid.ColumnSpan="3" Background="Gray">
</Grid>
</Grid>
</Window>
英文:
I am totally new to whole WPF world. I want to create a simple (for now) app with only one window but in MVVM way.
I'm build it in .NET 7 with nuget packages: CommunityToolkit.Mvvm 8.1.0 and Microsoft.Xaml.Behaviors.Wpf 1.1.39.
I'm looking for a way to bind SelectedItem property in TreeViewMyModelList.
I want to retrieve MyModel object to show more detailed information on right panel (green).
The problem about SelectedItem is that it has only getter, no setter.
Also I wanted to handle SelectedItemChanged event, but since I want to do it in MVVM way I don't want to mess with my MainWindow.xaml.cs, the only things are there InitializeComponent(); and DataContext = new MainWindowViewModel();. Decided to add Microsoft.Xaml.Behaviors.Wpf but I don't even know how to use it.
Another thing that I want to achieve is to show on second DataGrid (lower, blue) a list of parent node selected item.
For example: if I click on Some_Name2 item then show list of MyModel objects grouped by GroupName Some_Group_01.
If I click on Some_Group6 item then show list of MyModel objects grouped by ShortName short_03 then by every group in it.
Upper DataGrid will be used to show data depends on FilterValue.
Why am I using ICollectionView? To share same collection between TreeView and DataGrid. Also for purpose of sorting, grouping and filtering.
Why am I virtualizing data? There is about 155,000 MyModel objects in my collection so it's quite laggy.
I would appreciate every tip and trick 
MyModel.cs
public sealed class MyModel
{
public string Name { get; set; }
public string Text { get; set; }
public string GroupName { get; set; }
public string ShortName { get; set; }
public int Number { get; set; }
public string Description { get; set; }
public string EvenMoreInfo { get; set; }
}
MainWindowViewModel.cs
public partial class MainWindowViewModel : ObservableObject
{
[ObservableProperty]
private string _filterValue = string.Empty;
private readonly List<LoadedDataFromFile> _loadedDataFromFile;
private List<MyModel> myModelList;
public ICollectionView TreeViewCollection { get; }
public MainWindowViewModel()
{
// loading data from file and transforming it into `MyModel` list
// for this example i populate it here
myModelList = new List<MyModel>()
{
new MyModel {Name="Some_Name1", GroupName="Some_Group_01", ShortName="short_01", Text="some_text", Number=1},
new MyModel {Name="Some_Name2", GroupName="Some_Group_01", ShortName="short_01", Text="some_text", Number=2},
new MyModel {Name="Some_Name3", GroupName="Some_Group_02", ShortName="short_01", Text="some_text", Number=3},
new MyModel {Name="Some_Name4", GroupName="Some_Group_02", ShortName="short_01", Text="some_text", Number=4},
new MyModel {Name="Some_Name5", GroupName="Some_Group_01", ShortName="short_02", Text="some_text", Number=5},
new MyModel {Name="Some_Name6", GroupName="Some_Group_01", ShortName="short_02", Text="some_text", Number=6},
new MyModel {Name="Some_Name7", GroupName="Some_Group_01", ShortName="short_02", Text="some_text", Number=7},
new MyModel {Name="Some_Name8", GroupName="Some_Group_02", ShortName="short_02", Text="some_text", Number=8},
new MyModel {Name="Some_Name9", GroupName="Some_Group_05", ShortName="short_03", Text="some_text", Number=9},
new MyModel {Name="Some_Name10", GroupName="Some_Group_05", ShortName="short_03", Text="some_text", Number=10},
new MyModel {Name="Some_Name11", GroupName="Some_Group_06", ShortName="short_03", Text="some_text", Number=11},
new MyModel {Name="Some_Name12", GroupName="Some_Group_07", ShortName="short_03", Text="some_text", Number=12},
};
TreeViewCollection = CollectionViewSource.GetDefaultView(myModelList);
TreeViewCollection.Filter = FilterCollection;
var pgd = new PropertyGroupDescription(nameof(MyModel.ShortName));
pgd.SortDescriptions.Add(new SortDescription("Name", ListSortDirection.Ascending));
TreeViewCollection.GroupDescriptions.Add(pgd);
pgd = new PropertyGroupDescription(nameof(MyModel.GroupName));
pgd.SortDescriptions.Add(new SortDescription("Name", ListSortDirection.Ascending));
TreeViewCollection.GroupDescriptions.Add(pgd);
TreeViewCollection.SortDescriptions.Add(new SortDescription(nameof(MyModel.Number), ListSortDirection.Ascending));
}
private bool FilterCollection(object obj)
{
if (obj is not MyModel model)
{
return false;
}
return model.Name!.ToLower().Contains(FilterValue.ToLower());
}
partial void OnFilterValueChanged(string value)
{
TreeViewCollection.Refresh();
}
}
MainWindow.xaml
<Window x:Class="WPFUI.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:Behaviors="http://schemas.microsoft.com/xaml/behaviors"
xmlns:viewmodels="clr-namespace:WPFUI.ViewModels" d:DataContext="{d:DesignInstance Type=viewmodels:MainWindowViewModel}"
mc:Ignorable="d"
FontSize="16"
Title="Title" Height="450" Width="800"
>
<Grid Background="Black">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="4*"/>
<ColumnDefinition Width="2*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition Height="4*" />
<RowDefinition Height="4*" />
<RowDefinition Height="*" />
<RowDefinition Height="20" />
</Grid.RowDefinitions>
<Grid Grid.Row="0" Grid.ColumnSpan="3">
<DockPanel>
<Menu DockPanel.Dock="Top">
<MenuItem Header="_File">
<MenuItem Header="_Open" />
</MenuItem>
</Menu>
</DockPanel>
</Grid>
<Grid Grid.Row="1">
<TextBox Text="{Binding FilterValue, UpdateSourceTrigger=PropertyChanged}" />
</Grid>
<Grid Grid.Row="2" Grid.Column="1" Background="DarkGreen">
<DataGrid x:Name="Grid_Upper" Grid.Row="2"
ItemsSource="{Binding TreeViewCollection}"
AlternatingRowBackground="GreenYellow"
HeadersVisibility="Column" AutoGenerateColumns="False"
CanUserAddRows="False" CanUserDeleteRows="False" CanUserReorderColumns="True"
CanUserResizeColumns="True" CanUserResizeRows="True" CanUserSortColumns="True"
ScrollViewer.VerticalScrollBarVisibility="Auto"
VirtualizingStackPanel.IsVirtualizing="True" VirtualizingStackPanel.IsVirtualizingWhenGrouping="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
>
<DataGrid.Columns>
<DataGridTextColumn Header="Name" Binding="{Binding Name}" />
<DataGridTemplateColumn Header="Text">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" Padding="10,10,10,10" MinWidth="100" Width="300" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
<DataGrid.GroupStyle>
<GroupStyle>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<Label Content="{Binding Name}" FontWeight="Bold"/>
</DataTemplate>
</GroupStyle.HeaderTemplate>
</GroupStyle>
</DataGrid.GroupStyle>
</DataGrid>
</Grid>
<Grid Grid.Row="2" Grid.RowSpan="2">
<TreeView x:Name="TreeViewMyModelList" ItemsSource="{Binding TreeViewCollection.Groups}"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
>
<Behaviors:Interaction.Triggers>
<Behaviors:EventTrigger EventName="SelectedItemChanged">
</Behaviors:EventTrigger>
</Behaviors:Interaction.Triggers>
<TreeView.ItemTemplate>
<HierarchicalDataTemplate ItemsSource="{Binding Path=Items}">
<TextBlock VerticalAlignment="Center" Text="{Binding Path=Name}"></TextBlock>
</HierarchicalDataTemplate>
</TreeView.ItemTemplate>
<TreeView.ItemContainerStyle>
<Style TargetType="TreeViewItem">
<Setter Property="IsSelected" Value="{Binding IsSelected, Mode=TwoWay}" />
</Style>
</TreeView.ItemContainerStyle>
</TreeView>
</Grid>
<Grid Grid.Row="3" Grid.Column="1" Background="LightBlue">
<TextBlock>Second Grid shows group of selected item in TreeViewMyModelList</TextBlock>
</Grid>
<Grid Grid.Row="2" Grid.Column="2" Background="green" Grid.RowSpan="2">
<TextBlock>More information about MyModel</TextBlock>
</Grid>
<Grid Grid.Row="4" Height="300">
</Grid>
<Grid Grid.Row="5" Grid.ColumnSpan="3" Background="Gray">
</Grid>
</Grid>
</Window>
答案1
得分: 1
ICollectionView用于在TreeView和DataGrid之间共享相同的集合，并且用于排序、分组和筛选。您不需要在这种情况下显式绑定到ICollectionView，因为绑定引擎将隐式使用集合的默认ICollectionView作为绑定源。
虚拟化数据是因为集合中有大约155,000个MyModel对象，这会导致性能问题。DataGrid默认情况下会虚拟化行，但TreeView不会。显示这么多项不明智，您可以考虑实施数据虚拟化和UI虚拟化，以提高性能。用户不会查看155,000个项，您可以允许用户在加载任何项之前应用筛选器。如果仍然有太多项，可以考虑在需要时动态获取项目/树级别。
要实现性能，并且期望显示足够多的项以需要滚动，您必须将ScrollViewer.VerticalScrollBarVisibility设置为Visible。将其设置为Auto会导致ScrollViewer不断测量其布局，以检查是否需要呈现滚动条。
至于两种解决方案，您可以选择根据您的应用程序需要的情况来实现其中一种。第一个解决方案使用TreeView.SelectedItemChanged事件来将选定项传递给DataContext，而第二个解决方案则添加了一个IsSelected属性到项目模型，并使用相关的Selected和Unselected事件来监视选择更改。您可以根据您的需求选择其中一个解决方案。
英文:
> "Why am I using ICollectionView? To share same collection between TreeView and DataGrid. Also for purpose of sorting, grouping and
> filtering."
ICollectionView is not relevant in terms of collection i.e. instance sharing unless you want to allow multiple data views to implement independent sorting/filtering/grouping (which you are not doing - both data views bind to the same ICollectionView). In this case you would have to create an ICollectionView for each data view explicitly (the default view can't be used).
Note, when binding to a collection, the binding engine will always implicitly use the collection's default ICollectionView as a binding source. This means binding to the collection as usual and using its default ICollectionView to e.g. filter/sort/group its conatined items is sufficient. You don't have to bind to the ICollectionView explicitly to see the results.
> "Why am I virtualizing data? There is about 155,000 MyModel objects in my collection so it's quite laggy."
DataGrid is virtualizing rows by default (your configuration is redundant). TreView is not. You would have to modify the TreeView template to enable UI virtualization.
Displaying 155k items is not wise. Aside from UI virtualization you should consider data virtualization too. A user will never view 155k items. Maybe he's interested in 10 items.
You can let the user apply a filter before you load any items. If this still results in too many items, you can consider to fetch items/tree levels dynamically in addition. For example, you preload the first three levels of the pre-filtered tree. Then when the user expands a level you read and add a new level.
If you are concerned about performance and expect to display enough items to require scrolling, you must set ScrollViewer.VerticalScrollBarVisibility to Visible. Setting it to Auto causes the ScrollViewer to measure its layout continuously to check whether the scroll bars have to be rendered or not.
Solution 1
A simple MVVM solution is to handle the TreeView.SelectedItemChanged event and send the value of the read-only TreeView.SelectedItem property to the DataContext:
MainWindow.xaml
<Window>
<Window.Resources>
<!-- Bind the control's SelectedTreeViewItem property to the DataContext -->
<Style TargetType="local:MainWindow">
<Setter Property="SelectedTreeViewItem"
Value="{Binding SelectedDataItem}" />
</Style>
</Window.Resources>
<TreeView SelectedItemChanged="TreeView_SelectedItemChanged" />
</Window>
MainWindow.xaml.cs
partial class MainWindow : Window
{
public object SelectedTreeViewItem
{
get => (object)GetValue(SelectedTreeViewItemProperty);
set => SetValue(SelectedTreeViewItemProperty, value);
}
public static readonly DependencyProperty SelectedTreeViewItemProperty = DependencyProperty.Register(
"SelectedTreeViewItem",
typeof(object),
typeof(MainWindow),
new FrameworkPropertyMetadata(default(object), FrameworkPropertyMetadataOptions.BindsTwoWayByDefault));
private void TreeView_SelectedItemChanged(object sender, RoutedPropertyChangedEventArgs<object> e)
{
var treeView = sender as System.Windows.Controls.TreeView;
this.SelectedTreeViewItem = treeView.SelectedItem;
}
}
Solution 2
Alternatively, you can add a IsSelected property to the item model. Providing a related Selected and Unselected event allows to monitor selection changes. This solution requires explicit lifetime management of the data items because of the attached event listeners. This becomes very important if the source collection is dynamic (items are added/removed frequently).
TreeViewItemModel
class TreeViewItemModel : INotifyPropertyChanged
{
// TODO::Implement INotifyPropertyChanged and raise PropertyCHanged event from property setters
public event EvenetHandler Selected;
public event EvenetHandler Unselected;
// TODO::Raise Selected and Unselected event from setter
public bool IsSelected { get; set; }
}
MainViewModel.cs
class MainViewModel : INotifyPropertyChanged
{
public ObservableCollection<TreeViewItemModel> TreeViewData { get; }
public void AddTreeViewData(TreeViewItemModel dataItem)
{
this.TreeViewData.Add(dataItem);
dataItem.Selected += OnTreeViewItemSelected;
dataItem.Selected += OnTreeViewItemUnselected;
}
public void RemoveTreeViewData(TreeViewItemModel dataItem)
{
this.TreeViewData.Remove(dataItem);
dataItem.Selected -= OnTreeViewItemSelected;
dataItem.Selected -= OnTreeViewItemUnselected;
}
public void OnTreeViewItemSelected(object sender, EventArgs e)
{
}
public void OnTreeViewItemUnselected(object sender, EventArgs e)
{
}
}
MainWindow.xaml
<TreeView>
<TreeView.ItemContainerStyle>
<Style TargetType="TreeViewItem">
<!-- Connect the item container to the item -->
<Setter Property="IsSelected" Value="{Binding IsSelected}" />
</Style>
</TreeView.ItemContainerStyle>
</TreeView>
答案2
得分: 0
以下是您要的翻译部分：
MainWindow.xaml.cs
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
DataContext = new MainWindowViewModel();
}
public object SelectedTreeViewItem
{
get => (object)GetValue(SelectedTreeViewItemProperty);
set => SetValue(SelectedTreeViewItemProperty, value);
}
public static readonly DependencyProperty SelectedTreeViewItemProperty = DependencyProperty.Register(
nameof(SelectedTreeViewItem),
typeof(object),
typeof(MainWindow),
new FrameworkPropertyMetadata(default(object), FrameworkPropertyMetadataOptions.BindsTwoWayByDefault));
private void TreeView_SelectedItemChanged(object sender, RoutedPropertyChangedEventArgs<object> e)
{
var treeView = sender as System.Windows.Controls.TreeView;
this.SelectedTreeViewItem = treeView.SelectedItem;
}
}
MainWindow.xaml
<Window x:Class="WPFUI.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:viewmodels="clr-namespace:WPFUI.ViewModels" d:DataContext="{d:DesignInstance Type=viewmodels:MainWindowViewModel}"
xmlns:local="clr-namespace:WPFUI"
mc:Ignorable="d"
FontSize="16"
Title="Title" Height="450" Width="800"
>
<Window.Resources>
<Style TargetType="local:MainWindow">
<Setter Property="SelectedTreeViewItem"
Value="{Binding SelectedDataItem}" />
</Style>
</Window.Resources>
<Grid Background="Black">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="4*"/>
<ColumnDefinition Width="2*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition Height="4*" />
<RowDefinition Height="4*" />
<RowDefinition Height="*" />
<RowDefinition Height="20" />
</Grid.RowDefinitions>
<Grid Grid.Row="0" Grid.ColumnSpan="3">
<DockPanel>
<Menu DockPanel.Dock="Top">
<MenuItem Header="_File">
<MenuItem Header="_Open" />
</MenuItem>
</Menu>
</DockPanel>
</Grid>
<Grid Grid.Row="1">
<TextBox Text="{Binding FilterValue, UpdateSourceTrigger=PropertyChanged}" />
</Grid>
<Grid Grid.Row="2" Grid.Column="1" Background="DarkGreen">
<DataGrid x:Name="Grid_Upper" Grid.Row="2"
ItemsSource="{Binding TreeViewCollection}"
AlternatingRowBackground="GreenYellow"
HeadersVisibility="Column" AutoGenerateColumns="False"
CanUserAddRows="False" CanUserDeleteRows="False" CanUserReorderColumns="True"
CanUserResizeColumns="True" CanUserResizeRows="True" CanUserSortColumns="True"
ScrollViewer.VerticalScrollBarVisibility="Visible"
VirtualizingStackPanel.IsVirtualizing="True" VirtualizingStackPanel.IsVirtualizingWhenGrouping="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
>
<DataGrid.Columns>
<DataGridTextColumn Header="Name" Binding="{Binding Name}" />
<DataGridTemplateColumn Header="Text">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" Padding="10,10,10,10" MinWidth="100" Width="300" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
<DataGrid.GroupStyle>
<GroupStyle>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<Label Content="{Binding Name}" FontWeight="Bold"/>
</DataTemplate>
</GroupStyle.HeaderTemplate>
</GroupStyle>
</DataGrid.GroupStyle>
</DataGrid>
</Grid>
<Grid Grid.Row="2" Grid.RowSpan="2">
<TreeView x:Name="TreeViewMyModelList" ItemsSource="{Binding TreeViewCollection.Groups}"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
SelectedItemChanged="TreeView_SelectedItemChanged"
ScrollViewer.VerticalScrollBarVisibility="Visible"
>
<TreeView.ItemTemplate>
<HierarchicalDataTemplate ItemsSource="{Binding Path=Items}">
<TextBlock VerticalAlignment="Center" Text="{Binding Path=Name}"></TextBlock>
</HierarchicalDataTemplate>
</TreeView.ItemTemplate>
<TreeView.ItemContainerStyle>
<Style TargetType="TreeViewItem">
<Setter Property="IsSelected" Value="{Binding IsSelected, Mode=TwoWay}" />
</Style>
</TreeView.ItemContainerStyle>
</TreeView>
</Grid>
<Grid Grid.Row="3" Grid.Column="1" Background="LightBlue">
<TextBlock>Second Grid shows group of selected item in TreeViewMyModelList</TextBlock>
</Grid>
<Grid Grid.Row="2" Grid.Column="2" Background="green" Grid.RowSpan="2">
<!--<TextBlock>More information about MyModel</TextBlock>-->
<TextBlock Text="{Binding SelectedDataItem.Name}"></TextBlock>
</Grid>
<Grid Grid.Row="4" Height="300">
</Grid>
<Grid Grid.Row="5" Grid.ColumnSpan="3" Background="Gray">
</Grid>
</Grid>
</Window>
MainWindowViewModel.cs
public partial class MainWindowViewModel : ObservableObject
{
[ObservableProperty]
private string _filterValue = string.Empty;
[ObservableProperty]
private object _selectedDataItem;
private readonly List<LoadedDataFromFile> _loadedDataFromFile;
private List<MyModel> myModelList;
public ICollectionView TreeViewCollection { get; }
public MainWindowViewModel()
{
// loading data from file and transforming it into `MyModel` list
// for this example i populate it here
myModelList = new List<MyModel>()
{
new MyModel {Name="Some_Name1", GroupName="Some_Group_01", ShortName="short_01", Text="some_text", Number=1},
new MyModel {Name="Some_Name2", GroupName="Some_Group_01", ShortName="short_01", Text="some_text", Number=2},
new MyModel {Name="Some_Name3", GroupName="Some_Group_02", ShortName="short_01", Text="some_text", Number=3},
new MyModel {Name="Some_Name4", GroupName="Some_Group_02", ShortName="short_01", Text="some_text", Number=4},
new MyModel {Name="Some_Name5", GroupName="Some
<details>
<summary>英文:</summary>
Answer above explains everything, but I decided to post full code after edits. I removed `Microsoft.Xaml.Behaviors.Wpf 1.1.39` nuget package since I'm not using it here.
**MainWindow.xaml.cs**
```cs
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
DataContext = new MainWindowViewModel();
}
public object SelectedTreeViewItem
{
get => (object)GetValue(SelectedTreeViewItemProperty);
set => SetValue(SelectedTreeViewItemProperty, value);
}
public static readonly DependencyProperty SelectedTreeViewItemProperty = DependencyProperty.Register(
nameof(SelectedTreeViewItem),
typeof(object),
typeof(MainWindow),
new FrameworkPropertyMetadata(default(object), FrameworkPropertyMetadataOptions.BindsTwoWayByDefault));
private void TreeView_SelectedItemChanged(object sender, RoutedPropertyChangedEventArgs<object> e)
{
var treeView = sender as System.Windows.Controls.TreeView;
this.SelectedTreeViewItem = treeView.SelectedItem;
}
}
MainWindow.xaml
<Window x:Class="WPFUI.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:viewmodels="clr-namespace:WPFUI.ViewModels" d:DataContext="{d:DesignInstance Type=viewmodels:MainWindowViewModel}"
xmlns:local="clr-namespace:WPFUI"
mc:Ignorable="d"
FontSize="16"
Title="Title" Height="450" Width="800"
>
<Window.Resources>
<Style TargetType="local:MainWindow">
<Setter Property="SelectedTreeViewItem"
Value="{Binding SelectedDataItem}" />
</Style>
</Window.Resources>
<Grid Background="Black">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="4*"/>
<ColumnDefinition Width="2*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition Height="4*" />
<RowDefinition Height="4*" />
<RowDefinition Height="*" />
<RowDefinition Height="20" />
</Grid.RowDefinitions>
<Grid Grid.Row="0" Grid.ColumnSpan="3">
<DockPanel>
<Menu DockPanel.Dock="Top">
<MenuItem Header="_File">
<MenuItem Header="_Open" />
</MenuItem>
</Menu>
</DockPanel>
</Grid>
<Grid Grid.Row="1">
<TextBox Text="{Binding FilterValue, UpdateSourceTrigger=PropertyChanged}" />
</Grid>
<Grid Grid.Row="2" Grid.Column="1" Background="DarkGreen">
<DataGrid x:Name="Grid_Upper" Grid.Row="2"
ItemsSource="{Binding TreeViewCollection}"
AlternatingRowBackground="GreenYellow"
HeadersVisibility="Column" AutoGenerateColumns="False"
CanUserAddRows="False" CanUserDeleteRows="False" CanUserReorderColumns="True"
CanUserResizeColumns="True" CanUserResizeRows="True" CanUserSortColumns="True"
ScrollViewer.VerticalScrollBarVisibility="Visible"
VirtualizingStackPanel.IsVirtualizing="True" VirtualizingStackPanel.IsVirtualizingWhenGrouping="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
>
<DataGrid.Columns>
<DataGridTextColumn Header="Name" Binding="{Binding Name}" />
<DataGridTemplateColumn Header="Text">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" Padding="10,10,10,10" MinWidth="100" Width="300" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
<DataGrid.GroupStyle>
<GroupStyle>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<Label Content="{Binding Name}" FontWeight="Bold"/>
</DataTemplate>
</GroupStyle.HeaderTemplate>
</GroupStyle>
</DataGrid.GroupStyle>
</DataGrid>
</Grid>
<Grid Grid.Row="2" Grid.RowSpan="2">
<TreeView x:Name="TreeViewMyModelList" ItemsSource="{Binding TreeViewCollection.Groups}"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
SelectedItemChanged="TreeView_SelectedItemChanged"
ScrollViewer.VerticalScrollBarVisibility="Visible"
>
<TreeView.ItemTemplate>
<HierarchicalDataTemplate ItemsSource="{Binding Path=Items}">
<TextBlock VerticalAlignment="Center" Text="{Binding Path=Name}"></TextBlock>
</HierarchicalDataTemplate>
</TreeView.ItemTemplate>
<TreeView.ItemContainerStyle>
<Style TargetType="TreeViewItem">
<Setter Property="IsSelected" Value="{Binding IsSelected, Mode=TwoWay}" />
</Style>
</TreeView.ItemContainerStyle>
</TreeView>
</Grid>
<Grid Grid.Row="3" Grid.Column="1" Background="LightBlue">
<TextBlock>Second Grid shows group of selected item in TreeViewMyModelList</TextBlock>
</Grid>
<Grid Grid.Row="2" Grid.Column="2" Background="green" Grid.RowSpan="2">
<!--<TextBlock>More information about MyModel</TextBlock>-->
<TextBlock Text="{Binding SelectedDataItem.Name}"></TextBlock>
</Grid>
<Grid Grid.Row="4" Height="300">
</Grid>
<Grid Grid.Row="5" Grid.ColumnSpan="3" Background="Gray">
</Grid>
</Grid>
</Window>
MainWindowViewModel.cs
public partial class MainWindowViewModel : ObservableObject
{
[ObservableProperty]
private string _filterValue = string.Empty;
[ObservableProperty]
private object _selectedDataItem;
private readonly List<LoadedDataFromFile> _loadedDataFromFile;
private List<MyModel> myModelList;
public ICollectionView TreeViewCollection { get; }
public MainWindowViewModel()
{
// loading data from file and transforming it into `MyModel` list
// for this example i populate it here
myModelList = new List<MyModel>()
{
new MyModel {Name="Some_Name1", GroupName="Some_Group_01", ShortName="short_01", Text="some_text", Number=1},
new MyModel {Name="Some_Name2", GroupName="Some_Group_01", ShortName="short_01", Text="some_text", Number=2},
new MyModel {Name="Some_Name3", GroupName="Some_Group_02", ShortName="short_01", Text="some_text", Number=3},
new MyModel {Name="Some_Name4", GroupName="Some_Group_02", ShortName="short_01", Text="some_text", Number=4},
new MyModel {Name="Some_Name5", GroupName="Some_Group_01", ShortName="short_02", Text="some_text", Number=5},
new MyModel {Name="Some_Name6", GroupName="Some_Group_01", ShortName="short_02", Text="some_text", Number=6},
new MyModel {Name="Some_Name7", GroupName="Some_Group_01", ShortName="short_02", Text="some_text", Number=7},
new MyModel {Name="Some_Name8", GroupName="Some_Group_02", ShortName="short_02", Text="some_text", Number=8},
new MyModel {Name="Some_Name9", GroupName="Some_Group_05", ShortName="short_03", Text="some_text", Number=9},
new MyModel {Name="Some_Name10", GroupName="Some_Group_05", ShortName="short_03", Text="some_text", Number=10},
new MyModel {Name="Some_Name11", GroupName="Some_Group_06", ShortName="short_03", Text="some_text", Number=11},
new MyModel {Name="Some_Name12", GroupName="Some_Group_07", ShortName="short_03", Text="some_text", Number=12},
};
TreeViewCollection = CollectionViewSource.GetDefaultView(myModelList);
TreeViewCollection.Filter = FilterCollection;
var pgd = new PropertyGroupDescription(nameof(MyModel.ShortName));
pgd.SortDescriptions.Add(new SortDescription("Name", ListSortDirection.Ascending));
TreeViewCollection.GroupDescriptions.Add(pgd);
pgd = new PropertyGroupDescription(nameof(MyModel.GroupName));
pgd.SortDescriptions.Add(new SortDescription("Name", ListSortDirection.Ascending));
TreeViewCollection.GroupDescriptions.Add(pgd);
TreeViewCollection.SortDescriptions.Add(new SortDescription(nameof(MyModel.Number), ListSortDirection.Ascending));
}
private bool FilterCollection(object obj)
{
if (obj is not MyModel model)
{
return false;
}
return model.Name!.ToLower().Contains(FilterValue.ToLower());
}
partial void OnFilterValueChanged(string value)
{
TreeViewCollection.Refresh();
}
partial void OnSelectedDataItemChanged(object value)
{
// do something
}
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论