[Solved] ListHeaderTemplate NullReferenceException

[Daniel]

Hi everyone,
I'm trying to template the RadJumplist and I have managed to design all the item templates but the ListHeaderTemplate without any exceptions or errors. When ever I try to specify the xaml a null reference exception is thrown in the visual studio designer. Could someone point out where I am going wrong with the ListHeaderTemplate or if I am missing something here?

<telerikDataControls:RadJumpList
    Grid.Row="1"
    ItemsSource="{Binding Stations}"
    Visibility="Collapsed"
    x:Name="StationsListBox"
    IsStickyHeaderEnabled="True"
    ItemAnimationMode="PlayAll"
    DataVirtualizationMode="OnDemandAutomatic" ItemTap="StationsListBox_ItemTap">
    <!-- Group by Line -->
    <telerikDataControls:RadJumpList.GroupDescriptors>
        <telerikData:PropertyGroupDescriptor PropertyName="Line"/>
    </telerikDataControls:RadJumpList.GroupDescriptors>

    <!-- Sort by Distance -->
    <telerikDataControls:RadJumpList.SortDescriptors>
        <telerikData:PropertySortDescriptor PropertyName="Distance"/>
    </telerikDataControls:RadJumpList.SortDescriptors>
    <telerikDataControls:RadJumpList.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Vertical" Margin="0,3" Grid.Row="0" Grid.Column="0">
                <telerikPrimitives:RadContextMenu.ContextMenu>
                    <telerikPrimitives:RadContextMenu IsZoomEnabled="False">
                        <telerikPrimitives:RadContextMenuItem x:Name="viewOnMapMenuItem" Content="view on map" Tag="{Binding}" Tap="viewOnMapMenuItem_Tap"/>
                        <telerikPrimitives:RadContextMenuItem x:Name="viewWebsiteMenuItem" Content="view website" Tag="{Binding}" Tap="viewWebsiteMenuItem_Tap"  Loaded="viewWebsiteMenuItem_Loaded" />
                    </telerikPrimitives:RadContextMenu>
                </telerikPrimitives:RadContextMenu.ContextMenu>
                <TextBlock Text="{Binding StationName}" FontSize="48"></TextBlock>
                <Border Margin="15,0,0,0" BorderBrush="{StaticResource PhoneAccentBrush}" BorderThickness="1,0,0,0">
                    <StackPanel>
                        <TextBlock Text="distance" FontSize="36" Margin="5,0,5,0"></TextBlock>
                        <StackPanel Orientation="Horizontal">
                            <TextBlock Text="{Binding Distance}" Foreground="{StaticResource PhoneAccentBrush}" Margin="5,0,5,0"></TextBlock>
                            <TextBlock Text="mi" Foreground="{StaticResource PhoneAccentBrush}" ></TextBlock>
                        </StackPanel>
                    </StackPanel>
                </Border>
            </StackPanel>
        </DataTemplate>
    </telerikDataControls:RadJumpList.ItemTemplate>
    <!--
    <telerikDataControls:RadJumpList.ListHeaderTemplate>
        <DataTemplate>
            <Border BorderThickness="3" BorderBrush="{StaticResource PhoneAccentBrush}" Padding="0, 8, 0, 8" Margin="0,0,0,6">
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding}" Margin="14,0,0,0" FontSize="36" Foreground="{StaticResource PhoneAccentBrush}"/>
                </StackPanel>
            </Border>
        </DataTemplate>
    </telerikDataControls:RadJumpList.ListHeaderTemplate>
    -->

    <telerikDataControls:RadJumpList.GroupHeaderTemplate>
        <DataTemplate>
            <Border BorderThickness="3" BorderBrush="{StaticResource PhoneAccentBrush}" Padding="0, 8, 0, 8" Margin="0,0,0,6">
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding}" Margin="14,0,0,0" FontSize="36" Foreground="{StaticResource PhoneAccentBrush}"/>
                </StackPanel>
            </Border>
        </DataTemplate>
    </telerikDataControls:RadJumpList.GroupHeaderTemplate>
    <telerikDataControls:RadJumpList.ListHeaderTemplate>
        <DataTemplate>
            <Border BorderThickness="3" BorderBrush="{StaticResource PhoneAccentBrush}" Padding="0, 8, 0, 8" Margin="0,0,0,6">
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding}" Margin="14,0,0,0" FontSize="36" Foreground="{StaticResource PhoneAccentBrush}"/>
                </StackPanel>
            </Border>
        </DataTemplate>
    </telerikDataControls:RadJumpList.ListHeaderTemplate>

    <telerikDataControls:RadJumpList.GroupPickerItemTemplate>
        <DataTemplate>
            <Border BorderThickness="0" Background="{StaticResource PhoneAccentBrush}" Padding="0, 8, 0, 8" Margin="0,0,0,6">
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding}" Margin="14,0,0,0" FontSize="36" Foreground="{StaticResource PhoneContrastBackgroundBrush}"/>
                </StackPanel>
            </Border>
        </DataTemplate>
    </telerikDataControls:RadJumpList.GroupPickerItemTemplate>
    <telerikDataControls:RadJumpList.GroupPickerOpenAnimation>
        <telerikCore:RadSlideContinuumAnimation></telerikCore:RadSlideContinuumAnimation>
    </telerikDataControls:RadJumpList.GroupPickerOpenAnimation>
