How to set the border color and width of a card within the CardLayout
This section explains how to define the BorderWidth and BorderColor properties of SfCardView when it is added as a child of SfCardLayout.
Step 1: Refer to this Getting Started documentation, to create a simple CardView sample and configure it.
Step 2: Initialize the SfCardView as a child of card layout in XAML page and assign the available properties as per your requirement. Set the required BorderColor and BorderWidth properties of SfCardView inside the ChildAdded event of SfCardLayout as shown in the following code snippet.
XAML
<StackLayout> <cards:SfCardLayout HeightRequest="500" SwipeDirection="Left" ChildAdded="CardLayout_ChildAdded" > <cards:SfCardView BackgroundColor="Yellow"> <Label Text="Yellow"/> </cards:SfCardView> <cards:SfCardView BackgroundColor="Orange"> <Label Text="Orange"/> </cards:SfCardView> </cards:SfCardLayout></StackLayout>
C#
private void CardLayout_ChildAdded(object sender, ElementEventArgs e)
{
SfCardView cardView = e.Element as SfCardView;
if (cardView != null)
{
cardView.BorderWidth = 2;
cardView.BorderColor = Color.Black;
}
}
The above steps are needed only when SfCardView is added as a child of card layout.
Output
See Also
How to add multicolored stack of cards in Xamarin.Forms
How to remove cards from card view collection in Xamarin.Forms
How to set shadow effect to the cards in Xamarin.Forms
