ListView : 리소스 사전에서 ItemsPanelTemplate을 정의하십시오.

Question

ListView는 Windows 탐색기보기 (아이콘 + 세부 정보)처럼 보이며 ViewModel 어딘가에있는 목록에 바인딩되어 있습니다.

내 목표는 언제든지 탐색기보기 또는 클래식보기를 전환 할 수 있도록하는 것입니다.

정확하게 ListView.ItemsPanel 필드에 정확하게 레이아웃을 표시하는 작업을 수행하는 ItemsPanelTemplate을 정의 할 수 있습니다. 이제는 여러 뷰에서 사용할 수 있도록 리소스에서이를 정의하고 싶습니다. 특히 하나의 컨트롤에서 사용자는 탐색기 뷰 또는 클래식 목록 뷰 중 하나를 선택해야합니다. 목록)

어떻게 했습니까? 어떤 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'를 사용하여이 작업을 수행 할 수 있습니다.

또는 개별 ItemsPanels에 대해 일부 DataTrigger 및 Setter 스타일을 만들 수 있습니다.