This topic explains the most basic steps which are required to have a fully functioning
slide view in your application.
Declaring RadSlideView
Note |
---|
Before we can declare RadSlideView we first to declare the xaml namespace for the
Telerik.Windows.Controls.Primitives assembly which is: CopyXAML xmlns:telerikPrimitives="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Primitives" |
To have a working slide view we first need to declare it on our xaml page, set the desired
item template and then populate it with some data. The item template is set through the ItemTemplate
property and the population with data is achieved by setting the ItemsSource property to a valid IEnumerable instance.
Here is the XAML for our basic slide view:
CopyXAML
<telerikPrimitives:RadSlideView x:Name="radSlideView" ItemsSource="{Binding}" ItemRealizationMode="ViewportItem">
<telerikPrimitives:RadSlideView.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<TextBlock Text="{Binding Title}" FontSize="{StaticResource PhoneFontSizeExtraLarge}"/>
<Image Source="{Binding ImagePath}" Stretch="None" Grid.Row="1" Margin="0,12,0,0"/>
</Grid>
</DataTemplate>
</telerikPrimitives:RadSlideView.ItemTemplate>
<telerikPrimitives:RadSlideView.ItemPreviewTemplate>
<DataTemplate>
<TextBlock HorizontalAlignment="Center"
VerticalAlignment="Center"
Text="{Binding Description}"
FontSize="{StaticResource PhoneFontSizeLarge}"/>
</DataTemplate>
</telerikPrimitives:RadSlideView.ItemPreviewTemplate>
</telerikPrimitives:RadSlideView>
Note |
---|
Please note that in order to provide fluent animations of high resolution images, you may need to set the CacheMode property of RadSlideView to BitmapCache.
This way you will prevent any flicker that can occur while sliding.
|
The control works in data-bound mode only and items may not be added directly to the internal items collection.
That is why we will add the data in code behind (of course you can provide it through a binding in XAML).
CopyC#
public partial class SamplePage : PhoneApplicationPage
{
public SamplePage()
{
InitializeComponent();
List<ViewModel> items = new List<ViewModel>();
for (int i = 1; i <= 8; i++)
{
ViewModel model = new ViewModel()
{
Title = "Item " + i,
ImagePath = "Images/" + i + ".jpg",
Description = "Description of " + "Item " + i
};
items.Add(model);
}
this.DataContext = items;
}
}
Here is the result of the above code: