MainPage.xaml
<Page
x:Class="UniversalAppTutorials.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:UniversalAppTutorials"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
>
<RelativePanel Background="MintCream">
<TextBlock
x:Name="TextBlock1"
RelativePanel.AlignBottomWithPanel="True"
RelativePanel.AlignHorizontalCenterWithPanel="True"
Margin="15"
Foreground="Blue"
FontFamily="MV Boli"
FontSize="30"
FontStyle="Italic"
/>
<FlipView
x:Name="FlipView1"
Background="Transparent"
Padding="25"
SelectionChanged="FlipView1_SelectionChanged"
>
<!-- Item 1 -->
<Viewbox MaxWidth="200" MaxHeight="200">
<SymbolIcon Symbol="BackToWindow" Foreground="Red"/>
</Viewbox>
<!-- Item 2 -->
<Viewbox MaxWidth="200" MaxHeight="200">
<SymbolIcon Symbol="Calendar" Foreground="Blue"/>
</Viewbox>
<!-- Item 3 -->
<Viewbox MaxWidth="200" MaxHeight="200">
<SymbolIcon Symbol="Directions" Foreground="Violet"/>
</Viewbox>
<!-- Item 4 -->
<Viewbox MaxWidth="200" MaxHeight="200">
<SymbolIcon Symbol="Emoji" Foreground="HotPink"/>
</Viewbox>
<!-- Item 5 -->
<Viewbox MaxWidth="200" MaxHeight="200">
<SymbolIcon Symbol="Favorite" Foreground="OrangeRed"/>
</Viewbox>
</FlipView>
</RelativePanel>
</Page>
MainPage.xaml.cs
using Windows.UI.Xaml.Controls;
namespace UniversalAppTutorials
{
public sealed partial class MainPage : Page
{
public MainPage()
{
this.InitializeComponent();
}
private void FlipView1_SelectionChanged(object sender, SelectionChangedEventArgs e) {
// Get the FlipView instance
FlipView flipView = (FlipView)sender;
// Get the FlipView number of items
int items = flipView.Items.Count;
// Get the FlipView selected item position
int position = flipView.SelectedIndex + 1;
// Display the selected item position on TextBlock
TextBlock1.Text = "Item " + position + " of " + items;
}
}
}