WPF Datagridの丸みのある透明な背景のコーナー

Question

丸で丸められた透明な背景を持つDatagridを作成しようとしていますが、うまくやっていましたが、1つの問題に悩まされています。

私は、角を丸くするために枠線を使用すると、私のヘッダーも不透明になります。

This is what i got

I want this layout with rounded corners

私は今、オプションの外です。他の方法で作ることは可能ですか？

マイコード：

<Window x:Class="SandBox.MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:local="clr-namespace:SandBox" 
    mc:Ignorable="d" 
    Background="Transparent" 
    Title="MainWindow" Height="187.804" Width="717.788"> 

<Grid> 
    <Border BorderThickness="1" BorderBrush="#FF3D3D3D" CornerRadius="5" Margin="44,28,134,60"> 
     <Grid> 
      <Border Name="mask" Background="#33000000" CornerRadius="4"/> 
      <DataGrid Name="dgConectedApps" Width="530" Height="67" Foreground="#FF2E2E2E" 
       CanUserAddRows="False" CanUserDeleteRows="False" CanUserResizeColumns="False" CanUserResizeRows="False" 
       AutoGenerateColumns="False" RowHeaderWidth="0" IsReadOnly="True" BorderThickness="0" GridLinesVisibility="None" 
       VerticalScrollBarVisibility="Disabled" > 
       <DataGrid.OpacityMask> 
        <VisualBrush Visual="{Binding ElementName=mask}"/> 
       </DataGrid.OpacityMask> 
       <DataGrid.Resources> 
        <Style TargetType="{x:Type DataGridRow}"> 
         <Setter Property="Background" Value="#00000000" /> 
         <Setter Property="Height" Value="20" /> 
         <Setter Property="Foreground" Value="DarkGray" /> 
         <Setter Property="FontSize" Value="12" /> 
        </Style> 

        <Style TargetType="{x:Type DataGridCell}"> 
         <Setter Property="BorderThickness" Value="0" /> 
         <Setter Property="FocusVisualStyle" Value="{x:Null}" /> 
         <Style.Triggers> 
          <Trigger Property="IsSelected" Value="True"> 
           <Setter Property="Background" Value="#00000000" /> 
           <Setter Property="Foreground" Value="DarkGray" /> 
          </Trigger> 
         </Style.Triggers> 
        </Style> 
        <Style TargetType="{x:Type DataGridColumnHeader}"> 
         <Setter Property="Background" Value="#FF151515" /> 
         <Setter Property="Height" Value="25" /> 
         <Setter Property="Foreground" Value="DarkGray" /> 
         <Setter Property="FontFamily" Value="Maven Pro" /> 
         <Setter Property="FontSize" Value="12" /> 

        </Style> 
       </DataGrid.Resources> 
       <DataGrid.Columns> 
        <DataGridTextColumn Header="ID" Binding="{Binding id}" Width="50"> 
         <DataGridTextColumn.HeaderStyle> 
          <Style TargetType="DataGridColumnHeader"> 
           <Setter Property="HorizontalContentAlignment" Value="Center"/> 
           <Setter Property="Background" Value="#FF151515" /> 
           <Setter Property="Height" Value="25" /> 
           <Setter Property="Foreground" Value="DarkGray" /> 
           <Setter Property="FontFamily" Value="Maven Pro" /> 
           <Setter Property="FontSize" Value="12" /> 
          </Style> 
         </DataGridTextColumn.HeaderStyle> 
        </DataGridTextColumn> 
        <DataGridTextColumn Header="APPLICATION" Binding="{Binding aplicacao}" Width="130"/> 
        <DataGridTextColumn Header="PING" Binding="{Binding ping}" Width="40"/> 
        <DataGridTextColumn Header="KBPS" Binding="{Binding velocidade}" Width="50"/> 
        <DataGridTextColumn Header="SERVER" Binding="{Binding servidor}" Width="160"/> 
        <DataGridTextColumn Header="PROTOCOL" Binding="{Binding protocolo}" Width="98"/> 
       </DataGrid.Columns> 
      </DataGrid> 
     </Grid> 
    </Border> 
