Hello MAUI Community, I'm experiencing an unexpected change in CarouselView navigation behavior after updating to .NET MAUI Essentials version 8.0.83. Previous Behavior (Before Update): When clicking an indicator dot, the CarouselView would directly navigate to the specific page as it should be. Current Behavior (After Update): Clicking an indicator dot now causes the CarouselView to navigate through intermediate pages sequentially, instead of jumping directly to the selected page. Environment Details: .NET MAUI Version: 8.0.83 Platforms Tested: [ iOS ] .NET SDK Version: [ 8.0.300 ] ============================================== Installed Workload Id Manifest Version Installation Source ios 18.0.8316/8.0.100 SDK 8.0.300 MAUI 8.0.83/8.0.100 SDK 8.0.300 Workload version: 8.0.300-manifests.22517898 ============================================== Reproduction Steps: Create a basic CarouselView with IndicatorView Attempt to navigate by clicking indicator dots Observe the navigation behavior Questions: Is this a known change in navigation behavior? Are there any configuration options to restore direct page navigation? Is this intentional or a potential bug? I would greatly appreciate any insights or guidance on this matter. Thank you for your help!

CarouselView Navigation Behavior Changed After MAUI Essentials 8.0.83 Update

Asjad Farooq 0

Hello MAUI Community,

I'm experiencing an unexpected change in CarouselView navigation behavior after updating to .NET MAUI Essentials version 8.0.83.

Previous Behavior (Before Update):

When clicking an indicator dot, the CarouselView would directly navigate to the specific page as it should be.

Current Behavior (After Update):

Clicking an indicator dot now causes the CarouselView to navigate through intermediate pages sequentially, instead of jumping directly to the selected page.

Environment Details:

.NET MAUI Version: 8.0.83
Platforms Tested: [ iOS ]
.NET SDK Version: [ 8.0.300 ]

==============================================

Installed Workload Id Manifest Version Installation Source

ios 18.0.8316/8.0.100 SDK 8.0.300

MAUI 8.0.83/8.0.100 SDK 8.0.300

Workload version: 8.0.300-manifests.22517898

==============================================

Reproduction Steps:

Create a basic CarouselView with IndicatorView
Attempt to navigate by clicking indicator dots
Observe the navigation behavior

Questions:

Is this a known change in navigation behavior?
Are there any configuration options to restore direct page navigation?
Is this intentional or a potential bug?

I would greatly appreciate any insights or guidance on this matter.

Thank you for your help!

Wenyan Zhang (Shanghai Wicresoft Co,.Ltd.) 34,071 Reputation points Microsoft Vendor

2024-12-13T05:44:09.7833333+00:00

What's the detailed iOS version? Do you test on iOS 18 devices? And could you attatch some code snippets about how you set the CarouselView? (Due to the pairing to mac issue, I 'm not able to test for now, please test the official sample and see if you still meet the same issue)

Asjad Farooq 0

Regarding the iOS Testing and CarouselView Behavior:

iOS Version Details:

Tested Devices:
- iPhone 14 Pro (iOS 16.7.2)
- iPhone 15 Pro (iOS 17.2)
- iOS Simulator (Various versions from iOS 15 to 17)

CarouselView Configuration Issue:

The current implementation has a specific navigation limitation where indicator clicks trigger sequential scrolling instead of direct jumps to the selected index.

Proposed Solution:

To enable direct navigation to the clicked indicator's corresponding carousel item, modify the CarouselView configuration:


<CarouselView

    x:Name="MyCarousel"

    Loop="False"

    IndicatorView="JobIndicator"

    HorizontalOptions="FillAndExpand"

    VerticalOptions="FillAndExpand"

    ItemsSource="{Binding CarouselList}">

    <CarouselView.ItemTemplate>

        <DataTemplate>

            <Image Source="{Binding .}"

                   Aspect="{Binding CarouselImageAspect}"/>

        </DataTemplate>

    </CarouselView.ItemTemplate>

</CarouselView>

<IndicatorView 

    x:Name="JobIndicator"

    IndicatorColor="{StaticResource SemiTransparentWhite}"

    SelectedIndicatorColor="{StaticResource White}"

    IndicatorSize="7"/>

Deleted

This comment has been deleted due to a violation of our Code of Conduct. The comment was manually reported or identified through automated detection before action was taken. Please refer to our Code of Conduct for more information.
Wenyan Zhang (Shanghai Wicresoft Co,.Ltd.) 34,071 Reputation points Microsoft Vendor

2024-12-16T09:22:32.03+00:00

Hello,

Please remove IndicatorSize="7".

Also, you could upgrade to .NET9 MAUI, it works fine on my side.

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.
Wenyan Zhang (Shanghai Wicresoft Co,.Ltd.) 34,071 Reputation points Microsoft Vendor

2024-12-31T02:09:37.96+00:00

Hi @Asjad Farooq ， In the previous answer, I suggest you removing the size, it still doesn't work, right? Could you provide more code snippets about the CarouselList?

Asjad Farooq 0

I have attached a video to demonstrate the issue.Recording.gif

<Grid RowDefinitions="Auto,Auto,Auto">
    <CarouselView 
        x:Name="carouselView" 
        ItemsSource="{Binding CarouselItems}" 
        IndicatorView="carouselIndicator"
        IsSwipeEnabled="False"
        IsBounceEnabled="False"
        HeightRequest="200"
        Grid.Row="0">
        <CarouselView.ItemTemplate>
            <DataTemplate>
                <Grid BackgroundColor="LightGray">
                    <Image 
                        Source="{Binding ImageUrl}" 
                        Aspect="AspectFill" 
                        HeightRequest="200" 
                        WidthRequest="200" />
                    <Label 
                        Text="{Binding Title}"
                        VerticalOptions="End"
                        HorizontalOptions="CenterAndExpand"
                        TextColor="White"
                        BackgroundColor="Black"
                        Opacity="0.6"
                        Padding="10" />
                </Grid>
            </DataTemplate>
        </CarouselView.ItemTemplate>
    </CarouselView>
    <IndicatorView 
        x:Name="carouselIndicator"
        Margin="0,30"
        Grid.Row="1"
        IndicatorColor="Gray"
        SelectedIndicatorColor="Black" />
</Grid>

Wenyan Zhang (Shanghai Wicresoft Co,.Ltd.) 34,071 Reputation points Microsoft Vendor

2024-12-31T09:50:29.4233333+00:00

I watch the video and reproduce the issue. I will determine if this is the default behavior and try to set the Position of the IndicatorView.
Asjad Farooq 0 Reputation points

2025-01-02T10:44:18.54+00:00

Hello @Wenyan Zhang, I'm looking for your response
Asjad Farooq 0 Reputation points

2025-01-02T10:48:22.6466667+00:00

I'm looking for your response.
Wenyan Zhang (Shanghai Wicresoft Co,.Ltd.) 34,071 Reputation points Microsoft Vendor

2025-01-03T06:09:53.67+00:00
Previous Behavior (Before Update):

When clicking an indicator dot, the CarouselView would directly navigate to the specific page as it should be.

I tried to test with Xamarin official CarouselView sample and tried to use different MAUI version to test, but I cannot reproduce this previous behavior.

Are there any configuration options to restore direct page navigation? I tried bind poison, but it doesn't work.

For this issue, please report the issue on GitHub, thanks for your feedback.

Share via

CarouselView Navigation Behavior Changed After MAUI Essentials 8.0.83 Update

Your answer