Events in .NET MAUI Tab View

22 Jul 20265 minutes to read

Prerequisites

Before using the SfTabView, ensure the following NuGet package is installed in your .NET MAUI project:

  • Syncfusion.Maui.TabView

For step-by-step setup, refer to the Getting Started documentation.

This section provides information about the events available in the .NET MAUI Tab View control.

Use the following events to respond to tab interactions in the SfTabView control:

  • TabItemTapped - Raised when a tab header is tapped, before the selection changes. Use this to handle the tap gesture or cancel the tap.
  • SelectionChanging - Raised before the selected tab changes. Use this to inspect or cancel the upcoming selection.
  • SelectionChanged - Raised after the selected tab changes (via tap, swipe, or programmatic update). Use this to react to the new selection.

TabItemTapped event

The TabItemTapped event is triggered whenever a tab is tapped. The TabItemTappedEventArgs provides the following properties:

  • TabItem - Gets the tapped tab item of the Tab View control.
  • Cancel - Gets or sets a value indicating whether the event should be canceled.
<tabView:SfTabView x:Name="tabView" TabItemTapped="TabView_TabItemTapped">
    <tabView:SfTabItem Header="Item1" />
    <tabView:SfTabItem Header="Item2" />
    <tabView:SfTabItem Header="Item3" />
</tabView:SfTabView>
SfTabView tabView = new SfTabView
{
    Items =
    {
        new SfTabItem { Header = "Item1" },
        new SfTabItem { Header = "Item2" },
        new SfTabItem { Header = "Item3" }
    }
};

tabView.TabItemTapped += TabView_TabItemTapped;
private void TabView_TabItemTapped(object sender, TabItemTappedEventArgs e)
{
   // Access the tapped tab item.
    var tappedItem = e.TabItem;

   // Cancel the event if needed.
    e.Cancel = true;
}

SelectionChanging event

The SelectionChanging event notifies before the selection changes, when the tab header is tapped, or when dynamically setting the SelectedIndex property of SfTabView. The SelectionChangingEventArgs provides the following properties:

  • Index - Gets the index value of the item that is about to be selected.
  • Cancel - Gets or sets a boolean value indicating whether the selection of the tab item should be canceled.
<tabView:SfTabView x:Name="tabView" SelectionChanging="TabView_SelectionChanging">
    <tabView:SfTabItem Header="Item1" />
    <tabView:SfTabItem Header="Item2" />
    <tabView:SfTabItem Header="Item3" />
</tabView:SfTabView>
SfTabView tabView = new SfTabView
{
    Items =
    {
        new SfTabItem { Header = "Item1" },
        new SfTabItem { Header = "Item2" },
        new SfTabItem { Header = "Item3" }
    }
};

tabView.SelectionChanging += TabView_SelectionChanging;
private void TabView_SelectionChanging(object sender, Syncfusion.Maui.TabView.SelectionChangingEventArgs e)
{
    // Access the index value of the item that is being selected.
    var selectionChangingIndex = e.Index;

    // If we set Cancel to true, the tab item will not be selected.
    e.Cancel = true;
}

SelectionChanged event

The SelectionChanged event is used to notify when the selection changes by swiping or dynamically setting the SelectedIndex property of SfTabView. The TabSelectionChangedEventArgs provides the following properties:

  • NewIndex - Gets the index of the currently selected tab item.
  • OldIndex - Gets the index of the previously selected tab item.
  • Handled - Gets or sets a value indicating whether the SelectionChanged event has been handled. Set this to true to stop further processing of the SelectionChanged notification.
<tabView:SfTabView x:Name="tabView" SelectionChanged="TabView_SelectionChanged">
    <tabView:SfTabItem Header="Item1" />
    <tabView:SfTabItem Header="Item2" />
    <tabView:SfTabItem Header="Item3" />
</tabView:SfTabView>
SfTabView tabView = new SfTabView
{
    Items =
    {
        new SfTabItem { Header = "Item1" },
        new SfTabItem { Header = "Item2" },
        new SfTabItem { Header = "Item3" }
    }
};
tabView.SelectionChanged += TabView_SelectionChanged;
private void TabView_SelectionChanged(object sender, TabSelectionChangedEventArgs e)
{
    // Access the new and old index.
    int newIndex = e.NewIndex;
    int oldIndex = e.OldIndex;

    // If we set Handled to true, further handling of the SelectionChanged event is stopped.
    e.Handled = true;
}

See also