ListView:在资源字典中定义ItemsPanelTemplate

Question

我有一个ListView,其布局看起来像一个Windows资源管理器视图(图标+一些细节),绑定到ViewModel中的某个列表.

我的目标是能够随时在资源管理器视图或经典视图之间切换.

我可以ItemsPanelTemplate直接在ListView.ItemsPanel字段中定义完全正确地显示布局的工作.现在,我想在资源中定义它,以便我能够在不同的视图中使用它,特别是在一个控件中,用户应该在Explorer视图或经典列表视图之间进行选择(默认渲染为一个列表)

你怎么做的？我无法定义任何ItemsPanelTemplate在我的ResourceDictionary,如果我定义DataTemplate它是不兼容的(虽然我认为遵循纯逻辑,ItemsPanelTemplate应该继承DataTemplate,但它实际上不是这样).

实际列表的代码段:

<ListView SelectionMode="Single"
                VerticalAlignment="Stretch" HorizontalAlignment="Stretch" HorizontalContentAlignment="Center" VerticalContentAlignment="Bottom"
                ScrollViewer.VerticalScrollBarVisibility="Auto"
                ItemsSource="{Binding ListUserApps, 
                                UpdateSourceTrigger=PropertyChanged}" 
                SelectedIndex="{Binding SelectedUserApp, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" Background="White">

                <ListView.ItemsPanel>
                    <ItemsPanelTemplate >
                        <WrapPanel Width="{Binding (FrameworkElement.ActualWidth),
                     RelativeSource={RelativeSource 
                                     AncestorType=ScrollContentPresenter}}"
                     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.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal" Height="Auto" Width="150">
                            <Image Source="{Binding Path=Appli.AppType, Converter={StaticResource TypeToIconConverter}}" Margin="5"
                                   Height="50" Width="50"/>
                            <StackPanel VerticalAlignment="Center" Width="90">
                                <TextBlock Text="{Binding Path=Appli.AppName}" 
                     FontSize="13" HorizontalAlignment="Left" TextWrapping="WrapWithOverflow"
                     Margin="0,0,0,1" />
                                <TextBlock Text="{Binding Path=Appli.AppType}" FontSize="9" 
                     HorizontalAlignment="Left" Margin="0,0,0,1" />
                            </StackPanel>
                        </StackPanel>
                    </DataTemplate>
                </ListView.ItemTemplate>

            </ListView>

保持ItemTemplate静态资源很容易,但现在我无法做任何事情ItemsPanelTemplate......

有任何想法吗？我正在使用MVVM,所以我想尽可能不使用代码隐藏

Answer 1

你会为整个ListView使用一个样式.

所以你会这样做:

<Grid.Resources>
  <Style x:Key="ListViewStyle" TargetType="ListView">
    <Setter Property="ItemsPanel">
      <Setter.Value>
        <ItemsPanelTemplate >
                        <WrapPanel Width="{Binding (FrameworkElement.ActualWidth),
                     RelativeSource={RelativeSource 
                                     AncestorType=ScrollContentPresenter}}"
                     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>
      </Setter.Value>
    </Setter>
  </Style>
</Grid.Resources>


    <ListView SelectionMode="Single"
        VerticalAlignment="Stretch" HorizontalAlignment="Stretch" HorizontalContentAlignment="Center" VerticalContentAlignment="Bottom"
        ScrollViewer.VerticalScrollBarVisibility="Auto"
        ItemsSource="{Binding ListUserApps, 
                        UpdateSourceTrigger=PropertyChanged}" 
        SelectedIndex="{Binding SelectedUserApp, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" Background="White" Style="{StaticResource ListViewStyle}">                    
        <ListView.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal" Height="Auto" Width="150">
                    <Image Source="{Binding Path=Appli.AppType, Converter={StaticResource TypeToIconConverter}}" Margin="5"
                           Height="50" Width="50"/>
                    <StackPanel VerticalAlignment="Center" Width="90">
                        <TextBlock Text="{Binding Path=Appli.AppName}" 
             FontSize="13" HorizontalAlignment="Left" TextWrapping="WrapWithOverflow"
             Margin="0,0,0,1" />
                        <TextBlock Text="{Binding Path=Appli.AppType}" FontSize="9" 
             HorizontalAlignment="Left" Margin="0,0,0,1" />
                    </StackPanel>
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>            
    </ListView>

如果您希望用户能够在资源管理器和经典视图之间切换,只需定义第二个样式并切换列表视图的样式即可.这可以通过一些VisualStates和'DataStateBehavior'来完成.

或者,您可以为各个ItemsPanel创建一个带有一些DataTriggers和Setter的样式.