Treeview with wrappanel - 灵活分组

时间:2012-02-12 12:01:24

标签: wpf treeview datatemplate grouping wrappanel

我试图用treeview解决问题。 我想在treeview节点中的wrappanel中订购项目(UserControls)。

-Group
 |---------------------------------------------|
 |Item Item Item Item Item Item Item Item Item |
 |---------------------------------------------|
+Group
+Group

如果窗口宽度(和树视图宽度)抑制并且项目不适合一行,则应将它们排序到下一行。

-Group
 |-------------------------|
 |Item Item Item Item Item |
 |Item Item Item Item      |
 |-------------------------|
+Group
+Group

我做了上面的例子,它不会把项放在下一行。这在没有Treeview的情况下工作,但在树视图节点内部缺少某些东西..

    <DataTemplate x:Key="GroupTemplateFrontPage">
        <Border BorderBrush="AliceBlue" BorderThickness="1" CornerRadius="10"
                Background="{StaticResource TreeViewItemBackground}" >
            <Expander HeaderTemplate="{DynamicResource HeaderTemplate}" 
                      Header="{Binding}" IsTabStop="False" HorizontalAlignment="Left" 
                      IsEnabled="True" ExpandDirection="Down" IsExpanded="True">
                <Grid Margin="5,5,5,5">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition />
                    </Grid.ColumnDefinitions>
                    <ListBox Margin="10,39,0,0" VerticalAlignment="Top" ScrollViewer.VerticalScrollBarVisibility="Disabled" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ItemsSource="{Binding Modems}">
                    <ListBox.ItemsPanel>
                        <ItemsPanelTemplate>
                            <WrapPanel                                    
                                HorizontalAlignment="Stretch"
                                ScrollViewer.HorizontalScrollBarVisibility="Disabled" 
                                ScrollViewer.VerticalScrollBarVisibility="Disabled"/>
                        </ItemsPanelTemplate>
                    </ListBox.ItemsPanel>
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <Grid>
                                <Controls:UserControlItem Margin="4" />
                            </Grid>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                    </ListBox>
                </Grid>
            </Expander>
        </Border>
    </DataTemplate>





        <StackPanel Orientation="Vertical">
            <TextBlock Text="Treeview" />
            <TreeView Name="_treeView" ScrollViewer.HorizontalScrollBarVisibility="Disabled"
              Margin="0,0,0,0" 
              ItemsSource="{Binding}" 
              ItemTemplate="{StaticResource GroupTemplateFrontPage}"  />
        </StackPanel>

1 个答案:

答案 0 :(得分:1)

ItemsPanel设置TreeViewItems应该:

<TreeView.ItemContainerStyle>
    <Style TargetType="TreeViewItem">
        <Setter Property="ItemsPanel">
            <Setter.Value>
                <ItemsPanelTemplate>
                    <WrapPanel />
                </ItemsPanelTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</TreeView.ItemContainerStyle>

同时关闭水平滚动以允许换行:

<TreeView ScrollViewer.HorizontalScrollBarVisibility="Disabled" ...>