How to highlight the border lines of a Grid control - wpf

Question

I have wrote some code in order to add 100 x 100 cells to a grid. The thing is that I would like to highlight the lines that split the rows/column of the grid.
What properties should I use, or how should I do that?
Bellow is the code for creating the grid cells :
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
for (int i = 0; i < 100 ; i++)
layoutGrid.RowDefinitions.Add( new RowDefinition { } );
for (int i = 0; i < 100; i++)
layoutGrid.ColumnDefinitions.Add(new ColumnDefinition { });
}
}

Answer 1

There's a couple ways you can try. If you take a look at Grid.cs, see the Brushes.Blue & Brushes.Yellow solid colors that make up the dashes you see when you enable ShowGridLines="True" in the source below? You can set those over to a different color (make them both the same color to not have to edit it much like Brushes.Gray, or you can omit the dash, draw a single line, and could even use a custom brush resource like a gradient.
/// <summary>
/// Helper to render grid lines.
/// </summary>
internal class GridLinesRenderer : DrawingVisual
{
/// <summary>
/// Static initialization
/// </summary>
static GridLinesRenderer()
{
s_oddDashPen = new Pen(Brushes.Blue, c_penWidth);
DoubleCollection oddDashArray = new DoubleCollection();
oddDashArray.Add(c_dashLength);
oddDashArray.Add(c_dashLength);
s_oddDashPen.DashStyle = new DashStyle(oddDashArray, 0);
s_oddDashPen.DashCap = PenLineCap.Flat;
s_oddDashPen.Freeze();
s_evenDashPen = new Pen(Brushes.Yellow, c_penWidth);
DoubleCollection evenDashArray = new DoubleCollection();
evenDashArray.Add(c_dashLength);
evenDashArray.Add(c_dashLength);
s_evenDashPen.DashStyle = new DashStyle(evenDashArray, c_dashLength);
s_evenDashPen.DashCap = PenLineCap.Flat;
s_evenDashPen.Freeze();
}
Or there's a trick you can do shown in XAML (because I had already slapped an example together for a past post elsewhere) where you take a border control with a set BorderBrush & BorderThickness and span incremental borders across the cells & columns like this example;
<Border Height="300" Width="300" Background="White" BorderThickness="1" BorderBrush="Gray">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="30"/>
<ColumnDefinition Width="30"/>
<ColumnDefinition Width="30"/>
<ColumnDefinition Width="30"/>
<ColumnDefinition Width="30"/>
<ColumnDefinition Width="30"/>
<ColumnDefinition Width="30"/>
<ColumnDefinition Width="30"/>
<ColumnDefinition Width="30"/>
<ColumnDefinition Width="30"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
</Grid.RowDefinitions>
<!-- Horizontal Accent Lines -->
<Border Grid.ColumnSpan="10" BorderThickness="0,1" BorderBrush="Gray"/>
<Border Grid.Row="2" Grid.ColumnSpan="10" BorderThickness="0,1" BorderBrush="Gray"/>
<Border Grid.Row="4" Grid.ColumnSpan="10" BorderThickness="0,1" BorderBrush="Gray"/>
<Border Grid.Row="6" Grid.ColumnSpan="10" BorderThickness="0,1" BorderBrush="Gray"/>
<Border Grid.Row="8" Grid.ColumnSpan="10" BorderThickness="0,1" BorderBrush="Gray"/>
<!-- Vertical Accent Lines -->
<Border Grid.Column="1" Grid.RowSpan="10" BorderThickness="1,0" BorderBrush="Gray"/>
<Border Grid.Column="3" Grid.RowSpan="10" BorderThickness="1,0" BorderBrush="Gray"/>
<Border Grid.Column="5" Grid.RowSpan="10" BorderThickness="1,0" BorderBrush="Gray"/>
<Border Grid.Column="7" Grid.RowSpan="10" BorderThickness="1,0" BorderBrush="Gray"/>
<Border Grid.Column="9" Grid.RowSpan="10" BorderThickness="1,0" BorderBrush="Gray"/>
<!-- Content Elements -->
<TextBlock Text="1" HorizontalAlignment="Center" VerticalAlignment="Center"/>
<TextBlock Text="2" Grid.Column="5" HorizontalAlignment="Center" VerticalAlignment="Center"/>
<TextBlock Text="3" Grid.Row="2" Grid.Column="9" HorizontalAlignment="Center" VerticalAlignment="Center"/>
<TextBlock Text="4" Grid.Row="4" Grid.Column="3" HorizontalAlignment="Center" VerticalAlignment="Center"/>
<TextBlock Text="5" Grid.Row="8" Grid.Column="7" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Grid>
</Border>
Or with XAML for DataGrid;
<Window.Resources>
<SolidColorBrush x:Key="RedGridLine" Color="#FFFF4444" />
<SolidColorBrush x:Key="BlueGridLine" Color="#554444FF"/>
</Window.Resources>
<my:DataGrid VerticalGridLinesBrush="{StaticResource RedGridLine}"
HorizontalGridLinesBrush="{StaticResource BlueGridLine}" >
Hope this helps and best of luck!