title: creating Icon View mode for ListView WPF
body: <p>I'm Trying to change <code>listView</code> GridView to IconView, as you see in the screenshot, each item is taking a row.</p>
  
  <p><img src="https://i.stack.imgur.com/fd8p5.png" alt="enter image description here"></p>
  
  <p><strong>Style XAML</strong></p>
  
  <pre><code>&lt;UserControl.Resources&gt;
  &lt;Style x:Key="FileItemStyle" TargetType="{x:Type ListViewItem}"&gt;
          &lt;Setter Property="Width" Value="50"/&gt;
          &lt;Setter Property="Margin" Value="5,5,5,5"/&gt;
          &lt;Setter Property="Padding" Value="0,0,0,0"/&gt;
          &lt;Setter Property="HorizontalAlignment" Value="Left"/&gt;
          &lt;Setter Property="Template"&gt;
             &lt;Setter.Value&gt;
                  &lt;ControlTemplate  TargetType="{x:Type ListViewItem}"&gt;
                      &lt;Grid HorizontalAlignment="Left" VerticalAlignment="Top" Height="50" Width="50"&gt;
                          &lt;Border x:Name="border" BorderBrush="{x:Null}" BorderThickness="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" CornerRadius="2.5"/&gt;
                          &lt;StackPanel HorizontalAlignment="Stretch"  VerticalAlignment="Stretch"&gt;
  
                              &lt;ContentPresenter /&gt;
                          &lt;/StackPanel&gt;
                      &lt;/Grid&gt;
          &lt;/ControlTemplate&gt;
       &lt;/Setter.Value&gt;
       &lt;/Setter&gt;
      &lt;/Style&gt;
  &lt;/UserControl.Resources&gt;
  </code></pre>
  
  <p><strong>ListView XAML</strong></p>
  
  <pre><code>    &lt;ListView ItemContainerStyle="{DynamicResource FileItemStyle}" HorizontalAlignment="Left" Height="194.667" Margin="11,77.666,0,0" VerticalAlignment="Top" Width="368.667" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Auto" ScrollViewer.CanContentScroll="True" UseLayoutRounding="False"&gt;
          &lt;ListView.ItemTemplate&gt;
              &lt;DataTemplate&gt;
                  &lt;Grid HorizontalAlignment="Left" Height="50"&gt;
                      &lt;Border x:Name="border" BorderBrush="{x:Null}" BorderThickness="1" HorizontalAlignment="Stretch" Height="50" VerticalAlignment="Stretch" Width="50" CornerRadius="2.5"/&gt;
                      &lt;StackPanel&gt;
                          &lt;Image x:Name="Img" Source="BtnImg/Computer.png" Stretch="None" Margin="9,0,9,0" Width="32" Height="32"/&gt;
                          &lt;TextBlock x:Name="PCName" Margin="0" TextWrapping="Wrap" Height="18" HorizontalAlignment="Stretch" TextAlignment="Center"&gt;&lt;Run Text="{Binding Content}"/&gt;&lt;/TextBlock&gt;
                      &lt;/StackPanel&gt;
                  &lt;/Grid&gt;
              &lt;/DataTemplate&gt;
          &lt;/ListView.ItemTemplate&gt;
          &lt;ListBoxItem Content="ddd"/&gt;  &lt;!--**--&gt;
          &lt;ListViewItem Content="zczxcz"/&gt;
      &lt;/ListView&gt;
  </code></pre>
  
  <p>I've tried to use <a href="http://msdn.microsoft.com/en-us/library/ms748859.aspx" rel="nofollow noreferrer">MDSN example : How to: Create a Custom View Mode for a ListView</a> and modify it to get what I need, but it didn't work with me, I actually couldn't understand the example clearly, anyone can Simplify how can I create a View mode? Do I have to create an overrided ViewBase class?</p>
  
  <p>Thanks in advance</p>