c# - 使用 WPF 从自定义 JSON 显示 TreeView

Question

我正在尝试使用 TreeView 呈现一个未知的 JSON。我还需要编辑这些 JSON 对象中的字符串并将它们写回，因此我需要某种形式的字典，但键可以从层次结构的一侧重复到另一侧(JSON 示例中的“响应”)。我已经研究了又研究，但我无法找到有用的东西。大多数问题也是针对 winforms 或不使用 MVVM 提出的，我无法将其翻译成我所追求的。

JSON 示例:

{
  "universal": {
    "regionalSettings": {
      "culture": {
        "en-GB": "United Kingdom (en-GB)",
        "mk-MK": "Македонија (mk-MK)",
        "sq-MK": "Shqipëria (sq-MK)",
      },
      "language": {
        "en-GB": "English (United Kingdom)",
        "mk": "Македонски",
        "sq": "Shqipe",
      },
      "timeZone": {
        "Europe/Amsterdam": "Europe/Amsterdam",
        "Europe/Andorra": "Europe/Andorra",
        "Europe/Astrakhan": "Europe/Astrakhan",
        "Europe/Athens": "Europe/Athens",
        "Europe/Belgrade": "Europe/Belgrade",
        "Europe/Berlin": "Europe/Berlin",
        "Europe/Bratislava": "Europe/Bratislava",
        "Europe/Brussels": "Europe/Brussels",
      }
    }
  }
}

查看片段:

                <ScrollViewer>
                    <TreeView>
                        <HierarchicalDataTemplate ItemsSource="{Binding Tree}" />
                    </TreeView>
                </ScrollViewer>

ViewModel 片段:

public class SomeViewModel
{

    public JToken Tree { get; set; }


    private void PopulateTreeView()
    {
        var jsonReader = new JsonReader();
        var jsonText = jsonReader.Read("C:\\imaginary_path\\example.json");
        var token = JToken.Parse(jsonText);
        
        // where magic should happen

        Tree = token;
    }
}

“奇迹应该发生的地方”标记了我缺少代码的地方。在那里我需要以某种方式分层表示 json 并制作成一种我可以传递给 TreeView 的格式，同时还包括字符串(在对象中，而不是在 TreeView 本身中，因为我需要在特定项目时显示这些字符串在树中被选中)，目前我正在传递 JObject，它使 TreeView 显示显示“System.Windows.HierarchicalDataTemplate”的根。

我衷心感谢所有提前提供帮助的人。

Answer 1

正如我们在评论中得出的结论，某些 Json 编辑器 可能适合实现目标。

我已经实现了一个示例，如何使用 .NET Core System.Text.Json ( documentation ) 读取/写入 json 并使用 TreeView.

我没有使用 Calibrum.Micro，也不熟悉它，但没有使用任何外部库。我在解决方案中添加了两个辅助类。

public class NotifyPropertyChanged : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;
    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
        => PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}

public class RelayCommand : ICommand
{
    private readonly Action<object> _execute;
    private readonly Predicate<object> _canExecute;

    public event EventHandler CanExecuteChanged
    {
        add => CommandManager.RequerySuggested += value;
        remove => CommandManager.RequerySuggested -= value;
    }

    public RelayCommand(Action<object> execute, Predicate<object> canExecute = null)
        => (_execute, _canExecute) = (execute, canExecute);

    public bool CanExecute(object parameter)
        => _canExecute == null || _canExecute(parameter);

    public void Execute(object parameter)
        => _execute(parameter);
}

数据模型实现

public class TreeNode : NotifyPropertyChanged
{
    public static MainViewModel MainVM { get; set; }

    private bool _isSelected;
    private string _name;
    public bool IsSelected 
    { 
        get => _isSelected; 
        set
        {
            _isSelected = value;
            if (_isSelected) MainVM.SelectedItem = this;
        } 
    }
    public string Name 
    { 
        get => _name; 
        set
        {
            _name = value;
            OnPropertyChanged();
        } 
    }
}

public class TreeObject : TreeNode
{
    private ObservableCollection<TreeNode> _children;

    public ObservableCollection<TreeNode> Children
    { 
        get => _children; 
        set
        {
            _children = value;
            OnPropertyChanged();
        } 
    }
}

public class TreeValue : TreeNode
{
    private string _value;
    public string Value
    { 
        get => _value; 
        set
        {
            _value = value;
            OnPropertyChanged();
        } 
    }
}

MainWindow 的 View 模型

public class MainViewModel : NotifyPropertyChanged
{
    private ObservableCollection<TreeNode> _treeItems;
    private TreeNode _selectedItem;
    private ICommand _loadCommand;
    private ICommand _saveCommand;

    public ObservableCollection<TreeNode> TreeItems
    {
        get => _treeItems;
        set
        {
            _treeItems = value;
            OnPropertyChanged();
        }
    }

