2013-06-13 21 views
9

Chciałbym utworzyć listę w WPF, który wyświetla dane w kilku kolumnach, jak Explorer wyświetla listę plików w trybie podglądu „małe ikony”:WPF: wielokolumnowy listbox/listview?

Multi-column list box

Każdy element musi być reprezentowana przez DataTemplate, a przewijanie ma być poziome. Jak utworzyć taką listę?

+0

pan już sprawdzić ItemsControl i itemscontrol.ItemsPanelTemplate do przewijania poziomego – blindmeis

+0

Tak, próbowałem to robić, ale nie mógł znaleźć sposób, aby elementy układać w wielu kolumnach pionowych . – Impworks

+0

uniformgrid lub wrappanel może to zrobić – blindmeis

Odpowiedz

15

Musisz zmienić ItemsPanel twoich ListBox do WrapPanel z pionowym Orientation i wyłącz pionowego paska przewijania na ListBox coś takiego:

<ListBox ScrollViewer.VerticalScrollBarVisibility="Disabled" ItemsSource="{Binding=MyItems}"> 
    <ListBox.ItemTemplate> 
     <DataTemplate> 
      <!--my item template--> 
     </DataTemplate> 
    </ListBox.ItemTemplate> 
    <ListBox.ItemsPanel> 
     <ItemsPanelTemplate> 
      <WrapPanel Orientation="Vertical"/> 
     </ItemsPanelTemplate> 
    </ListBox.ItemsPanel> 
</ListBox> 
+0

świetna implementacja - @ JSJ's też jest fajna, ale fajnie jest mieć bez nagłówków siatki – jharr100

5

spróbować czegoś jak poniżej.

<ListView ItemsSource="{Binding Files}" > 
      <ListView.ItemsPanel> 
       <ItemsPanelTemplate> 
        <WrapPanel Width="{Binding (FrameworkElement.ActualWidth), RelativeSource={RelativeSource AncestorType=ScrollContentPresenter}}" 
         ItemWidth="{Binding (ListView.View).ItemWidth, RelativeSource={RelativeSource AncestorType=ListView}}" 
         MinWidth="{Binding ItemWidth, RelativeSource={RelativeSource Self}}" 
         ItemHeight="{Binding (ListView.View).ItemHeight, RelativeSource={RelativeSource AncestorType=ListView}}" /> 
       </ItemsPanelTemplate> 
      </ListView.ItemsPanel> 
      <ListView.View> 
       <GridView > 
        <GridView.Columns> 
         <GridViewColumn DisplayMemberBinding="{Binding Name}" /> 
        </GridView.Columns> 
       </GridView> 
      </ListView.View> 
     </ListView> 

kod za próbką.

public partial class Window1 : Window 
    { 
     public Window1() 
     { 
      InitializeComponent(); 
      Files = new ObservableCollection<FileInfo>(); 
      var files = new System.IO.DirectoryInfo("C:\\Windows\\").GetFiles(); 
      foreach (var item in files) 
      { 
       Files.Add(item); 
      } 
      this.DataContext = this; 
     } 

     public ObservableCollection<FileInfo> Files { get; set; } 
    } 
5

Spróbuj czegoś jak poniżej.

<ListBox> 
<ListBox.ItemsPanel> 
    <ItemsPanelTemplate> 
    <UniformGrid Columns="3"/> 
    </ItemsPanelTemplate> 
</ListBox.ItemsPanel> 

<DataTemplate> 
     <!--my item template--> 
</DataTemplate> 
</ListBox> 

mogą korzystać this Link