填充更多嵌套的WinUI TreeView

问题描述 投票:0回答:1

我想使用树视图在我的 UI 上显示视图模型,但我找不到一种方法来深入多个节点 该视图应显示人员及其地址以及地址详细信息


using System.Collections.ObjectModel;
using System.ComponentModel;

public class Person : INotifyPropertyChanged
{
    public string Name { get; set; }
    public Address Address { get; set; }

    public event PropertyChangedEventHandler PropertyChanged;
}

public class Address : INotifyPropertyChanged
{
    public string Street { get; set; }
    public Postcode Postcode { get; set; }

    public event PropertyChangedEventHandler PropertyChanged;
}

public class Postcode : INotifyPropertyChanged
{
    public string Code { get; set; }
    public string Name { get; set; }

    public event PropertyChangedEventHandler PropertyChanged;
}

尝试使用数据模板将它们嵌套在一起,但没有成功

c# mvvm winui-3 winui winui-xaml
1个回答
0
投票

您可以使用 DataTemplateSelector 来实现此目的。例如:

public partial class Person(string name, Address address) : ObservableObject
{
    [ObservableProperty]
    private string _name = name;

    [ObservableProperty]
    private Address _address = address;
}


public partial class Address(string street, Postcode postcode) : ObservableObject
{
    [ObservableProperty]
    private string _street = street;

    [ObservableProperty]
    private Postcode _postcode = postcode;
}


public partial class Postcode(string code, string name) : ObservableObject
{
    [ObservableProperty]
    private string _code = code;

    [ObservableProperty]
    private string _name = name;
}

public class TreeViewItemTemplateSelector : DataTemplateSelector
{
    public DataTemplate PersonTemplate { get; set; } = new();

    public DataTemplate AddressTemplate { get; set; } = new();

    public DataTemplate PostcodeTemplate { get; set; } = new();

    protected override DataTemplate SelectTemplateCore(object item)
    {
        return item switch
        {
            Person => PersonTemplate,
            Address => AddressTemplate,
            Postcode => PostcodeTemplate,
            _ => base.SelectTemplateCore(item)
        };
    }
}

public class SingleItemToCollectionConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        return new[] { value };
    }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        throw new NotImplementedException();
    }
}
<Page.Resources>
    <local:SingleItemToCollectionConverter x:Key="SingleItemToCollectionConverter" />

    <local:TreeViewItemTemplateSelector x:Key="TreeViewItemTemplateSelector">

        <local:TreeViewItemTemplateSelector.PersonTemplate>
            <DataTemplate x:DataType="local:Person">
                <TreeViewItem
                    Content="{x:Bind Name, Mode=OneWay}"
                    ItemsSource="{x:Bind Address, Mode=OneWay, Converter={StaticResource SingleItemToCollectionConverter}}" />
            </DataTemplate>
        </local:TreeViewItemTemplateSelector.PersonTemplate>

        <local:TreeViewItemTemplateSelector.AddressTemplate>
            <DataTemplate x:DataType="local:Address">
                <TreeViewItem
                    Content="{x:Bind Street, Mode=OneWay}"
                    ItemsSource="{x:Bind Postcode, Mode=OneWay, Converter={StaticResource SingleItemToCollectionConverter}}" />
            </DataTemplate>
        </local:TreeViewItemTemplateSelector.AddressTemplate>

        <local:TreeViewItemTemplateSelector.PostcodeTemplate>
            <DataTemplate x:DataType="local:Postcode">
                <TreeViewItem
                    Content="{x:Bind Name, Mode=OneWay}"
                    ItemsSource="{x:Bind Code, Mode=OneWay, Converter={StaticResource SingleItemToCollectionConverter}}" />
            </DataTemplate>
        </local:TreeViewItemTemplateSelector.PostcodeTemplate>

    </local:TreeViewItemTemplateSelector>
</Page.Resources>

<TreeView
    ItemTemplateSelector="{StaticResource TreeViewItemTemplateSelector}"
    ItemsSource="{x:Bind ViewModel.People, Mode=OneWay}" />

ObservableObjectObservableProperty 来自 CommunityToolkit.Mvvm NuGet 包。

© www.soinside.com 2019 - 2024. All rights reserved.