Use UIElement como Clip en WPF

Question

Por favor, perdone mi ignorancia, soy muy nuevo en WPF.

Estoy buscando implementar un efecto visual menor en mi aplicación que dé la apariencia de " interior " esquinas redondeadas. La ventana en cuestión tiene un borde oscuro que encapsula varios UIElements, uno de los cuales es StatusBar, ubicado en la parte inferior de la ventana. Esta barra de estado tiene un fondo oscuro que coincide con el borde de la ventana. Encima de la barra de estado se encuentra una vista de contenido, que actualmente es una cuadrícula; su fondo es semitransparente (creo que esto es una restricción, se puede ver a través de la vista de contenido en el escritorio a continuación). Me gustaría que la vista de contenido (representada por el área interior transparente en la figura a continuación) tenga el aspecto de esquinas redondeadas, aunque espero tener que crear la ilusión por mi cuenta.

(No puedo publicar la imagen porque soy un acechador y no un póster por favor encuentre el dibujo aquí )

Mi primer enfoque fue agregar un rectángulo (con el mismo color oscuro que el borde) justo encima de la barra de estado y asignar un borde con esquinas redondeadas a su OpacityMask (similar a la solución propuesta por Chris Cavanagh **) . Lamentablemente, el efecto que se produce es exactamente lo contrario de lo que estoy tratando de lograr.

Entiendo que la propiedad Clip puede ser útil en este tipo de situación, pero me parece que el uso de cualquier tipo de Geometría será inadecuado ya que no tendrá un tamaño dinámico para la región en la que reside. .

EDITAR: Incluyendo mi XAML:

<Grid Background="{StaticResource ClientBg}" Tag="{Binding OverlayVisible}" Style="{StaticResource mainGridStyle}">

        <DockPanel LastChildFill="True">

            <!-- Translates to a StackPanel with a Menu and a Button -->
            <local:FileMenuView DockPanel.Dock="Top" />

            <!-- Translates to a StatusBar -->
            <local:StatusView DockPanel.Dock="Bottom" />

            <!-- Translates to a Grid -->
            <local:ContentView />

        </DockPanel>

    </Grid>

Cualquier puntero es más que bienvenido. Estoy listo para proporcionar más detalles en caso de ser necesario.

** http://www.dotnetkicks.com/wpf/WPF_easy_rounded_corners_for_anything

Answer 1

EDITAR: Ahora entiendo lo que quieres decir. De hecho, puede utilizar el enfoque Path + OpacityMask. Tienes que dibujar " invertido " Ruta, para usarla como máscara de opacidad. Pero tengo una solución más simple y rápida para ti :). Use Border + CornerRadius y rellene los huecos con rutas sólidas. Simplemente intente el siguiente código en Kaxaml y hágame saber si esto es lo que estaba buscando:

<Window
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   Width="240"
   Height="320"
   AllowsTransparency="True"
   Background="Transparent"
   WindowStyle="None">
   <Grid>
      <Grid.RowDefinitions>
         <RowDefinition Height="24"/>
         <RowDefinition Height="*"/>
         <RowDefinition Height="24"/>
      </Grid.RowDefinitions>
      <Border Background="Black"/>
      <Border Grid.Row="1" BorderBrush="Black" BorderThickness="5">
         <Grid>
            <Border Background="White" CornerRadius="0, 0, 5, 5" Opacity="0.7"/>
            <Path
               Width="15"
               Height="15"
               HorizontalAlignment="Left"
               VerticalAlignment="Bottom"
               Data="M10,10 L5,10 L5,5 C4.999,8.343 6.656,10 10,10 z"
               Fill="Black"
               Stretch="Fill"/>
            <Path
               Width="15"
               Height="15"
               HorizontalAlignment="Right"
               VerticalAlignment="Bottom"
               Data="M10,10 L5,10 L5,5 C4.999,8.343 6.656,10 10,10 z"
               Fill="Black"
               Stretch="Fill">
               <Path.RenderTransform>
                  <TransformGroup>
                     <ScaleTransform ScaleX="-1"/>
                     <TranslateTransform X="15"/>
                  </TransformGroup>
               </Path.RenderTransform>
            </Path>
         </Grid>
      </Border>
      <Border Grid.Row="2" Background="Black"/>
   </Grid>
</Window>

PS: puedes simplificar esta solución al evitar las transformaciones de representación, pero tienes la idea.