WPF draws borders by border

WPF has its own table control, the DataGrid, the ListBox, and so on, and if it's just a simple requirement, you can draw a border through the border control.

For example, we need to add a border to the above controls.

<window x:class="Wpfapplication5.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:dxdo="http://schemas.devexpress.com/winfx/2008/xaml/docking"Xmlns:dxcore="Http://schemas.devexpress.com/winfx/2008/xaml/core"xmlns:local="Clr-namespace:wpfapplication5"mc:ignorable="D"Title="MainWindow"height=" -"Width="525"> <Window.Resources> <ResourceDictionary> <local:changevaluetoresult x:key="Changevaluetoresult"></local:ChangeValueToResult> <ResourceDictionary.MergedDictionaries> &LT;RESOURC Edictionary source="Style/test.xaml"/> </ResourceDictionary.MergedDictionaries> </ResourceDictionary> </window.resource s> <Grid> <Grid.RowDefinitions> <rowdefinition height="50*"/> <rowdefinition height="60*"/> <rowdefinition height="73*"/> <rowdefinition height="46*"/> <rowdefinition height="52*"/> <rowdefinition height="39*"/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <columndefinition width="91*"/> <columndefinition width="96*"/> <columndefinition width="105*"/> <columndefinition width="101*"/> <columndefinition width="124*"/> </Grid.ColumnDefinitions> <border grid.row="0"grid.column="1"grid.rowspan="3"grid.columnspan="2"Borderbrush="Chocolate"borderthickness="1"/> <border grid.row="0"grid.column="1"grid.rowspan="3"grid.columnspan="1"Borderbrush="Chocolate"borderthickness="0,0,1, 0"/> <border grid.row="0"grid.column="1"grid.rowspan="1"grid.columnspan="2"Borderbrush="Chocolate"borderthickness="0,0,0, 1"/> <border grid.row="1"grid.column="1"grid.rowspan="1"grid.columnspan="2"Borderbrush="Chocolate"borderthickness="0,0,0, 1"/> <border grid.row="2"grid.column="1"grid.rowspan="1"grid.columnspan="2"Borderbrush="Chocolate"borderthickness="0,0,0, 1"/> <textblock grid.row="0"grid.column="1"text="first row, second column"/> <textblock grid.row="1"grid.column="1"text="Second row, second column"/> <textblock grid.row="2"grid.column="1"text="third row, second column"/> <textblock grid.row="0"grid.column="2"text="first row, third column"/> <textblock grid.row="1"grid.column="2"text="second row, third column"/> <textblock grid.row="2"grid.column="2"text="Third row, third column"/> </Grid></Window>

So we get this effect:

The code is relatively simple, the main want to explain the next border BorderThickness property.

borderthickness= "1", give borderthickness only one value, this time border, the thickness of the upper and lower borders is 1.
If you don't want to show which side, set the side thickness to 0. such as borderthickness= "0,0,1, 0", this time left, up and down will not show, only the right side will be displayed.

WPF draws borders by border