Introduction to Borders
Everyone knows what exactly the Border is. It is a rectangular area used to decorate the UI elements. The main difference between a Rectangle and a Border is that Border allows you to add one single child element inside it.
Border.Childallows you to include a child DependancyObject inside a Border. Let us see a sample Border:
<border height="50" width="50" x:name="brdElement"> <border.background> <solidcolorbrush color="Bisque"></solidcolorbrush> </border.background> <border.effect > <dropshadoweffect blurradius="10" color="Red" direction="235" opacity=".5" renderingbias="Quality" shadowdepth="10"> </dropshadoweffect></border.effect></border>
First of all, Width / Height determines the dimension of the Border element. Border.Background determines what will be the color of the Brush which will draw the inside of the Border. You can see the color is Bisque. You can define any type of Brush here. SolidColorBrush takes one Color element(which is here defined as Bisque) and fills the Border Background with that color. There are other properties too like CornerRadius, used to create RoundedCorner Border etc. I will discuss them later in the article.
READ THE FULL ARTICLE Read Disclaimer Notice