Стилизация ListView.GroupStyle с помощью WrapPanel

Хорошо, вот моя довольно простая проблема.

У меня есть ListView , который я стилизовал так, чтобы он выглядел как проводник Windows.

] Теперь я хотел бы сгруппировать предметы внутри. Следовательно, Я определил GroupStyle с помощью Expander , чтобы сгруппировать его. Теперь с группировкой все в порядке.

Что мне не нравится, так это то, что теперь мой ListView отображает каждую группу в отдельной строке, в то время как я хотел бы иметь некоторую оболочку для отображения много групп в одной строке.

Думаю, изображение лучше текста.

Вот что у меня есть:

What I Have

Вот что я хочу:

What I want

Я не могу найти, какое свойство мне нужно стиль, чтобы GroupItems вписывались в WrapPanel, как я сделал для элементов.

Вот мой стиль ListView:

<ResourceDictionary>

                    <!-- Explorer-style layout-->
                    <DataTemplate x:Key="ExplorerView">
                        <StackPanel Orientation="Horizontal" Height="Auto" Width="150">
                            <Image Source="{Binding Path=Value.AppConfig.Appli.AppType, Converter={StaticResource TypeToIconConverter}}" Margin="5"
                                   Height="50" Width="50"/>
                            <StackPanel VerticalAlignment="Center" Width="90">
                                <TextBlock Text="{Binding Path=Value.AppConfig.Appli.AppName}" 
                     FontSize="13" HorizontalAlignment="Left" TextWrapping="WrapWithOverflow"
                     Margin="0,0,0,1" />
                                <TextBlock Text="{Binding Path=Value.AppConfig.Appli.AppType}" FontSize="9" 
                     HorizontalAlignment="Left" Margin="0,0,0,1" />
                            </StackPanel>
                        </StackPanel>
                    </DataTemplate>

                    <!-- Group header style-->
    <Style x:Key="GroupHeaderStyle" TargetType="{x:Type GroupItem}">


        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type GroupItem}">

                    <Expander x:Name="exp" IsExpanded="True" Width="310"
                                   BorderBrush="CornflowerBlue">

                        <Expander.Header>
                            <DockPanel HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
                                        Background="CornflowerBlue" x:Name="expContent"
                                        Width="{Binding RelativeSource={RelativeSource
                                            Mode=FindAncestor, AncestorType={x:Type Expander}},
                                            Path=Width}"
                                        Height="{Binding RelativeSource={RelativeSource
                                            Mode=FindAncestor, AncestorType={x:Type ToggleButton}},
                                            Path=ActualHeight}">
                                <CheckBox IsChecked="False" DockPanel.Dock="Right"/>
                                <TextBlock Text="{Binding Path=Name}" Foreground="White"
                                           FontWeight="Bold" HorizontalAlignment="Center" />
                            </DockPanel>
                        </Expander.Header>
                        <ItemsPresenter />
                    </Expander>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>



                </ResourceDictionary>
    <!-- (...) -->

    <ListView ItemsSource="{Binding GroupedConfig, Mode=TwoWay}" 
              ItemTemplate="{StaticResource ExplorerView}">



        <ListView.ItemsPanel>
            <ItemsPanelTemplate >
                <WrapPanel Width="{Binding (FrameworkElement.ActualWidth),
                     RelativeSource={RelativeSource 
                                     AncestorType=Expander}}"
                     ItemWidth="{Binding (ListView.View).ItemWidth,
                     RelativeSource={RelativeSource AncestorType=ListView}}"

                     ItemHeight="{Binding (ListView.View).ItemHeight,
                     RelativeSource={RelativeSource AncestorType=ListView}}" />
                <!--MinWidth="{Binding ItemWidth,
                     RelativeSource={RelativeSource Self}}"-->
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>

        <ListView.GroupStyle>
            <GroupStyle ContainerStyle="{StaticResource GroupHeaderStyle}" />
        </ListView.GroupStyle>


    </ListView>

Есть идеи? Я пытаюсь вставить подходящий Сеттер в стиле, определенном для GroupItem , но я начинаю думать, что это неправильный способ.

Спасибо!

5
задан Dave Clemmer 16 August 2011 в 15:32
поделиться