Reputation: 63
I have a Xamarin Carousel view with the PeakAreaInsets set pretty high so that I can see multiple items in the list at once. However I notice that the current item when set to snap, aligns it self more with the top of the page when I would like it to snap to the center of the page. How can I accomplish this?
Here is a snippet of the code in question:
<ContentPage.Content>
<CarouselView ItemsSource="{Binding Days}"
CurrentItem="{Binding SelectedDay}"
VerticalOptions="Center"
HorizontalOptions="Center"
PeekAreaInsets="300"
x:Name="DayCarousel">
<CarouselView.ItemsLayout>
<LinearItemsLayout SnapPointsAlignment="Center"
SnapPointsType="Mandatory"
Orientation="Vertical"/>
</CarouselView.ItemsLayout>
<CarouselView.ItemTemplate>
<DataTemplate>
<StackLayout Spacing="0"
Orientation="Vertical"
HorizontalOptions="Center"
VerticalOptions="Center"
Margin="30,10">
<Label Text="{Binding FormattedDate}"
HorizontalOptions="Center"
VerticalOptions="Center"
Style="{StaticResource LabelStyle}"/>
<Label Text="{Binding TitleText}"
HorizontalOptions="Center"
VerticalOptions="Center"
Style="{StaticResource LabelHeader1Style}"/>
<StackLayout.GestureRecognizers>
<TapGestureRecognizer Command="{Binding BindingContext.SelectDay, Source={x:Reference this}}"
CommandParameter="{Binding .}"/>
</StackLayout.GestureRecognizers>
</StackLayout>
</DataTemplate>
</CarouselView.ItemTemplate>
</CarouselView>
</ContentPage.Content>
Here is about what it looks like now (just a mock up):
And here is what I would like it to look like:
Upvotes: 1
Views: 1140
Reputation: 63
I ended up playing around with it for a bit. I'm not sure how its going to look on other phone formats and sizes since I haven't tested that yet. But eventually I found a happy medium after tweaking the PeakAreaInsets
, and adjusting the SnapPointsAlignment
. Currently I have it set to PeakAreaInsets = 350
and SnapPointsAlignment="Start"
Upvotes: 1