title: Using a control for OpacityMask
body: <p>I'm writing an application. I'd like to have a tutorial mode where the screen of the application darkens and single features of the application are allowed to shine through. On my actual app, I have many datagrids and listboxes so I thought the easiest way to accomplish this might be to overlay the entire screen with a semi-transparent Panel and then somehow use the opacity mask to see through the mask in certain areas to highlight them in my application while the tutorial explains what they do. The only problem is, I can't get the opacity mask to work with a visualbrush and picking out specific objects like a Listbox. Below is an example program I wrote to demonstrate simply what I am trying to do.</p>
  
  <pre><code>&lt;Grid&gt;
      &lt;Grid.RowDefinitions&gt;
          &lt;RowDefinition Height="Auto"/&gt;
          &lt;RowDefinition Height="*"/&gt;
          &lt;RowDefinition Height="Auto"/&gt;
      &lt;/Grid.RowDefinitions&gt;
  
      &lt;Grid.ColumnDefinitions&gt;
          &lt;ColumnDefinition Width="*"/&gt;
          &lt;ColumnDefinition Width="*"/&gt;
      &lt;/Grid.ColumnDefinitions&gt;
  
      &lt;TextBlock Text="Two different text listboxes"/&gt;
  
      &lt;ListBox Grid.Row="1" Name="myListBox1" Grid.Column="0" VerticalAlignment="Top"&gt;
          &lt;ListBoxItem Content="Item 1" Margin="3" Background="Tan"/&gt;
          &lt;ListBoxItem Content="Item 2" Margin="3" Background="Aqua"/&gt;
          &lt;ListBoxItem Content="Item 3" Margin="3" Background="Gold"/&gt;
      &lt;/ListBox&gt;
  
      &lt;ListBox Grid.Row="1" Name="myListBox2" Grid.Column="1" VerticalAlignment="Top"&gt;
          &lt;ListBoxItem Content="Item A" Margin="3" Background="Magenta"/&gt;
          &lt;ListBoxItem Content="Item B" Margin="3" Background="Chartreuse"/&gt;
          &lt;ListBoxItem Content="Item C" Margin="3" Background="Chocolate"/&gt;
          &lt;ListBoxItem Content="Item D" Margin="3" Background="Pink"/&gt;
      &lt;/ListBox&gt;
  
  
      &lt;Button Grid.Row="2" Height="40" Margin="5" Content="Click me" Grid.ColumnSpan="2"/&gt;
  
      &lt;DockPanel Grid.RowSpan="3" Background="#55000000" Grid.ColumnSpan="2"&gt;
          &lt;DockPanel.OpacityMask&gt;
              &lt;VisualBrush Visual="{Binding ElementName=myListBox1}"/&gt;
          &lt;/DockPanel.OpacityMask&gt;
      &lt;/DockPanel&gt;
  &lt;/Grid&gt;
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/Fi8FZ.png" alt=""></p>
  
  <p>Can anyone give me any tips on how to simply accomplish this mask?</p>