Why is this XAML getting the error: Items collection must be empty before using ItemsSource

Question

Can anyone conjure from this code why the ItemsSource line would be getting a

Items collection must be empty before using ItemsSource.

error? Most solutions I've found point to ill-composed XAML, e.g. an extra element etc. which I don't seem to have. When I take out

ItemsSource="{Binding Customers}"

it runs without an error (but of course doesn't display my list of customers).

Customers is defines thusly in the ViewModel and has 3 CustomerViewModels in it:

Customer[] customers = Customer.GetCustomers();
IEnumerable<CustomerViewModel> customersViewModels = customers.Select(c => new CustomerViewModel(c));
this.Customers = new ReadOnlyCollection<CustomerViewModel>(customersViewModels.ToArray());

Any suggestions of where to look?

<UserControl x:Class="TestCommandSink123.View.CustomersView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:TestCommandSink123"
    xmlns:view="clr-namespace:TestCommandSink123.View"
    xmlns:vm="clr-namespace:TestCommandSink123.ViewModel"
    xmlns:sink="clr-namespace:TestCommandSink123.CommandSinkClasses"
    sink:CommandSinkBinding.CommandSink="{Binding}"
    >

    <UserControl.CommandBindings>
        <sink:CommandSinkBinding Command="vm:CustomersViewModel.CloseAllCustomersCommand"/>
    </UserControl.CommandBindings>

    <DockPanel>
        <ItemsControl
            DockPanel.Dock="Bottom" ItemsSource="{Binding Customers}">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <view:CustomerView/>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
            <Button
                Command="vm:CustomersViewModel.CloseAllCustomersCommand"
                Content="Close All"
                Margin="0,0,0,8"
                />
        </ItemsControl>

    </DockPanel>
</UserControl>

ANSWER:

I did indeed have malformed XAML, just overlooked it, the Button should be outside the ItemsControl:

<ItemsControl
    DockPanel.Dock="Bottom" ItemsSource="{Binding Customers}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <view:CustomerView/>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>
<Button
    Command="vm:CustomersViewModel.CloseAllCustomersCommand"
    Content="Close All"
    Margin="0,0,0,8"
    />

Answer 1

You are trying to set the ItemsSource of the ItemsControl but you already have children. Which of those two should apply? The Button you put inside the ItemsControl or the collection you are handing into it as ItemsSource? The error message is perfectly reasonable.

You would have to either remove the button from the ItemsControl or remove the ItemsSource attribute. You can't insert items and set ItemsSource at the same time.

Answer 2

Your ItemsControl has a Button in it. Since there's already an item in the ItemsControl, it's not letting you set its ItemsSource property.

Move the Button declaration down under the </ItemsControl> closing tag.

Answer 3

Have you looked at this question? It seems like the answer to your problem.

http://stackoverflow.com/questions/683863/wpf-items-collection-must-be-empty-before-using-itemssource