Wpf 具有多个列的TreeView

我有一个基本类，看起来像这样：

public class Item
{
    private string      name;
    private bool        visible;
    private double      value;
    private Item        parent;
    private List<Item>  children = new List<Item>();
    …
}

公共类项目
{
私有字符串名称；
私有布尔可见；
私人双重价值；
私人物品父母；
私有列表子项=新列表（）；
…
}

我有一个需要在树视图中显示的项目列表。对于每个项目，我需要显示以下字段：

• “可见”作为复选框
• “名称”作为文本块
• “值”作为滑块

我想通过使用MVVM来实现这一点，因此我定义了以下类“ItemViewModel”和“ItemCollectionViewModel”，我将把我的treeview绑定到这些类

我尝试了以下XAML：

<TreeView ItemsSource="{Binding ItemViewModelList}">
    <TreeView.ItemContainerStyle>
        <Style TargetType="{x:Type TreeViewItem}">
            <Setter Property="IsExpanded" Value="{Binding IsExpanded, Mode=TwoWay}" />
            <Setter Property="IsSelected" Value="{Binding IsSelected, Mode=TwoWay}" />
            <Setter Property="FontWeight" Value="Normal" />
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="FontWeight" Value="Bold" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </TreeView.ItemContainerStyle>

    <TreeView.ItemTemplate>
        <HierarchicalDataTemplate ItemsSource="{Binding Children}">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition SharedSizeGroup="VisibiltyCol" />
                    <ColumnDefinition SharedSizeGroup="NameCol" />
                    <ColumnDefinition SharedSizeGroup="ValueCol" />
                </Grid.ColumnDefinitions>
                <CheckBox  Grid.Column="0" IsChecked="{Binding Visible}"  Margin="5" />
                <TextBlock Grid.Column="1" Text="{Binding Name}" Margin="5" />
                <Slider    Grid.Column="2" Value="{Binding Value}" Width="100" Margin="10, 0, 0, 0" Maximum="1" />
            </Grid>

        </HierarchicalDataTemplate>
    </TreeView.ItemTemplate>

</TreeView>

它工作得很好，除了我希望所有的滑块都在彼此的正下方，而它们不是。（只有处于同一层级的人才会出现在彼此的正下方）

换句话说，我需要树在另一列中显示滑块（表示“Value”属性）

有人能帮忙吗？

• 使网格拉伸（因此horizontalalignment.stretch），也使treeview中的项目拉伸（horizontalcontentalignment.stretch），无论需要做什么。然后让第三列具有共享列大小
• 你会需要的。也附在下面

然后树视图会像这样

    <TreeView HorizontalContentAlignment="Stretch" Name="DTV" ItemsSource="{Binding DTVIList}" Grid.Row="1"
              ItemContainerStyle="{StaticResource TreeViewItemStyle1}">
        <TreeView.ItemTemplate>
            <HierarchicalDataTemplate ItemsSource="{Binding Children}">
                <Grid HorizontalAlignment="Stretch">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="1*"/>
                        <ColumnDefinition Width="100" SharedSizeGroup="SliderColumn"/>
                    </Grid.ColumnDefinitions>
                    <CheckBox  Grid.Column="0" IsChecked="{Binding Visible}"  Margin="5" />
                    <TextBlock Grid.Column="1" Text="{Binding Name}" Margin="5" />
                    <Slider    Grid.Column="2" Value="{Binding Value}" Width="100" Margin="10, 0, 0, 0" Maximum="1" />                            
                </Grid>
            </HierarchicalDataTemplate>
        </TreeView.ItemTemplate>
    </TreeView>

这应该可以做到

TreeViewStyle附件：

<Style x:Key="TreeViewItemFocusVisual">
  <Setter Property="Control.Template">
    <Setter.Value>
      <ControlTemplate>
        <Rectangle/>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

<PathGeometry x:Key="TreeArrow" Figures="M0,0 L0,6 L6,0 z"/>

<Style x:Key="ExpandCollapseToggleStyle" TargetType="{x:Type ToggleButton}">
  <Setter Property="Focusable" Value="False"/>
  <Setter Property="Width" Value="16"/>
  <Setter Property="Height" Value="16"/>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type ToggleButton}">
        <Border Width="16" Height="16" Background="Transparent" Padding="5,5,5,5">
          <Path x:Name="ExpandPath" Fill="Transparent" Stroke="#FF989898" Data="{StaticResource TreeArrow}">
            <Path.RenderTransform>
              <RotateTransform Angle="135" CenterX="3" CenterY="3"/>
            </Path.RenderTransform>
          </Path>
        </Border>
        <ControlTemplate.Triggers>
          <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Stroke" TargetName="ExpandPath" Value="#FF1BBBFA"/>
            <Setter Property="Fill" TargetName="ExpandPath" Value="Transparent"/>
          </Trigger>
          <Trigger Property="IsChecked" Value="True">
            <Setter Property="RenderTransform" TargetName="ExpandPath">
              <Setter.Value>
                <RotateTransform Angle="180" CenterX="3" CenterY="3"/>
              </Setter.Value>
            </Setter>
            <Setter Property="Fill" TargetName="ExpandPath" Value="#FF595959"/>
            <Setter Property="Stroke" TargetName="ExpandPath" Value="#FF262626"/>
          </Trigger>
        </ControlTemplate.Triggers>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>
<Style x:Key="TreeViewItemStyle1" TargetType="{x:Type TreeViewItem}">
  <Setter Property="Background" Value="Transparent"/>
  <Setter Property="HorizontalContentAlignment" Value="{Binding Path=HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
  <Setter Property="VerticalContentAlignment" Value="{Binding Path=VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
  <Setter Property="Padding" Value="1,0,0,0"/>
  <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
  <Setter Property="FocusVisualStyle" Value="{StaticResource TreeViewItemFocusVisual}"/>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type TreeViewItem}">
        <Grid>
          <Grid.ColumnDefinitions>
            <ColumnDefinition MinWidth="19" Width="Auto"/>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
          </Grid.ColumnDefinitions>
          <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition/>
          </Grid.RowDefinitions>
          <ToggleButton x:Name="Expander" Style="{StaticResource ExpandCollapseToggleStyle}" ClickMode="Press" IsChecked="{Binding Path=IsExpanded, RelativeSource={RelativeSource TemplatedParent}}"/>
          <Border x:Name="Bd" SnapsToDevicePixels="true" Grid.Column="1" Grid.ColumnSpan="2" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}">
            <ContentPresenter x:Name="PART_Header" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" ContentSource="Header"/>
          </Border>
          <ItemsPresenter x:Name="ItemsHost" Grid.Column="1" Grid.ColumnSpan="2" Grid.Row="1"/>
        </Grid>
        <ControlTemplate.Triggers>
          <Trigger Property="IsExpanded" Value="false">
            <Setter Property="Visibility" TargetName="ItemsHost" Value="Collapsed"/>
          </Trigger>
          <Trigger Property="HasItems" Value="false">
            <Setter Property="Visibility" TargetName="Expander" Value="Hidden"/>
          </Trigger>
          <Trigger Property="IsSelected" Value="true">
            <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
          </Trigger>
          <MultiTrigger>
            <MultiTrigger.Conditions>
              <Condition Property="IsSelected" Value="true"/>
              <Condition Property="IsSelectionActive" Value="false"/>
            </MultiTrigger.Conditions>
            <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
          </MultiTrigger>
          <Trigger Property="IsEnabled" Value="false">
            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
          </Trigger>
        </ControlTemplate.Triggers>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>