LongListSelector scrolling issues

Question

I'm working on a windows phone application and i have come across a very strange behaviour while scrolling in a LongListSelector. I have two TextBlocks and one CheckBox in its item template. Xaml code is shown below.

    <DataTemplate x:Key="GroupItem">
        <Border Background="{StaticResource PhoneAccentBrush}" Margin="{StaticResource PhoneTouchTargetOverhang}" Padding="{StaticResource PhoneTouchTargetOverhang}">
            <TextBlock Text="{Binding Key}" />
        </Border>
    </DataTemplate>

    <DataTemplate x:Key="ItemTmpl">
        <Grid x:Name="gridListPanel">
            <Grid.RowDefinitions>
                <RowDefinition Height="90"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="900"/>
            </Grid.ColumnDefinitions>
            <StackPanel>

                <TextBlock Padding="50,5,0,0" Width="Auto" Text="{Binding DayName}" Grid.Row="0" Grid.Column="0" FontSize="25" HorizontalAlignment="Left" VerticalAlignment="Top" FontWeight="Bold" Opacity="{Binding Path=OpacityValue, Converter={StaticResource OpacityConvertor}}"/>
                <StackPanel Orientation="Horizontal">
                    <TextBlock Padding="50,5,0,0" Width="Auto" Text="{Binding PushUps}" Grid.Row="1" Grid.Column="0" FontSize="17" HorizontalAlignment="Left" VerticalAlignment="Top" FontWeight="Normal" Foreground="{Binding TextColor}" Opacity="{Binding Path=OpacityValue, Converter={StaticResource OpacityConvertor}}"/>
                    <TextBlock Padding="30,5,0,0" Text="{Binding CompletedDate}" Grid.Row="0" Grid.Column="0" FontSize="15" HorizontalAlignment="Left" VerticalAlignment="Center" FontWeight="Normal"  Opacity="0.5"/>
                </StackPanel>

            </StackPanel>
            <CheckBox x:Name="chkWeek" HorizontalAlignment="Center" VerticalAlignment="Top" Grid.Row="0" Grid.Column="1"  IsChecked="{Binding IsCompleted}" Unchecked="chkWeek_Unchecked" Tap="chkWeek_Tap"/>

        </Grid>
    </DataTemplate>

<toolkit:LongListSelector  x:Name="LongList"
                                   Grid.Row="1"
                                   GroupHeaderTemplate="{StaticResource GroupHeader}"
                                   GroupItemTemplate="{StaticResource GroupItem}"
                                   ItemTemplate="{StaticResource ItemTmpl}" SelectionChanged="LongList_SelectionChanged" Grid.ColumnSpan="2"/>

I'm binding longlist as given:

mainItem = new List<Item>();
int counter = 19;

for (int i = 1; i <= 9; i++)
{
     switch (i)
     {
         case 1:
              mainItem.Add(new Item() { WeekName = "Week " + i.ToString(), DayName = "Week " + i.ToString() + ", Day 1", PushUps = counter + " Pushups to perform", TextColor = "White", ImageUri = new Uri("/Images/PushUpsImages/Images/w1d1.png", UriKind.Relative), OpacityValue = "0.5" });
              counter += 3;
              mainItem.Add(new Item() { WeekName = "Week " + i.ToString(), DayName = "Week " + i.ToString() + ", Day 2", PushUps = counter + " Pushups to perform", TextColor = "White", ImageUri = new Uri("/Images/PushUpsImages/Images/w1d2.png", UriKind.Relative), OpacityValue = "0.5" });
              counter += 5;
              mainItem.Add(new Item() { WeekName = "Week " + i.ToString(), DayName = "Week " + i.ToString() + ", Day 3", PushUps = counter + " Pushups to perform", TextColor = "White", ImageUri = new Uri("/Images/PushUpsImages/Images/w1d3.png", UriKind.Relative), OpacityValue = "0.5" });
              counter += 5;
              break;
       }
 }

var selected = from c in mainItem group c by c.WeekName into n select new GroupingLayer<string, Item>(n);
LongList.ItemsSource = selected;

When there is no checked item in LongListSelector means CheckBox is not checked. Scrolling work fine. But when any of item is checked while Scrolling after a little scroll it shows exception and at that time it calls this part of code again which is in page constructor.

var selected = from c in mainItem group c by c.WeekName into n select new GroupingLayer<string, Item>(n);
LongList.ItemsSource = selected;

At this point selected retun null and throws exception. Why this happening on scrolling means why it calls this part of code again on scrolling?

Answer 1

Try this, Set the following property where you define your LongListSelector in xaml file.

VirtualizingStackPanel.VirtualizationMode="Standard"

I m not sure about this but i have tried it with a list box.