title: Achieving FocusVisualStyle with both Mouse and Keyboard Focus
body: <p><strong>What I'm Trying to Achieve</strong> </p>
  
  <p>For simplicity, I have a grid of cells and I'm trying to add the FocusVisualStyle dashed rectangle to each cell when it is focused. However the style only works when the element is navigated to using the keyboard, per its design. I'm looking to achieve the same effect, but have it work with Keyboard focus <strong>and</strong> Mouse focus (when the cell is clicked).</p>
  
  <p><strong>What I Have Tried</strong></p>
  
  <p>I looked into using containers like a <code>Border</code>, but that doesn't have dashed lines, attempted to use a dashed rectangle and position it over the element, but that was providing inconsistent results. I also tried to attach a trigger to the <code>IsFocused</code> property of the cell, but that only works for Keyboard Focus. </p>
  
  <p><strong>Current Code</strong></p>
  
  <p>Right now I have events set to the cell (a <code>StackPanel</code>) that allow for my custom navigation through the grid. My current "Visual Style" is to change the background to a color, which works for both Mouse and Keyboard Focus. I'm looking to swap out the background change for a dashed rectangle around the cell, however the XAML I tried doesn't work since FocusVisualStyle only works with keyboard focus.</p>
  
  <p>Here is a simplified version of my XAML and C# of what I have tried</p>
  
  <p><strong>XAML</strong></p>
  
  <pre><code>&lt;!-- The "cell" I'm trying to acheive a dashed border around --&gt;
  &lt;StackPanel x:Key="ContactCell" 
              Focusable="True" 
              GotFocus="StackPanel_GotFocus" 
              LostFocus="StackPanel_LostFocus" 
              PreviewMouseDown="Contact_Select" 
              Style="{DynamicResource ContactFocusStyle}"&gt;
      &lt;!-- other children in here --&gt;
  &lt;/StackPanel&gt;
  
  &lt;Style x:Key="ContactFocusStyle" TargetType="StackPanel"&gt;
          &lt;Style.Triggers&gt;
              &lt;Trigger Property="IsFocused" Value="True"&gt;
                  &lt;Setter Property="FocusVisualStyle" 
                          Value="{DynamicResource MyFocusVisualStyle}"/&gt;
              &lt;/Trigger&gt;
          &lt;/Style.Triggers&gt;
  &lt;/Style&gt;
  
  &lt;Style x:Key="MyFocusVisualStyle"&gt;
          &lt;Setter Property="Control.Template"&gt;
              &lt;Setter.Value&gt;
                  &lt;ControlTemplate&gt;
                      &lt;Rectangle Stroke="Black" 
                                 StrokeDashArray="2 3" 
                                 Fill="Transparent" 
                                 StrokeDashCap="Round" 
                                 RadiusX="3" 
                                 RadiusY="3"/&gt;
                  &lt;/ControlTemplate&gt;
              &lt;/Setter.Value&gt;
          &lt;/Setter&gt;
  &lt;/Style&gt;
  </code></pre>
  
  <p><strong>C#</strong></p>
  
  <pre><code>    private void Contact_Select(object send, MouseButtonEventArgs e)
      {
          StackPanel sender = (StackPanel)send;
          sender.Focus();
      }
  
      private void StackPanel_GotFocus(object sender, RoutedEventArgs e)
      {
          StackPanel s = (StackPanel)sender;
          s.Background = Brushes.Red;
      }
  
      private void StackPanel_LostFocus(object sender, RoutedEventArgs e)
      {
          StackPanel s = (StackPanel)sender;
          s.Background = Brushes.Transparent;
      }
  </code></pre>