Borders

Borders frame your content. Literally. They make distinguishing individual items easier. PancakeView supports a wide variety of border options to play around with.

How to use

To get started with using borders we need to set the Border property to an instance of a Border object.

Using plain XAML

<yummy:PancakeView>
    <yummy:PancakeView.Border>
        <yummy:Border Color="#000000" Thickness="10" />
    </yummy:PancakeView.Border>
    <Label Text="This is just a happy little label." />
</yummy:PancakeView>

Using a markup extension

Alternatively, you can use the markup extension syntax for the Border property as well.

<yummy:PancakeView Border="{yummy:BorderMarkup Color=#FF0000, Thickness='10'}">
    <Label Text="This is just a happy little label." />
</yummy:PancakeView>

Property reference

Property	What it does	Default
Color	The color of the border.	Color.Default
DashPattern	Indicates whether or not the border has a dash pattern.	None
DrawingStyle	The drawing style of the border (Inside, Outside, Centered).	Inside
GradientAngle	The rotation of the gradient.	0
GradientStops	The stops within the gradient.	None
Thickness	The thickness of the border (can be set for each edge).	0, 0, 0, 0
** For more information on using gradients, check out the gradients documentation

Property reference GradientStop

Property	What it does	Default
Color	The Color of this part of the gradient.	0
Offset	The Offset of this color within the gradient.	None
** For more information on using gradients, check out the gradients documentation

Platform support

Property	iOS	Android	UWP	WPF	macOS
Color	✅	✅	✅		✅
DashPattern	✅	✅			✅
DrawingStyle	✅				✅
GradientAngle	✅	✅	✅		✅
GradientStops	✅	✅	✅		✅
Thickness	✅	✅	✅		✅