New to Telerik UI for WinUI? Download free 30-day trial


RadCollectionNavigator provides a set of built-in commands that enables you to handle the user interface actions, but still make your logic independent of the UI layout.

All supported commands are defined in the RadCollectionNavigatorCommands class and are listed below:

  • AddNew
  • Delete
  • MoveCurrentToFirst
  • MoveCurrentToLast
  • MoveCurrentToNext
  • MoveCurrentToPrevious
  • BeginEdit

Using the RadCollectionNavigatorCommands

To utilize the built-in RadCollectionNavigator commands, you can set them directly to the Command property of a button. Once you click the button, the predefined command will be executed.

Binding a RadCollectionNavigatorCommands.Delete command in XAML

    <telerik:RadCollectionNavigator x:Name="collectionNavigator"/> 
    <telerik:RadButton Content="Delete"  
                       Command="{x:Bind telerik:RadCollectionNavigatorCommands.Delete}" 
                       CommandTarget="{x:Bind collectionNavigator}"/> 

Custom CommandProvider

RadCollectionNavigator exposes a CommandProvider property that allows you to customize the behavior of the commands in an MVVM-friendly way. Each of the commands listed in the beginning of the article can be customized by overriding its corresponding Execute/CanExecute method.

Creating a custom CollectionNavigatorBaseCommandProvider

public class CustomCommandProvider : CollectionNavigatorBaseCommandProvider 
    public override async void Delete() 
        ContentDialog contentDialog = new ContentDialog() 
            Title = "Delete confirmation", 
            Content = "Are you sure?", 
            PrimaryButtonText = "Delete", 
            SecondaryButtonText = "Cancel" 
        contentDialog.XamlRoot = this.CollectionNavigator.XamlRoot; 
        ContentDialogResult result = await contentDialog.ShowAsync(); 
        if (result == ContentDialogResult.Secondary) 
            //cancel deletion 

RadCollectionNavigator with custom CommandProvider implementation

        <local:CustomCommandProvider x:Key="CustomCommandProvider"/> 
    <telerikControls:RadCollectionNavigator x:Name="collectionNavigator" CommandProvider="{StaticResource CustomCommandProvider}"/> 

See Also

In this article
Not finding the help you need?