WP7 LongListSelector ItemsSource Databinding Issue

Question

I am trying to implement the LongListSelector in a new WP7 application. The LongListSelector exists in a UserControl bound to an MVVMLight view model. I get the following error when I try to load the UserControl:

System.ArgumentException was unhandled Message=The parameter is incorrect. StackTrace: at MS.Internal.XcpImports.CheckHResult(UInt32 hr) at MS.Internal.XcpImports.SetValue(INativeCoreTypeWrapper obj, DependencyProperty property, Double d) at System.Windows.DependencyObject.SetValue(DependencyProperty property, Double d) at System.Windows.FrameworkElement.set_Width(Double value) at Microsoft.Phone.Controls.LongListSelector.GetAndAddElementFor(ItemTuple tuple) at Microsoft.Phone.Controls.LongListSelector.Balance() at Microsoft.Phone.Controls.LongListSelector.EnsureData() at Microsoft.Phone.Controls.LongListSelector.LongListSelector_Loaded(Object sender, RoutedEventArgs e) at System.Windows.CoreInvokeHandler.InvokeEventHandler(Int32 typeIndex, Delegate handlerDelegate, Object sender, Object args) at MS.Internal.JoltHelper.FireEvent(IntPtr unmanagedObj, IntPtr unmanagedObjArgs, Int32 argsTypeIndex, String eventName)

I have been able to narrow down the problem to the Items in my binding source, however I cannot see what the problem is.

Here is the XAML from my UserControl:

<UserControl x:Class="BTT.PinPointTime.WinPhone.Views.TaskSelectionControl"
         xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
         mc:Ignorable="d"
         FontFamily="{StaticResource PhoneFontFamilyNormal}"
         FontSize="{StaticResource PhoneFontSizeNormal}"
         Foreground="{StaticResource PhoneForegroundBrush}"
         d:DesignHeight="480"
         d:DesignWidth="480"
         DataContext="{Binding Source={StaticResource Locator}, Path=TaskSelection}">

<UserControl.Resources>
    <DataTemplate x:Key="itemTemplate">
        <StackPanel Grid.Column="1"
                    VerticalAlignment="Top">
            <TextBlock Text="{Binding Name}"
                       FontSize="26"
                       Margin="12,-12,12,6" />
        </StackPanel>
    </DataTemplate>

    <DataTemplate x:Key="groupHeaderTemplate">
        <Border Background="YellowGreen"
                Margin="6">
            <TextBlock Text="{Binding Title}" />
        </Border>
    </DataTemplate>

    <DataTemplate x:Key="groupItemTemplate">
        <Border Background="Pink"
                Margin="6">
            <TextBlock Text="{Binding Title}" />
        </Border>
    </DataTemplate>
</UserControl.Resources>

<Grid x:Name="LayoutRoot" Background="{StaticResource PhoneChromeBrush}">
    <Grid x:Name="ContentPanel"
          Grid.Row="1"
          Margin="12,0,12,0">
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <toolkit:LongListSelector Grid.Row="1"
                                  Background="Red"
                                  ItemsSource="{Binding GroupedTasks}"
                                  GroupItemTemplate="{StaticResource groupItemTemplate}"
                                  ItemTemplate="{StaticResource itemTemplate}"
                                  GroupHeaderTemplate="{StaticResource groupHeaderTemplate}">
            <toolkit:LongListSelector.GroupItemsPanel>
                <ItemsPanelTemplate>
                    <toolkit:WrapPanel />
                </ItemsPanelTemplate>
            </toolkit:LongListSelector.GroupItemsPanel>
        </toolkit:LongListSelector>
    </Grid>
</Grid>

And here is the code that I am using to populate the GroupedTasks property in my view model (it is declared as ObservableCollection> GroupedTasks):

 private void LoadData()
    {
        if (App.Database.Query<Task, Guid>().Count() > 0)
        {
            GroupedTasks.Clear();

            var tasks = (from t in App.Database.Query<Task, Guid>().ToList() select t.LazyValue.Value);

            var groupedTasks = from t in tasks
                               group t by t.FullParentString into t1
                               orderby t1.Key
                               //select new Group<Task>(t1.Key, t1);
                               select new Group<Task>(t1.Key);

            foreach (Group<Task> o in groupedTasks)
            {
                GroupedTasks.Add(o);
            }

            foreach (Group<Task> g in GroupedTasks)
            {
                var currentTasks = (from t in tasks where t.FullParentString == g.Title select t);

                foreach (Task t in currentTasks)
                {
                    g.Add(t);
                }
            }
        }

        _isDataLoaded = true;
    }

and finally here is the declaration of my Group class:

public class Group<T> : ObservableCollection<T>
{

    public string Title
    {
        get;
        set;
    }

    public bool HasItems
    {
        get
        {
            return Count != 0;
        }
        private set
        {
        }
    }

    public Group(string name)
    {
        this.Title = name;
    }
}

I did originally implement this as a simple IEnumerable as per the turorial on Windows Phone Geek. However that gave me exactly the same error.

I do not get any binding errors, however there is nothing that I can see that will enable me to track down the source of the problem.

Answer 1

The answer is found here: http://silverlight.codeplex.com/workitem/7707. Basically add a width and height to the LongListSelector.