'CarouselView Xamarin forms indicator view not showing

Im trying to see the indicator views , but for some reason I cant see them , also , I tried horizontals options : fill and expand , it does work on ios on landscaping orientation.However, I cant get it to expand when the android is on landscape

this is what I have

<StackLayout HorizontalOptions="FillAndExpand">
   <CarouselView EmptyView="No items to display."  IndicatorView="indicatorView" ItemsSource="{Binding CarouselImages}">
    <CarouselView.ItemTemplate>
        <DataTemplate>
            <StackLayout HorizontalOptions="StartAndExpand" >
                 <Image Source="{Binding ImagePath}"
                               Aspect="AspectFill"
                               HorizontalOptions="StartAndExpand" />
              </StackLayout>
        </DataTemplate>
    </CarouselView.ItemTemplate>
</CarouselView>
     <IndicatorView x:Name="indicatorView"
                    IndicatorsShape="Square"
                     MaximumVisible="6"
                   IndicatorColor="DarkRed"
                   SelectedIndicatorColor="DarkGray"
                   HorizontalOptions="Center" />

     </StackLayout>


Solution 1:[1]

Just manage to set the VerticalOptions and HorizontalOptions of the indicatorView to FillAndExpand like below:

<IndicatorView x:Name="indicatorView"
                   IndicatorsShape="Square"
                   MaximumVisible="6"
                   IndicatorColor="DarkRed"
                   SelectedIndicatorColor="DarkGray"
                   VerticalOptions="FillAndExpand"
                   HorizontalOptions="FillAndExpand"
                   />

Solution 2:[2]

Give it a size , for example IndicatorSize="12"

https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/indicatorview#change-indicator-size

  <IndicatorView
            x:Name="indicatorView"
            HorizontalOptions="Center"
            IndicatorColor="DarkRed"
            IndicatorsShape="Square"
            MaximumVisible="6"
            IndicatorSize="12"
            SelectedIndicatorColor="DarkGray" />

enter image description here

enter image description here

Solution 3:[3]

In your case, Indicator view is actually displayed. You haven't noticed it since it's present at the bottom edge of the mobile screen. Please refer the screenshot below:

Indicator view present at the bottom edge of the screen.

This is happening because the carousel view expands to most of the screen size available. You can fix this issue by providing a Heightrequest to carouselview control, say 200.

For example:

    <StackLayout HorizontalOptions="FillAndExpand">
        <CarouselView EmptyView="No items to display." HeightRequest="200"  VerticalOptions="Center" IndicatorView="indicatorView" ItemsSource="{Binding CarouselImages}">
            <CarouselView.ItemTemplate>
                <DataTemplate>
                    <StackLayout HorizontalOptions="StartAndExpand">
                        <Image Source="{Binding ImagePath}"
                           Aspect="AspectFill"
                           HorizontalOptions="StartAndExpand" />
                    </StackLayout>
                </DataTemplate>
            </CarouselView.ItemTemplate>
        </CarouselView>
        <IndicatorView x:Name="indicatorView"
                IndicatorsShape="Square"
                 MaximumVisible="6"
               IndicatorColor="DarkRed"
               SelectedIndicatorColor="DarkGray"
               HorizontalOptions="Center" />

    </StackLayout>

Please refer the screenshot after providing HeightRequest to the carouselview control:

Screenshot after adding HeightRequest to the carousel control

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Alexandar May - MSFT
Solution 2
Solution 3 elzajames