Events in Xamarin Cards
25 Sep 20235 minutes to read
CardTapped
The CardTapped
event occurs when any card view is tapped. The argument contains the following information:
-
CardView
- Gets the details of a particular card view.
Command
The CardTappedCommand
property is used to associate a command with an instance of SfCardLayout
. This property is most often set with MVVM pattern to bind callbacks back into the ViewModel.
CommandParameter
The CardTappedCommandParameter
property is used to set the parameter reference, based on which the event argument is shown.
NOTE
The default value of theCardTappedCommandParameter
isnull
.
<cards:SfCardLayout CardTappedCommand="{Binding CardTappedCommand}" CardTappedCommandParameter= "1">
<!--Add children for card layout-->
</cards:SfCardLayout>
public class ViewModel
{
public ViewModel()
{
ItemTappedCommand = new Command<object>(CardTapped);
}
public ICommand CardTappedCommand { get; set; }
private void CardTapped(object obj)
{
// handle event action.
}
}
VisibleCardIndexChanging
The VisibleCardIndexChanging
event occurs when the visible card index is changing. The argument contains the following information:
-
OldCard
- Gets the details of the previous index card. -
NewCard
- Gets the details of the next possible index card. -
Cancel
- Gets or sets a value indicating whether the event should be canceled.
<cards:SfCardLayout VisibleCardIndexChanging="VisibleCardIndexChanging" >
<cards:SfCardView>
<Label Text="Cyan" BackgroundColor="Cyan" />
</cards:SfCardView>
<cards:SfCardView>
<Label Text="Yellow" BackgroundColor="Yellow" />
</cards:SfCardView>
<cards:SfCardView>
<Label Text="Orange" BackgroundColor="Orange" />
</cards:SfCardView>
</cards:SfCardLayout>
...
InitializeComponent();
SfCardLayout cardLayout = new SfCardLayout();
cardLayout.VisibleCardIndexChanging += VisibleCardIndexChanging;
//Add children for card layout.
cardLayout.Children.Add(new SfCardView() { Content = new Label() { Text = "Cyan", BackgroundColor = Color.Cyan }});
cardLayout.Children.Add(new SfCardView() { Content = new Label() { Text = "Yellow", BackgroundColor = Color.Yellow }});
cardLayout.Children.Add(new SfCardView() { Content = new Label() { Text="Orange", BackgroundColor = Color.Orange }});
...
private void VisibleCardIndexChanging(object sender, Syncfusion.XForms.Cards.VisibleCardIndexChangingEventArgs e)
{
// handle event action.
}
...
VisibleCardIndexChanged
The VisibleCardIndexChanged
event occurs when the visible card index is changed. The argument contains the following information:
<cards:SfCardLayout VisibleCardIndexChanged="VisibleCardIndexChanged" >
<cards:SfCardView>
<Label Text="Cyan" BackgroundColor="Cyan" />
</cards:SfCardView>
<cards:SfCardView>
<Label Text="Yellow" BackgroundColor="Yellow" />
</cards:SfCardView>
<cards:SfCardView>
<Label Text="Orange" BackgroundColor="Orange" />
</cards:SfCardView>
</cards:SfCardLayout>
...
InitializeComponent();
SfCardLayout cardLayout = new SfCardLayout();
cardLayout.VisibleCardIndexChanged += VisibleCardIndexChanged;
...
private void VisibleCardIndexChanged(object sender Syncfusion.XForms.Cards.VisibleCardIndexChangedEventArgs e)
{
// handle event action.
}
...
Dismissing event
The Dismissing
event fires when dismissing the card by swiping with enables SwipeToDismiss
property. The argument contains the following information:
-
DismissDirection
- Gets a dismissing direction of the card view. -
Cancel
- Gets or sets a value indicating whether the event should be canceled.
<cards:SfCardView Dismissing="SfCardView_Dismissing" SwipeToDismiss="True">
<Label Text="SfCardView" />
</cards:SfCardView>
...
InitializeComponent();
SfCardView cardView = new SfCardView() { SwipeToDismiss = true };
cardView.Dismissing += SfCardView_Dismissing;
cardView.Content = new Label() { Text = "SfCardView" };
...
private void SfCardView_Dismissing(object sender, Syncfusion.XForms.Cards.DismissingEventArgs e)
{
e.Cancel = true;
}
...
NOTE
This event will not work when adding the
SfCardView
as a child ofSfCardLayout
.
Dismissed event
The Dismissed
event fires when dismisses the card by swiping with enables SwipeToDismiss
property. The argument contains the following information.
-
DismissDirection
- Gets a dismissed direction of the card view.
<cards:SfCardView Dismissed="SfCardView_Dismissed" SwipeToDismiss="True">
<Label Text="SfCardView" />
</cards:SfCardView>
...
InitializeComponent();
SfCardView cardView = new SfCardView() { SwipeToDismiss = true };
cardView.Dismissed += SfCardView_Dismissed;
...
private void SfCardView_Dismissed(object sender, Syncfusion.XForms.Cards.DismissedEventArgs e)
{
// handle event action.
}
...
NOTE
This event will not work when adding the
SfCardView
as a child ofSfCardLayout
.