WPF Image Gallery

I know that this is a pretty old question, but I'm answering because this page is in the first page on Google and this link could be useful for someone.

WPF Photo Viewer Demo

Screenshot: Screenshot


You might want to use an ItemsControl/ListBox and then set a UniformGrid panel for a 3x3 display as its ItemsPanel to achieve a proper WPF bindable solution.

 <ListBox ScrollViewer.HorizontalScrollBarVisibility="Disabled">
    <ListBox.ItemsPanel>
      <ItemsPanelTemplate>
        <UniformGrid Rows="3" Columns="3"/>
       </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
  <Image Source="Images\img1.jpg" Width="100"/>
  <Image Source="Images\img2.jpg" Width="50"/>
  <Image Source="Images\img3.jpg" Width="200"/>
  <Image Source="Images\img4.jpg" Width="75"/>
  <Image Source="Images\img5.jpg" Width="125"/>
  <Image Source="Images\img6.jpg" Width="100"/>
  <Image Source="Images\img7.jpg" Width="50"/>
  <Image Source="Images\img8.jpg" Width="50"/>
  <Image Source="Images\img9.jpg" Width="50"/>
 </ListBox>

You need to set your collection of Images as ItemsSource binding if you are looking for a dynamic solution here. But the question is too broad to give an exact answer.


You can use simple ListBox control and customize its ItemsPanel template and add WrapPanel in it. WrapPanel puts items in a Horizontal Tiling layout, where you can set its max width to incorporate 3 items in one row and it will create more rows for 3 items till last one fills.