Question

我想显示详细程度的数据，所以我使用TreeView，但每个细节都很短，所以我想使用WrapPanel（水平）每行有很多细节。

类似的东西：

这是一个未展开的项目
这是展开项目的标题

信息1信息2信息3信息4

信息5信息6信息7

所以我尝试定义TreeViewItem的模板，但我无法获得包装包裹。当info的datatemplate宽度为100和TreeView时，每行只有一个信息是500.我尝试设置WrapPanel的宽度，ItemsWidth，是其他没有成功的事情。

有什么想法吗？

编辑：我终于使用了一个'更简单'的解决方案。似乎我们还是必须定义WrapPanel的宽度，这使得解决方案不那么通用。

这是我遇到的解决方案：只是在风格中定义一个使用的ItemsPanel TreeViewItem：

<Style TargetType="TreeViewItem">
   <Setter Property="ItemsPanel">
       <Setter.Value>
              <ItemsPanelTemplate>
                <WrapPanel  Orientation="Horizontal"      
                            Width="520"
                            HorizontalAlignment="Stretch" 
                            Margin="0" 
                            ScrollViewer.HorizontalScrollBarVisibility="Disabled" 
                            IsItemsHost="True"  
                    />
              </ItemsPanelTemplate>
       </Setter.Value>
   </Setter>
</Style>

为了完整起见，我仍然在这里使用不起作用的解决方案。（为什么它不起作用？）

    <Style TargetType="TreeViewItem">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="TreeViewItem">
                <Grid Margin="2" Width="500">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>

                    <ContentPresenter Name="PART_Header"                 
                                      ContentSource="Header"
                                      HorizontalAlignment="Center"
                                      VerticalAlignment="Center" />

    !!!! this is the wrapanel not wrapping 
                    <ListBox     Name="AllItems"     Grid.Row="1"      >
                        <ListBox.ItemsPanel>
                            <ItemsPanelTemplate>
                                <WrapPanel  Orientation="Horizontal"   />
                            </ItemsPanelTemplate>
                        </ListBox.ItemsPanel>
                        <ItemsPresenter   />
                    </ListBox>

                </Grid> 

                <ControlTemplate.Triggers>
                    <Trigger Property="IsExpanded" Value="False">
                        <Setter
                                       TargetName="AllItems"
                                        Property="Visibility"                     
                                          Value="Collapsed" />
                  </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Answer 1

编辑：我终于使用了一个'更简单'的解决方案。似乎我们还是必须定义WrapPanel的宽度，这使得解决方案不那么通用。（也许是宽度的绑定（但是哪个？）会解决这个问题）

这是我遇到的解决方案：只是在风格中定义一个使用的ItemsPanel TreeViewItem：

<Style TargetType="TreeViewItem">
   <Setter Property="ItemsPanel">
       <Setter.Value>
              <ItemsPanelTemplate>
                <WrapPanel  Orientation="Horizontal"      
                            Width="520"
                            HorizontalAlignment="Stretch" 
                            Margin="0" 
                            ScrollViewer.HorizontalScrollBarVisibility="Disabled" 
                            IsItemsHost="True"  
                    />
              </ItemsPanelTemplate>
       </Setter.Value>
   </Setter>
</Style>

Answer 2

您必须设置

ScrollViewer.HorizontalScrollBarVisibility="Disabled"

到你的

<TreeView/>

不适用于

<WrapPanel/>

示例：

<TreeView x:Name="fieldTreeView" Grid.Row="1" Margin="5,0,5,0" Background="Beige"         
          ItemsSource="{Binding Source={StaticResource bla}}"
          ScrollViewer.HorizontalScrollBarVisibility="Disabled">
        <TreeView.Resources>                
            <DataTemplate DataType="{x:Type Model:bla}">
                <StackPanel Orientation="Vertical">
                    <Label Content="{Binding Name}"/>
                    <TextBox Text=""/>
                </StackPanel>        
            </DataTemplate>                
        </TreeView.Resources>
        <TreeView.ItemsPanel>
            <ItemsPanelTemplate>                    
                <WrapPanel Orientation="Horizontal"/>                    
            </ItemsPanelTemplate>
        </TreeView.ItemsPanel>
    </TreeView>

此解决方案适合我。

Answer 3

尝试

禁用滚动条
加宽WrapPanel并观察视觉冲击，是否有影响？
制作颜色边框/背景以跟踪WrapPanel的实际尺寸

这些将帮助您追踪问题

在TreeView中使用WrapPanel

3 个答案: