Telerik UI for Windows Phone by Progress

You jump to a group by picking it from the group picker popup window. It is shown when you click on a group header in RadJumpList.

By default, the picker will display all the actual groups within RadJumpList. When an item is picked, the GroupPickerItemTap event is handled internally and the control is scrolled to the beginning of the associated group.

RadJumpList allows you to manually specify the items in the picker. This is done by setting the GroupPickerItemsSource property.

Here is an example.

CopyC#
string alphabet = "#abcdefghijklmnopqrstuvwxyz";
List<string> groupPickerItems = new List<string>(32);
foreach (char c in alphabet)
{
    groupPickerItems.Add(new string(c, 1));
}
this.radJumpList.GroupPickerItemsSource = groupPickerItems;

If you want to modify the way the items gets visualized you can use the GroupPickerItemsPanel and GroupPickerItemTemplate properties. Here is an example of modifying the items panel:

CopyXAML
<telerikData:RadJumpList.GroupPickerItemsPanel>
    <ItemsPanelTemplate>
        <telerikPrimitives:RadWrapPanel Margin="12,0,12,0" ItemWidth="104" ItemHeight="104" />
    </ItemsPanelTemplate>
</telerikData:RadJumpList.GroupPickerItemsPanel>

Here is a snapshot of the result.

Jump List-Features-Group Picker-01

Notice that all the letters in the alphabet are present, as we explicitly set the GroupPickerItemsSource property.

When clicking a letter, the GroupPickerItemTap event is fired. You will need to handle it to navigate to the selected group, unless you are using the same objects for the Group Picker as those used to populate the Jump List. Read here how to do this.