How to create the top left corner of a DataGrid in XAML?

Question

In connection with this question: The datagrid table table is the upper left corner .

I have DataGrid(not finished yet, sorry styles). How to change the background color in the upper left corner using XAML (unlike C # in another question)?

Here is my current XAML:

<DataGrid x:Name="DataGrid" HorizontalAlignment="Center" VerticalAlignment="Center"
          ColumnWidth="100" ColumnHeaderHeight="50" RowHeight="50" RowHeaderWidth="115" Padding="5"
          BorderBrush="#FF646464" FontSize="18" FontFamily="Segoe UI"
          CanUserReorderColumns="False" CanUserResizeColumns="False" CanUserSortColumns="False" CanUserResizeRows="False"
          Focusable="False" IsEnabled="False" IsReadOnly="True">
    <DataGrid.Background>
        <SolidColorBrush Color="#FFFFFFC8"/>
    </DataGrid.Background>
    <DataGrid.Columns>
        <DataGridTextColumn Binding="{Binding In}" Header="In"/>
        <DataGridTextColumn Binding="{Binding Out}" Header="Out"/>
        <DataGridTextColumn Binding="{x:Null}" Header="Hours"/>
    </DataGrid.Columns>
    <DataGrid.ColumnHeaderStyle>
        <Style TargetType="{x:Type DataGridColumnHeader}">
            <Setter Property="Background" Value="#FFFFFFC8"/>
            <Setter Property="BorderBrush" Value="DarkSlateGray"/>
            <Setter Property="BorderThickness" Value="1, 2"/>
            <Setter Property="FontWeight" Value="SemiBold"/>
            <Setter Property="HorizontalContentAlignment" Value="Center"/>
            <Setter Property="Padding" Value="5"/>
        </Style>
    </DataGrid.ColumnHeaderStyle>
    <DataGrid.RowBackground>
        <SolidColorBrush Color="Transparent"/>
    </DataGrid.RowBackground>
    <DataGrid.RowHeaderStyle>
        <Style TargetType="{x:Type DataGridRowHeader}">
            <Setter Property="Background" Value="#FFFFFFC8"/>
            <Setter Property="BorderBrush" Value="DarkSlateGray"/>
            <Setter Property="BorderThickness" Value="2, 1"/>
            <Setter Property="FontWeight" Value="SemiBold"/>
            <Setter Property="Padding" Value="5"/>
        </Style>
    </DataGrid.RowHeaderStyle>
    <DataGrid.RowHeaderTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type DataGridRow}}, Path=Item.Day}"/>
        </DataTemplate>
    </DataGrid.RowHeaderTemplate>
</DataGrid>

Bonus: how can I get a 2px border in row / column headers where only 1px border currently exists?

Answer 1

So, if we go check out the Default Template and at the very top of the first code sample that we see

<!--Style and template for the button in the upper left corner of the DataGrid.-->

With a declared style template:

<Style TargetType="{x:Type Button}"
       x:Key="{ComponentResourceKey ResourceId=DataGridSelectAllButtonStyle, 
               TypeInTargetAssembly={x:Type DataGrid}}">

, / . ..

, <Style TargetType="{x:Type DataGridRowHeader}">, hard-set BorderThickness x:Name="rowHeaderBorder", . <Style TargetType="{x:Type DataGridColumnHeader}">, BorderThickness "1" x:Name="columnHeaderBorder"

Answer 2

. Backcolor Grid Opacity 0 Button :-)

<DataGrid Bacground="Yellow" RowHeaderWidth="100">
        <DataGrid.Resources>
            <Style TargetType="{x:Type Button}" x:Key="{ComponentResourceKey ResourceId=DataGridSelectAllButtonStyle, TypeInTargetAssembly={x:Type DataGrid}}">
                <Setter Property="Opacity" Value="0" />
             </Style>
        </DataGrid.Resources>