Selecting Item in UWP Carousel (SfCarousel)
10 May 20212 minutes to read
Items can be selected programmatically using the properties SelectedIndex, SelectedItem.
Selecting an item using SelectedIndex
SelectedIndex property is used to select an item in SfCarousel using the index of item.
<layout:SfCarousel x:Name="carousel" SelectedIndex="2">
<layout:SfCarouselItem x:Name="item1" Content="Item 1"/>
<layout:SfCarouselItem x:Name="item2" Content="Item 2"/>
<layout:SfCarouselItem x:Name="item3" Content="Item 3"/>
<layout:SfCarouselItem x:Name="item4" Content="Item 4"/>
<layout:SfCarouselItem x:Name="item5" Content="Item 5"/>
</layout:SfCarousel>carousel.SelectedIndex = 2;carousel.SelectedIndex = 2
Selecting an item using SelectedItem
SelectedItem property is used to select an item in SfCarousel using the instance of item.
<layout:SfCarousel x:Name="carousel" SelectedItem="item3">
<layout:SfCarouselItem x:Name="item1" Content="Item 1"/>
<layout:SfCarouselItem x:Name="item2" Content="Item 2"/>
<layout:SfCarouselItem x:Name="item3" Content="Item 3"/>
<layout:SfCarouselItem x:Name="item4" Content="Item 4"/>
<layout:SfCarouselItem x:Name="item5" Content="Item 5"/>
</layout:SfCarousel>carousel.SelectedItem = item3;carousel.SelectedItem = item3
Navigating to next item
MoveNext method is used to select next item of the selected item in SfCarousel.
carousel.MoveNext();carousel.MoveNext()Navigating to previous item
MovePrevious method is used to select previous item of the selected item in SfCarousel.
carousel.MovePrevious();carousel.MovePrevious()Customizing the selected item
SelectedItemTemplate property is used to apply a template for the selected item
Refresh the layout
Refresh method is used to refresh the layout of SfCarousel control.