XAML Windows 存储分层视图

Question

我想要分层显示我的项目。

例如我的项目看起来像这样伪class:

public class ListItem
{
  public string Title {get; set;}
  public ObservableCollection<ListItem> Children {get; set;}
}

我想让它们像这样显示：

我不想折叠或展开项目 - 我只想为不同级别设置不同的边距。

如何在 XAML 和 Windows 商店应用程序中实现此目的？（我在 Whosebug 上看到 this 但它只允许我有 2 个级别）

编辑：我还查看了 XAML 工具包中的 TreeView，但我没有找到禁用 "expand-collapse".

的方法

Answer 1

处理此问题的最佳方法是将 ListView 和 DataTemplateSelector 与包装器一起使用。我的建议是 Class 代表 ListView 中的每一项。在 DataTemplateSelector 中，您可以根据进入模板选择器的 Class 类型来选择要做什么以及 xaml / 自定义控件用于每个项目。您可以将行为指定为隐藏或显示每个项目的点击。这是 msdn 关于如何使用它（对于 ListView 和 GridView 几乎相同）

Answer 2

感谢您的回答！我找到了适合我需要的解决方案。

我按照这个 article 并以正确的顺序对我的列表进行了排序。然后我写了一个 LevelToMargin-Converter，它将项目的级别转换为边距。例如：

级别 0 -> 保证金：0
级别 1 -> 保证金：20
2 级 -> 保证金：40
...

LevelToMargin 转换器：

public class LevelToMarginConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        var v = (value as int?)*20;
        return new Thickness(System.Convert.ToDouble(v),0, 0, 0);
    }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        var t = value is Thickness ? (Thickness) value : new Thickness();
        return t.Left / 20;
    }
}

然后我将我的级别绑定到 ListItem 的边距

 <DataTemplate x:Key="GradingCriteriaListDataTemplate"
              x:Name="GradingCriteriaListDataTemplate">
    <Grid Width="400">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <Border Padding="5,5,5,5"
                Background="#eaeaea"
                BorderBrush="Black"
                Margin="{Binding Level, Converter={StaticResource  LevelToMarginConverter}}"
                Grid.Column="0">

            <Border Margin="15,5,5,5"
                    Height="50"
                    VerticalAlignment="Stretch"
                    BorderBrush="Yellow"
                    BorderThickness="10,0,0,0">
                <StackPanel Margin="20,0,0,0">
                    <TextBlock FontWeight="Bold"
                               Text="{Binding Name}" />
                </StackPanel>
            </Border>
        </Border>
    </Grid>
</DataTemplate>

对我有用:)

XAML Windows 存储分层视图

XAML Windows Store hierarchical View

winrt-xaml

hierarchy