</Grid> 

Answer 1

代わりに、すべてのデータグリッドのためのマスクを使用して、datagridheaderが含まれないデータグリッドのスタイルが含ま：

<Grid> 
    <Border BorderThickness="1" BorderBrush="#FF3D3D3D" CornerRadius="5" Margin="44,28,134,60"> 
     <Grid> 
      <Border Name="mask" Background="#33000000" CornerRadius="4"/> 
      <DataGrid Name="dgConectedApps" Width="530" Height="67" Foreground="#FF2E2E2E" 
      CanUserAddRows="False" CanUserDeleteRows="False" CanUserResizeColumns="False" CanUserResizeRows="False" 
      AutoGenerateColumns="False" RowHeaderWidth="0" IsReadOnly="True" BorderThickness="0" GridLinesVisibility="None" 
      VerticalScrollBarVisibility="Disabled" > 
       <DataGrid.Resources> 
        <Style TargetType="{x:Type DataGridRow}"> 
         <Setter Property="Background" Value="Transparent"/> 
         <Setter Property="Height" Value="20" /> 
         <Setter Property="Foreground" Value="DarkGray" /> 
         <Setter Property="FontSize" Value="12" /> 
        </Style> 

        <Style TargetType="{x:Type DataGridCell}"> 
         <Setter Property="BorderThickness" Value="0" /> 
         <Setter Property="FocusVisualStyle" Value="{x:Null}" /> 
         <Setter Property="Background" Value="Transparent"/> 
         <Style.Triggers> 
          <Trigger Property="IsSelected" Value="True"> 
           <Setter Property="Background" Value="#00000000" /> 
           <Setter Property="Foreground" Value="DarkGray" /> 
          </Trigger> 
         </Style.Triggers> 
        </Style> 
        <Style TargetType="{x:Type DataGrid}"> 
         <Setter Property="Background" Value="Transparent"/> 
        </Style> 
       </DataGrid.Resources> 
       <DataGrid.ColumnHeaderStyle> 
        <Style TargetType="{x:Type DataGridColumnHeader}"> 
         <Setter Property="Background" Value="#151515" /> 
         <Setter Property="Height" Value="25" /> 
         <Setter Property="Foreground" Value="DarkGray" /> 
         <Setter Property="FontFamily" Value="Maven Pro" /> 
         <Setter Property="FontSize" Value="12" /> 
        </Style> 
       </DataGrid.ColumnHeaderStyle> 
       <DataGrid.Columns> 
        <DataGridTextColumn Header="ID" Binding="{Binding id}" Width="50"> 
         <DataGridTextColumn.HeaderStyle> 
          <Style TargetType="DataGridColumnHeader"> 
           <Setter Property="HorizontalContentAlignment" Value="Center"/> 
           <Setter Property="Background" Value="#FF151515" /> 
           <Setter Property="Height" Value="25" /> 
           <Setter Property="Foreground" Value="DarkGray" /> 
           <Setter Property="FontFamily" Value="Maven Pro" /> 
           <Setter Property="FontSize" Value="12" /> 
          </Style> 
         </DataGridTextColumn.HeaderStyle> 
        </DataGridTextColumn> 
        <DataGridTextColumn Header="APPLICATION" Binding="{Binding aplicacao}" Width="130"/> 
        <DataGridTextColumn Header="PING" Binding="{Binding ping}" Width="40"/> 
        <DataGridTextColumn Header="KBPS" Binding="{Binding velocidade}" Width="50"/> 
        <DataGridTextColumn Header="SERVER" Binding="{Binding servidor}" Width="160"/> 
        <DataGridTextColumn Header="PROTOCOL" Binding="{Binding protocolo}" Width="98"/> 
       </DataGrid.Columns> 
      </DataGrid> 
     </Grid>