WPF中的多列树状视图

Question

任何人都知道我可以像WPF中的多列树状视图一样获得控件吗？

Answer 1

我已经根据旧博客文章here实施了此操作。但是如果我没有记错的话，我必须做一些手动工作才能让事情顺利进行。具体与滚动条。

但是，这应该给你一个良好的开端。

Answer 2

在CodeProject上的一篇文章，可能会帮助：

http://www.codeproject.com/KB/WPF/TreeListView.aspx

有不少其他有用articles有关于WPF的TreeView。

Answer 3

SharpDevelop有ListView子类叫做SharpTreeView它可以做你正在寻找的东西。

你可以看到这个控制的SharpDevelop的 “观察” 窗口的一个活生生的例子：在监视窗口中使用

XAML（在5.1.0测试版）：

<tv:SharpGridView x:Key="variableGridView" AllowsColumnReorder="False"> 
    <GridView.Columns> 
     <GridViewColumn Header="{core:Localize MainWindow.Windows.Debug.LocalVariables.NameColumn}" Width="200"> 
      <GridViewColumn.CellTemplate> 
       <DataTemplate> 
        <StackPanel Orientation="Horizontal"> 
         <tv:SharpTreeNodeView /> 
         <local:AutoCompleteTextBox x:Name="name" Margin="-6 0 0 0" MinWidth="100" Text="{Binding Node.Name}" IsEditable="{Binding Node.CanSetName}"> 
          <local:AutoCompleteTextBox.ContextMenu> 
           <MultiBinding Converter="{StaticResource menuBuilder}"> 
            <Binding Path="Node.ContextMenuAddInTreeEntry" /> 
            <Binding Path="Node" /> 
           </MultiBinding> 
          </local:AutoCompleteTextBox.ContextMenu> 
         </local:AutoCompleteTextBox> 
        </StackPanel> 
       </DataTemplate> 
      </GridViewColumn.CellTemplate> 
     </GridViewColumn> 
     <GridViewColumn Header="{core:Localize MainWindow.Windows.Debug.LocalVariables.ValueColumn}" Width="200"> 
      <GridViewColumn.CellTemplate> 
       <DataTemplate> 
        <local:AutoCompleteTextBox 
         MinWidth="100" 
         Text="{Binding Node.Value}" 
         IsEditable="{Binding Node.CanSetValue}"> 
         <local:AutoCompleteTextBox.ContextMenu> 
          <MultiBinding Converter="{StaticResource menuBuilder}"> 
           <Binding Path="Node.ContextMenuAddInTreeEntry" /> 
           <Binding Path="Node" /> 
          </MultiBinding> 
         </local:AutoCompleteTextBox.ContextMenu> 
        </local:AutoCompleteTextBox> 
       </DataTemplate> 
      </GridViewColumn.CellTemplate> 
     </GridViewColumn> 
     <GridViewColumn Header="{core:Localize MainWindow.Windows.Debug.LocalVariables.TypeColumn}" Width="200"> 
      <GridViewColumn.CellTemplate> 
       <DataTemplate> 
        <local:AutoCompleteTextBox MinWidth="100" Text="{Binding Node.Type}" IsEditable="False"> 
         <local:AutoCompleteTextBox.ContextMenu> 
          <MultiBinding Converter="{StaticResource menuBuilder}"> 
           <Binding Path="Node.ContextMenuAddInTreeEntry" /> 
           <Binding Path="Node" /> 
          </MultiBinding> 
         </local:AutoCompleteTextBox.ContextMenu> 
        </local:AutoCompleteTextBox> 
       </DataTemplate> 
      </GridViewColumn.CellTemplate> 
     </GridViewColumn> 
    </GridView.Columns> 
</tv:SharpGridView> 

资源被设置为SharpTreeView控件的View属性。

Answer 4

如果你不需要列标题，这很容易。您只需提供物品容器模板，在右侧添加固定宽度的网格列，然后将其绑定到物品的相关数据。

一个TreeView控件的默认项容器有定义为（增加了一些评论）的网格：

<Grid> 
     <Grid.ColumnDefinitions> 
      <!--Expander--><ColumnDefinition MinWidth="19" Width="Auto"/> 
      <!--Item--><ColumnDefinition Width="Auto"/> 
      <!--Overflow--><ColumnDefinition Width="*"/> 
     </Grid.ColumnDefinitions> 
     <Grid.RowDefinitions> 
      <!--Current Item--><RowDefinition Height="Auto"/> 
      <!--Sub-items--><RowDefinition/> 
     </Grid.RowDefinitions> 
     <ToggleButton x:Name="Expander" ClickMode="Press" IsChecked="{Binding IsExpanded, RelativeSource={RelativeSource TemplatedParent}}" Style="{StaticResource ExpandCollapseToggleStyle}"/> 
     <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Grid.Column="1" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true"> 
      <ContentPresenter x:Name="PART_Header" ContentSource="Header" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
     </Border> 
     <ItemsPresenter x:Name="ItemsHost" Grid.ColumnSpan="2" Grid.Column="1" Grid.Row="1"/> 
    </Grid> 

所以才扩大这种网格包含可预见的宽度列在右边，你将有列。

• 添加列定义为新列，使其自动调整大小
• 更新“ItemsHost”的列跨度跨越添加的列
• 可预见的宽度控制添加到该列：

影响

部分：

<Grid> 
... 
    <ColumnDefinition Width="Auto"/> 
... 
    <ItemsPresenter ... Grid.ColumnSpan="3" ... /> 
... 
    <Border Grid.Column="3"><!--Add column data here--></Border> 
... 
</Grid> 

如果添加的边框是所有行相同的宽度，你将有一个查看感觉像一个列与树视图。这显然不能很好地扩展，但如果只需要一个快速和肮脏的解决方案，您应该可以在几分钟内完成此操作，而无需添加外部控件/库的依赖关系。

我们的需求迅速增长，我们在问题使用添加外树列标签网格和数据绑定列的宽度有这些“列”的宽度[生成树控制的实际宽度列自动大小的列]。这是有效的，这就是我所说的辩护。

如果您不介意（或需要）跨所有列延伸的选择框（“Bd”边框），则也可以在生成的项目模板而不是项目容器中完成此方法。