XAML Border

XAML Border Code Example

 

 

The <Border> element in XAML represents a border that can be applied to an XAML control. The Border class in C# is used to create and apply borders dynamically. The code sample in this article shows how to create a border around XAML elements.

 

To apply a border to a XAML element, you can place the element within a Border element, 

 

The BorderThickness and BorderBrush are two main properties of a Border The BorderBrush property represents the brush that is used to draw the border. The BorderThickness property represents the thickness of the border.

The CornerRadius property represents the degree to which the corners of a Border are rounded.

The following code snippet creates a Border element and sets its properties.

<Border
   BorderThickness="5"
   BorderBrush="Green"
   CornerRadius="10"
   Background="LightGray"
   HorizontalAlignment="Left"
   VerticalAlignment="Top"
   Width="270"
   Height="250" />

The code snippet in Listing 1 creates a border around a Canvas element and sets its properties.

The output looks like in Figure 1 where all the child controls are wrapped horizontally.

<Border
   BorderThickness="5"
   BorderBrush="Green"
   CornerRadius="10"
   Background="LightGray"
   HorizontalAlignment="Left"
   VerticalAlignment="Top"
   Width="270"
   Height="250">

   <Canvas Background="LightCyan" >
      <Rectangle
         Canvas.Left="30" Canvas.Top="20"
         Height="200" Width="200"
         Stroke="Black" StrokeThickness="10" Fill="Red" />
   </Canvas>
</Border>

Listing 1

The complete article has moved here: Border in WPF