</telerikDataControls:RadJumpList>

The exception thrown in the designer is:

System.NullReferenceException
Object reference not set to an instance of an object.
   at Telerik.Windows.Controls.VirtualizationStrategy.CheckBottomScrollableBounds()
   at Telerik.Windows.Controls.RadVirtualizingDataControl.ManageViewport()
   at Telerik.Windows.Controls.RadVirtualizingDataControl.BalanceVisualSpace()
   at Telerik.Windows.Controls.RadVirtualizingDataControl.OnLoaded(Object sender, RoutedEventArgs e)
   at Telerik.Windows.Controls.RadDataBoundListBox.OnLoaded(Object sender, RoutedEventArgs e)
   at Telerik.Windows.Controls.RadJumpList.OnLoaded(Object sender, RoutedEventArgs e)
   at MS.Internal.CoreInvokeHandler.InvokeEventHandler(UInt32 typeIndex, Delegate handlerDelegate, Object sender, Object args)
   at MS.Internal.JoltHelper.FireEvent(IntPtr unmanagedObj, IntPtr unmanagedObjArgs, Int32 argsTypeIndex, Int32 actualArgsTypeIndex, String eventName, UInt32 flags)


Microsoft.Windows.Design.Platform.InvalidDesignerUpdateException
An unhandled exception was encountered while trying to render the current silverlight project on the design surface. To diagnose this failure, please try to run the project in a regular browser using the silverlight developer runtime.

My guess is if I specify the ListHeaderTemplate I have to specify some data virtualization attribute?

Thanks for your help :)

[Deyan]

Hi Daniel,

Thanks for writing and for the provided XAML code.

The reason for the exception is that you have set the Visibility property of RadJumpList to Collapsed. This prevents the listbox from calculating its layout parameters (like viewport size, UI virtualization buffers) and because of this and some missing checks in RadJumpList an exception occurs.

Is there any special reason that you are setting the RadJumpList's visibility to Collapsed?

Thanks for your time.

Greetings,
Deyan
the Telerik team

[Daniel]

That seemed to resolve the problem but it the Binding is incorrect, I tried binding the to property Line with no success then I tried {Binding} with no success, I was looking for any type of List Header descriptor property I might have to specify but I couldn't find anything. Mind that the GroupHeaderDescriptor and the SortHeaderDescriptors function correctly, this ListHeaderTemplate seems to give me the run around.

The reason it was collapsed was because I display a BusyIndicator on navigated to, but it was changed by just collapsing the list in code behind.

Thanks for your help! 

EDIT:
I think I am getting confused with the purpose of the list header. I just altered the StickyHeaderTemplate and removed the ListHeaderTemplate. Maybe I'm misunderstanding what the ListHeaderTemplate is. Unfortunately it is not document on here: http://www.telerik.com/help/windows-phone/radjumplist-styles-and-templates-overview.html But anyways the issue is resolved

[Deyan]

Hi Daniel,

Thanks for writing back.

I am not quite sure that I correctly understand the issues you are having regarding bindings. Can you please elaborate a bit further?

The ListHeaderTemplate and ListHeaderContent properties are used to define a header for the scrollable list. This header will appear above the first item from the source and will be part of the scrollable content. The Sticky Header will appear on the top of the viewport of the control and is not part of the scrollable list. It is constantly updated with the header of the group in the Jump List which contents are currently focused in the viewport.

Let me know if I can be of further help.

Kind regards,
Deyan
the Telerik team