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」邊框），則也可以在生成的項目模板而不是項目容器中完成此方法。