    public TreeNode SelectedItem
    {
        get => _selectedItem;
        set
        {
            _selectedItem = value;
            OnPropertyChanged();
        }
    }

    public ICommand LoadCommand => _loadCommand ??= new RelayCommand(parameter =>
    {
        TreeItems = new ObservableCollection<TreeNode>();
        JsonReaderOptions options = new JsonReaderOptions
        {
            AllowTrailingCommas = true,
            CommentHandling = JsonCommentHandling.Skip
        };

        Utf8JsonReader reader = new Utf8JsonReader(File.ReadAllBytes("example.json"), options);
        reader.Read();
        ReadJson(ref reader, TreeItems);
    });

    public ICommand SaveCommand => _saveCommand ??= new RelayCommand(parameter =>
    {
        JsonWriterOptions options = new JsonWriterOptions
        {
            Indented = true,
            Encoder = JavaScriptEncoder.UnsafeRelaxedJsonEscaping
        };
        using Stream stream = File.Create("out.json");
        using Utf8JsonWriter writer = new Utf8JsonWriter(stream, options);
        writer.WriteStartObject();
        WriteJson(writer, TreeItems);
    });

    private void WriteJson(Utf8JsonWriter writer, ObservableCollection<TreeNode> items)
    {
        foreach (TreeNode node in items)
        {
            switch (node)
            {
                case TreeValue valueNode:
                    writer.WriteString(valueNode.Name, valueNode.Value);
                    break;
                case TreeObject objectNode:
                    writer.WriteStartObject(objectNode.Name);
                    WriteJson(writer, objectNode.Children);
                    break;
            }
        }
        writer.WriteEndObject();
    }
        
    private void ReadJson(ref Utf8JsonReader reader, ObservableCollection<TreeNode> items)
    {
        bool complete = false;
        string propertyName = "";
        while (!complete && reader.Read())
        {
            switch (reader.TokenType)
            {
                case JsonTokenType.PropertyName:
                    propertyName = reader.GetString();
                    break;
                case JsonTokenType.String:
                    items.Add(new TreeValue { Name = propertyName, Value = reader.GetString() });
                    break;
                case JsonTokenType.StartObject:
                    ObservableCollection<TreeNode> children = new ObservableCollection<TreeNode>();
                    items.Add(new TreeObject { Name = propertyName, Children = children });
                    ReadJson(ref reader, children);
                    break;
                case JsonTokenType.EndObject:
                    complete = true;
                    break;
            }
        }
    }

    public MainViewModel()
    {
        TreeItems = new ObservableCollection<TreeNode>();
        TreeNode.MainVM = this;
    }
}

查看(整个标记)

<Window x:Class="WpfApp1.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:WpfApp1"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Window.DataContext>
        <local:MainViewModel/>
    </Window.DataContext>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <TreeView Margin="5" ItemsSource="{Binding TreeItems}">
            <TreeView.Resources>
                <HierarchicalDataTemplate DataType="{x:Type local:TreeObject}" ItemsSource="{Binding Children}">
                    <TextBlock Text="{Binding Name}"/>
                </HierarchicalDataTemplate>
                <DataTemplate DataType="{x:Type local:TreeValue}">
                    <TextBlock Text="{Binding Name}"/>
                </DataTemplate>
                <Style TargetType="TreeViewItem">
                    <Setter Property="IsSelected" Value="{Binding IsSelected}" />
                    <Setter Property="IsExpanded" Value="True"/>
                </Style>
            </TreeView.Resources>
        </TreeView>
        <StackPanel Margin="5" Grid.Column="1">
            <StackPanel Orientation="Horizontal">
                <Button Content="Load" Padding="5,0" Command="{Binding LoadCommand}"/>
                <Button Content="Save" Padding="5,0" Margin="5,0,0,0" Command="{Binding SaveCommand}"/>
            </StackPanel>
            <TextBlock Text="Name"/>
            <TextBox Text="{Binding SelectedItem.Name, UpdateSourceTrigger=PropertyChanged}"/>
            <ContentControl Content="{Binding SelectedItem}" Margin="0,5">
                <ContentControl.Resources>
                    <DataTemplate DataType="{x:Type local:TreeObject}">
                        <WrapPanel>
                            <TextBlock Text="{Binding Children.Count, StringFormat=Children count: {0}}"/>
                        </WrapPanel>
                    </DataTemplate>
                    <DataTemplate DataType="{x:Type local:TreeValue}">
                        <StackPanel Orientation="Vertical">
                            <TextBlock Text="Value"/>
                            <TextBox Text="{Binding Value, UpdateSourceTrigger=PropertyChanged}"/>
                        </StackPanel>
                    </DataTemplate>
                </ContentControl.Resources>
            </ContentControl>
        </StackPanel>
    </Grid>
</Window>