How to avoid multiple selected index change Event in TabbedPage on OnCurrentPageChanged

Question

I have a TabbedPage in MAUI with API level 34

<TabbedPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

        xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" >

<TabbedPage.ItemTemplate>

 <DataTemplate >

           <ContentPage Title="{Binding name} />

       </DataTemplate>

</TabbedPage.ItemTemplate>

</TabbedPage>

I have attach custom method to CurrentPageChanged Event as

CurrentPageChanged += OnCurrentPageChanged;

and in custom method after loading next three tab ,I have to show second tab as selected while

default behavior is it is showing first item as selected

    private async void OnCurrentPageChanged(object sender, EventArgs e)

    {

        // Prevent multiple triggers

        if (isProcessingPageChange) return;

        try

        {

            this.CurrentPageChanged -= OnCurrentPageChanged;

            if (CurrentPage != null)

            {

                isProcessingPageChange = true;

                // Defer the execution to the next UI cycle

                await Dispatcher.DispatchAsync(async () =>

                {

                    await LoadNextPage();

                    // Delay to ensure the UI has time to update the CurrentTabs collection

                    //await Task.Delay(0);

                  

                        if (Children.Count > 1)

                        {

                            MainThread.BeginInvokeOnMainThread(() =>

                            {

                                try

                                {

                             //here as per requirement i have to set second tab as selected while deafult behavior is it is showing first item as selected

                                    CurrentPage = Children[1]; // Set the second tab as selected

                                }

                                catch (ArgumentOutOfRangeException ex)

                                {                                   

                                }

                            });

                        }

                   isProcessingPageChange = false;

                });

            }

        }

        catch

        {

        }

        finally

        {

            isProcessingPageChange = false;

            this.CurrentPageChanged += OnCurrentPageChanged;

        }

    }

when I am calling this method and inside at CurrentPage = Children[1]; // Set the second tab as selected// its continuing for multiple hit as selected index is going on changing.

What is the approach to avoid multiple hit and get Tab movement smoothly.

Answer 1

Hello,

As I understand, you change the ItemSource of the TabbedPage to load more tabs by the LoadNextPage() method.

at this moment again and again selected index change method is going on calling

You could try finding the index, then tell if the item is the last one, after that you can load more items and set the CurrentPage.

private async void MainPage_CurrentPageChanged(object? sender, EventArgs e)
{
    var index = this.Children.IndexOf(this.CurrentPage);
 //MonkeyDataModel.All is the ItemsSource="{x:Static local:MonkeyDataModel.All}"
    if (index == MonkeyDataModel.All.Count-1) { 
        LoadNextPage();
        CurrentPage = Children[1];
    } 
}

Best Regards,

Wenyan Zhang

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.