Question

我希望对我的项目进行分层显示。

我的项目例如看起来像这个伪类：

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

我想让它们显示如下：

我不想折叠或扩展项目 - 我只想在不同的级别上使用不同的边距。

如何在XAML和Windows应用商店应用中实现这一目标？（我在Stackoverflow上看到this，但它只允许我有2个级别）

编辑：我还查看了XAML Toolkit中的TreeView，但我没有找到一种方法来禁用“expand-collapse”。

Answer 1

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

Answer 2

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

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

0级 - ＆gt;保证金：0
1级 - ＆gt;保证金：20
2级 - ＆gt;保证金：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;
    }
}

然后我将我的Level绑定到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 Store分层视图

2 个答案: