title: How to customize ListViewItem properly with hideable content and bind it to a model, in UWP?
body: <p>I would like to create a ListView where items have a "hover" and a "selected" state, displaying different content in each state.</p>
  
  <p>There have been some similar question here on StackOverflow, but none helped in my particular case.</p>
  
  <p>Let's say I have a <em>model</em>:</p>
  
  <pre><code>public class TagFile : BaseBind // A class with INotifyProperyChanged interface
  {
      private string path;
      public String Path
      {
          get { return path; }
          set
          {
              SetProperty(ref path, value);
          }
      }
  
      public void SelectButtonClick() 
      {
          // Do something
      }
  
      public void HoverButtonClick() 
      {
          // Do something
      }
  }
  </code></pre>
  
  <p>...then I have a main <em>ViewModel</em>:</p>
  
  <pre><code>public class AppViewModel : BaseBind
  {
      public ObservableCollection&lt;TagFile&gt; ItemsList { get; set; }
  
      // Other things
  }
  </code></pre>
  
  <p>... then a <em>Page</em>:</p>
  
  <pre><code>&lt;Grid&gt;
       &lt;ListView ItemsSource="ItemsList"&gt;
            &lt;ListView.ItemTemplate&gt;
                  &lt;DataTemplate x:DataType="local:TagFile"&gt;
                       &lt;Grid&gt;
                            &lt;Grid.RowDefinitions&gt;
                                &lt;RowDefinition/&gt;
                                &lt;RowDefinition/&gt;
                                &lt;RowDefinition/&gt;
                            &lt;/Grid.RowDefinitions&gt;
                            &lt;TextBlock Text="{x:Bind Path, mode=OneWay}"/&gt;
                            &lt;Button Content="Select Button" Click="{x:Bind SelectButtonClick}"/&gt; 
                            &lt;Button Content="Hover Button" Click="{x:Bind HoverbuttonClick}"/&gt;
                       &lt;/Grid&gt;
                  &lt;/DataTemplate&gt;
            &lt;/ListView.ItemTemplate&gt;
       &lt;/ListView&gt;
  &lt;/Grid&gt;
  </code></pre>
  
  <p>I would like to customize ListViewItem Style in order to make the SelectButton appear only when the ListViewItem is selected and the HoverButton only when the cursor is onto it.</p>
  
  <p>I already know that I need to play with ItemTemplate and ItemContainerStyle, but it seems to be more difficult than I tought at the beginning, because I could create a custom style for the ItemContainerStyle in this way (using the IsSelected property from ListViewItem):</p>
  
  <pre><code>&lt;Style TargetType="ListViewItem" x:Key="TestContainerStyle"&gt;
          &lt;Setter Property="Template"&gt;
              &lt;Setter.Value&gt;
                  &lt;ControlTemplate TargetType="ListViewItem"&gt;
                      &lt;Grid&gt;
                          &lt;Grid.RowDefinitions&gt;
                              &lt;RowDefinition Height="Auto"/&gt;
                              &lt;RowDefinition Height="Auto"/&gt;
                          &lt;/Grid.RowDefinitions&gt;
                          &lt;ContentPresenter x:Name="Presenter" Content="{TemplateBinding Content}"/&gt;
                          &lt;Button Grid.Row="1" Content="Select Button" Visibility="{Binding IsSelected, RelativeSource={RelativeSource Mode=TemplatedParent}}"/&gt;
                      &lt;/Grid&gt;
                  &lt;/ControlTemplate&gt;
              &lt;/Setter.Value&gt;
          &lt;/Setter&gt;
          &lt;Setter Property="HorizontalContentAlignment" Value="Stretch"/&gt;
      &lt;/Style&gt;
  </code></pre>
  
  <p>...but in this way:
  1) I loose all the default brushes;
  2) I don't know how I could bind the SelectButton to the model's command;
  3) I would have to find a way for the "hover" state, in order to display the HoverButton;
  4) Last, but not least... I would like to include all the customizations in the App.xaml file (or in associated ResourceDictionary files, as I need them across the entire app).</p>
  
  <p>This is it... I have tried various pattern from StackOverflow answers, but my case includes many differnt things (compile binding in App.xaml files, create a "hover" state, using binding in a Style without a DataType, etc.) that are answered here only separately.</p>
  
  <p>I need to... put them all together, and it seems more tricky than I thought, as I said.</p>
  
  <p>Thank you for your help, really appreciate.</p>
  
  <p>EDIT: the behaviour should be like the Groove App list items: some buttons (Play and Remove item) appears only when the the item is selected or in hover state.</p>
  
  <p>Normal state:</p>
  
  <p><a href="https://i.stack.imgur.com/hjuQh.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/hjuQh.png" alt="enter image description here"></a></p>
  
  <p>...and Hover/selected state:</p>
  
  <p><a href="https://i.stack.imgur.com/qDmeF.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/qDmeF.png" alt="enter image description here"></a></p>