Scroll Item into View
The RadNavigationView API offers ScrollIntoView support through the following method: ScrollIntoView. This method allows you to programmatically scroll an item into view when there are many RadNavigationViewItems.
ScrollIntoView
The ScrollIntoView method has two overloads. One of them accepts an item and the other one accepts an index. Examples 1, 2 setup a RadNavigationView in a databinding scenario to demonstrate this method.
Example 1: Setting up the model and viewmodel
public class NavigationItemModel
{
public string Title { get; set; }
}
public class MainViewModel
{
public ObservableCollection<NavigationItemModel> Items { get; set; }
public MainViewModel()
{
this.Items = new ObservableCollection<NavigationItemModel>();
for (int i = 1; i <= 50; i++)
{
this.Items.Add(new NavigationItemModel() { Title = "Item " + i });
}
}
}
Public Class NavigationItemModel
Public Property Title() As String
End Class
Public Class MainViewModel
Public Property Items() As ObservableCollection(Of NavigationItemModel)
Public Sub New()
Me.Items = New ObservableCollection(Of NavigationItemModel)()
For i As Integer = 1 To 50
Me.Items.Add(New NavigationItemModel() With {.Title = "Item " & i})
Next i
End Sub
End Class
Example 2: Setting up the xaml
<Grid>
<Grid.Resources>
<!-- If you are using the NoXaml binaries, you will have to base the style on the default one for the theme like so:
<Style TargetType="telerik:RadNavigationViewItem" BasedOn="{StaticResource RadNavigationViewItemStyle}">-->
<Style TargetType="telerik:RadNavigationViewItem" >
<Setter Property="Content" Value="{Binding Title}" />
</Style>
</Grid.Resources>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<telerik:RadNavigationView x:Name="navigationView" DataContext="{StaticResource ViewModel}" ItemsSource="{Binding Items}" PaneHeader="Header" />
<Button Click="ScrollItemIntoView" Content="Scroll Into View" Grid.Row="1" />
</Grid>
Example 3: Scrolling an item/index into View
private void ScrollItemIntoView(object sender, RoutedEventArgs e)
{
//this.navigationView.ScrollIntoView(this.navigationView.Items[15]);
this.navigationView.ScrollIntoView(15);
}
Private Sub ScrollItemIntoView(ByVal sender As Object, ByVal e As RoutedEventArgs)
'this.navigationView.ScrollIntoView(this.navigationView.Items[15]);
Me.navigationView.ScrollIntoView(15)
End Sub