多个DataContext 一TreeView 一DataGrid 不能同时处于活动状态

Question

我在 youtube 视频之后创建了一个树视图，然后创建了一个数据网格，显示来自所选 tar.gz 文件的一些文件。他们都使用 DataContext 在程序中展示自己。问题是显示 DataGrid 时 TreeView 消失了。我想问题是两者都不能像我使用的那样使用 DataContext 但我不知道它的解决方案。

XAML 代码

<Window x:Class="RFAnalyzerMain.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:RFAnalyzerMain"
        mc:Ignorable="d"
        Title="MainWindow"
        Height="600" Width="900"
        MinHeight="400" MinWidth="750"
        Closing="Window_Closing" Loaded="Window_Loaded">
    <Border Padding="2">
        <Grid>
            <!-- #region Grid Definitions -->

            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="200" />
                <ColumnDefinition Width="10*" />
                <ColumnDefinition Width="15" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="20" />
                <RowDefinition Height="20" />
                <RowDefinition Height="25*" />
                <RowDefinition Height="20" />
            </Grid.RowDefinitions>

            <!--#endregion-->

            <DockPanel Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3">
                <Menu DockPanel.Dock="Top">
                    <MenuItem Header="_File">
                        <MenuItem Header="Choose File to Read" x:Name="ChosenFile" Click="ChosenFile_Click" />
                    </MenuItem>
                </Menu>
            </DockPanel>

            <Border Grid.Row="2" Padding="5 0" BorderThickness="0" BorderBrush="Gray">
                <Grid>

                    <!-- Grid Definitions -->
                    <Grid.RowDefinitions>
                        <RowDefinition Height="25" />
                        <RowDefinition Height="*" />
                        <RowDefinition Height="20" />
                    </Grid.RowDefinitions>

                    <TextBlock Text="Folder" FontWeight="Bold" FontSize="18" Grid.Row="0"
                       VerticalAlignment="Center" HorizontalAlignment="Left" />

                    <!-- A TreeView of Fodlers -->
                    <Grid Grid.Row="1" Margin="0 0 0 5">
                        <TreeView x:Name="FolderView" ItemsSource="{Binding Items}" FontSize="10">
                            
                            <TreeView.ItemContainerStyle>
                                <Style TargetType="{x:Type TreeViewItem}">
                                    <Setter Property="IsExpanded" Value="{Binding IsExpanded, Mode=TwoWay}" />
                                </Style>
                            </TreeView.ItemContainerStyle>

                            <TreeView.ItemTemplate>
                                <HierarchicalDataTemplate ItemsSource="{Binding Children}">
                                    <StackPanel Orientation="Horizontal">
                                        <Image Width="15" Margin="3"
                                                   Source="{Binding Type,
                                                       Converter={x:Static local:HeaderToImageConverter.Instance}}" />
                                        <TextBlock VerticalAlignment="Center" Text="{Binding Name}" />
                                    </StackPanel>
                                </HierarchicalDataTemplate>
                            </TreeView.ItemTemplate>
                            
                        </TreeView>
                    </Grid>


                    <Button Content="Read" Grid.Row="2" Margin="0 0 0 0" Width="60" />
                </Grid>
            </Border>

            <DataGrid Grid.Row="2" Grid.Column="1" ItemsSource="{Binding FileProperties}" />

            <Button Grid.Column="2" Grid.Row="2">
                <Image Source="Images/Button Left Arrow.png" Width="10" />
            </Button>

        </Grid>
    </Border>
</Window>

代码后面

using System.IO;
using System.Windows;

namespace RFAnalyzerMain
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        #region Constructor

        /// <summary>
        /// Default Constructor
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();
            // Treeview
            DataContext = new DirectoryStructureViewModel();
        }

        #endregion

        #region User Events

        /// <summary>
        /// Choose a file from the explorer
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void ChosenFile_Click(object sender, RoutedEventArgs e)
        {
            ExplorerHandler.OpenExplorer();
            // Writes out all the files inside the file opened in the explorer
            DataContext = new FilePropertiesViewModel();
        }

        #endregion

        #region Starting Program

        private void Window_Loaded(object sender, RoutedEventArgs e)
        {
            if (FilePaths.GZipDirectory.Exists == true)
                Remove.FilesAndFolders();
        }

        #endregion

        #region Closing Program

        private void Window_Closing(object sender, System.ComponentModel.CancelEventArgs e)
        {
            Remove.FilesAndFolders();
        }

        #endregion


    }
}

如果您需要查看更多代码，请询问，我会编辑帖子并添加要求的代码。

Answer 1

既然你在代码隐藏中实现了你的逻辑，为什么不在事件处理程序中简单地设置DataGrid 的DataContext 呢？：

private void ChosenFile_Click(object sender, RoutedEventArgs e)
{
    ExplorerHandler.OpenExplorer();
    // Writes out all the files inside the file opened in the explorer
    dataGrid.DataContext = new FilePropertiesViewModel();
}

XAML：

<DataGrid x:Name="dataGrid" Grid.Row="2" Grid.Column="1" ItemsSource="{Binding FileProperties}" />

那么当你点击按钮时TreeView不会消失。

另一种选择是使用@Sinatr 建议的共享视图模型，但这需要对您当前拥有的内容进行一些重构。

Answer 2

通常你必须设置一次DataContext：

public MainWindow()
{
    InitializeComponent();
    DataContext = new MainWindowViewModel();
}

视图模型可以有多个属性：

public class MainWindowViewModel: INotifyPropertyChanaged
{
    public DirectoryStructureViewModel Files { get; } = new DirectoryStructureViewModel();

    FilePropertiesViewModel _selectedFile;
    public FilePropertiesViewModel SelectedFile
    {
        get => _selectedFile;
        set
        {
            _selectedFile = value;
            OnPropertyChanged();
            OnPropertyChanged(nameof(IsSelectedFileVisible));
        }
    }
    public bool IsSelectedFileVisible => SelectedFile != null;
}

您可以在视图中绑定的对象：

<TreeView ItemsSource="{Binding Files.Items}"
          SelectedItemChanged="TreeView_OnSelectedItemChanged" ... />
<DataGrid ItemsSource="{Binding SelectedFile.FileProperties}"
          Visibility="{Binding IsSelectedFileVisible, Converter={StaticResource BoolToVis}}" ... />

和

void TreeView_OnSelectedItemChanged(...)
{
    var vm = (MainWindowViewModel)DataContext;
    vm.SelectedFile = ...
}

参考：1、2、3。