Windows 8 ListView con flujo de elementos horizontal

Question

¿Cómo puedo hacer que ListItems dentro de Windows 8 ListView fluya horizontalmente. El comportamiento predeterminado es vertical, pero quiero mostrar la lista en flujo horizontal para que pueda representarse como panorama.

Probé GridView que admite diseño horizontal, pero hay una limitación en la altura del elemento que no muestra el contenido completo del artículo para los artículos con texto grande.

Answer 1

Se puede utilizar un ListView de esta manera:

<ListView 
    Height="500" 
    VerticalAlignment="Center" 
    ScrollViewer.HorizontalScrollBarVisibility="Auto" 
    ScrollViewer.VerticalScrollBarVisibility="Disabled" 
    ScrollViewer.HorizontalScrollMode="Enabled" 
    ScrollViewer.VerticalScrollMode="Disabled" 
    ScrollViewer.ZoomMode="Disabled" 
    SelectionMode="None"> 
    <ListView.ItemsPanel> 
     <ItemsPanelTemplate> 
      <ItemsStackPanel 
       Orientation="Horizontal" /> 
     </ItemsPanelTemplate> 
    </ListView.ItemsPanel> 

- que le da un panel horizontal y las barras de desplazamiento adecuadas para el desplazamiento horizontal.

Tanto ListView como GridView pueden causar problemas cuando obtiene artículos más grandes. Creo que, de forma predeterminada, los artículos pueden tener un tamaño basado en el tamaño del primer elemento agregado. Puede establecer ese tamaño manualmente:

<ListView.ItemContainerStyle> 
    <Style 
     TargetType="ListViewItem"><!-- note - for GridView you should specify GridViewItem, for ListBox - ListBoxItem, etc. --> 
     <Setter 
      Property="Height" 
      Value="200" /> <!-- this is where you can specify the size of your ListView items --> 
     <Setter 
      Property="Width" 
      Value="350" /> 
    </Style> 
</ListView.ItemContainerStyle> 

- tenga en cuenta que todos los artículos deben ser del mismo tamaño.

- también la nota - He cambiado esta respuesta para reemplazar un StackPanel con un ItemsStackPanel que es virtualizado, por lo que debe obtener un mejor rendimiento y menor uso de memoria para grandes conjuntos de datos, pero FAVOR - no crean diseños con grandes listas desplazables horizontalmente. Pueden ser una buena solución en algunos escenarios muy limitados, pero en la mayoría de los casos romperán muchos buenos patrones de interfaz de usuario y harán que su aplicación sea más difícil de usar.

Answer 2

También puede encapsular enfoque Filips usando un estilo:

<Style TargetType="ListView" x:Key="VerticalListView"> 
     <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" /> 
     <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Disabled" /> 

     <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Enabled" /> 
     <Setter Property="ScrollViewer.VerticalScrollMode" Value="Disabled" /> 

     <Setter Property="ScrollViewer.ZoomMode" Value="Disabled" /> 
     <Setter Property="SelectionMode" Value="None" /> 

     <Setter Property="ItemsPanel"> 
      <Setter.Value> 
       <ItemsPanelTemplate> 
        <StackPanel VerticalAlignment="Top" Orientation="Horizontal" /> 
       </ItemsPanelTemplate> 
      </Setter.Value> 
     </Setter> 

     <Setter Property="ItemContainerStyle"> 
      <Setter.Value> 
       <Style TargetType="ListViewItem"> 
        <Setter Property="Height" Value="400" /> 
       </Style> 
      </Setter.Value> 
     </Setter> 
    </Style> 

aplicarlo a su listviews según sea necesario:

<ListView Style="{StaticResource VerticalListView}" /> 

Answer 3

yo preferiría el enfoque de estilos, pero tendrá que ser cuidadoso modificando la orientación del panel. Antes de que pase el primer diseño visual, los elementos del panel de control no se crearán y, por lo tanto, no estarán disponibles para su modificación. Tendría que encontrar una estrategia para manejar la configuración de la orientación inicial si es diferente a la línea de su Xaml. Tal vez también asigne el ItemsPanelTemplate a través de un setter de estilo.