NotifyCollectionChangedEvent处理程序中未处理的异常“参数不正确”

Question

I have a very simple ListView whose ItemsSource is a ObservableCollection . Better show it with code:

MainPage.xaml:

<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Windows.UI.Xaml.Shapes"
x:Class="Test.MainPage" Background="Black" >

<Grid x:Name="Board" Background="Transparent" >
    <ListView ItemsSource="{x:Bind LineList}">
        <ListView.ItemTemplate>
            <DataTemplate x:DataType="local:Line">
                <StackPanel Orientation="Horizontal" Spacing="5">
                    <TextBlock Foreground="White" Text="{x:Bind Name}"/>
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</Grid>

Mainpage.xaml.cs:

public sealed partial class MainPage : Page
{
    public ObservableCollection<Line> LineList = new ObservableCollection<Line>();

    public MainPage()
    {
        InitializeComponent();
        LineList.CollectionChanged += List_CollectionChanged;
        LineList.Add(new Line { Name = "Line1" });
        LineList.Add(new Line { Name = "Line2" });
    }

    private void List_CollectionChanged(object sender, NotifyCollectionChangedEventArgs e)
    {
        if(e.Action == NotifyCollectionChangedAction.Add)
        {
            Board.Children.Add(e.NewItems[0] as Line);//if I comment out this line, no exception
        }
    }
}

What I actually want is that, when I add a Line on the ListView to show it's Name , it be also added in the Grid as an actual Shape . Note that, I am using the ListView only to show the Names of those Lines, and in the Grid I want an actual Line Shape

I don't know what I've done wrong, but the above attempt gives the stated Exception.

If these informations help:

1. No Exception occurs if I don't add the Line in the Grid
2. No Exception if : Board.Children.Add(new Line { Name = "Line2" });

Answer 1

I've been fiddling around with your code and I was able to track down what is wrong with your code. However I'm not really sure why it's happening.

The reason why you're getting errors is because you're trying to use same instance of an UIElement (ie Line ) that you're binding to your ListView.ItemsSource . Why it's failing, is a bit of mystery to me. I suspect that it's forbidden to Bind and add the same UIElement to XAML, as it might create binding loops!? That's just a wild guess though. Anyways...

You shouldn't be using UIElement as the binding context - I can't think of any scenario that you would do such thing. You will be better off by creating a separate model, as per my previous answer (eg LineViewModel ), and using that as your BindingContext . Your MainPage.xaml.cs code could look like this:

public sealed partial class MainPage : Page
{
    public ObservableCollection<LineViewModel> Lines = new ObservableCollection<LineViewModel>();

    public MainPage()
    {
        InitializeComponent();

        Lines.CollectionChanged += LinesOnCollectionChanged;
        Lines.Add(new LineViewModel { Name = "Line1" });
        Lines.Add(new LineViewModel { Name = "Line2" });
    }

    private void LinesOnCollectionChanged(object sender, NotifyCollectionChangedEventArgs e)
    {
        if (e.Action == NotifyCollectionChangedAction.Add)
        {
            MainGrid.Children.Add(new Line()
            {
                Name = (e.NewItems[0] as LineViewModel)?.Name ?? string.Empty,
                Stroke = new SolidColorBrush(Colors.Black),
                StrokeThickness = 12,
                X1 = 0,
                X2 = 10000
            });
        }
    }
}

public class LineViewModel
{
    public string Name { get; set; }
}

The MainPage.xaml will stay the same, as per my previous answer

Answer 2

I'm not sure if this is what you're after but here it goes

MainPage.xaml

<Page x:Class="App4.MainPage"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:local="using:App4"
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
      mc:Ignorable="d">
    <Page.Resources>
        <Style x:Key="LineViewItemContainerStyle"
               TargetType="ListViewItem">
            <Setter Property="FontFamily"
                    Value="{ThemeResource ContentControlThemeFontFamily}" />
            <Setter Property="FontSize"
                    Value="{ThemeResource ControlContentThemeFontSize}" />
            <Setter Property="Background"
                    Value="{ThemeResource ListViewItemBackground}" />
            <Setter Property="Foreground"
                    Value="{ThemeResource ListViewItemForeground}" />
            <Setter Property="TabNavigation"
                    Value="Local" />
            <Setter Property="IsHoldingEnabled"
                    Value="True" />
            <Setter Property="Padding"
                    Value="0" />
            <Setter Property="HorizontalContentAlignment"
                    Value="Stretch" />
            <Setter Property="VerticalContentAlignment"
                    Value="Stretch" />
            <Setter Property="MinWidth"
                    Value="{ThemeResource ListViewItemMinWidth}" />
            <Setter Property="MinHeight"
                    Value="{ThemeResource ListViewItemMinHeight}" />
            <Setter Property="AllowDrop"
                    Value="False" />
            <Setter Property="UseSystemFocusVisuals"
                    Value="True" />
            <Setter Property="FocusVisualMargin"
                    Value="0" />
            <Setter Property="FocusVisualPrimaryBrush"
                    Value="{ThemeResource ListViewItemFocusVisualPrimaryBrush}" />
            <Setter Property="FocusVisualPrimaryThickness"
                    Value="2" />
            <Setter Property="FocusVisualSecondaryBrush"
                    Value="{ThemeResource ListViewItemFocusVisualSecondaryBrush}" />
            <Setter Property="FocusVisualSecondaryThickness"
                    Value="1" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListViewItem">
                        <ListViewItemPresenter x:Name="Root"
                                               CheckBrush="{ThemeResource ListViewItemCheckBrush}"
                                               ContentMargin="{TemplateBinding Padding}"
                                               CheckBoxBrush="{ThemeResource ListViewItemCheckBoxBrush}"
                                               ContentTransitions="{TemplateBinding ContentTransitions}"
                                               CheckMode="{ThemeResource ListViewItemCheckMode}"
                                               DragOpacity="{ThemeResource ListViewItemDragThemeOpacity}"
                                               DisabledOpacity="{ThemeResource ListViewItemDisabledThemeOpacity}"
                                               DragBackground="{ThemeResource ListViewItemDragBackground}"
                                               DragForeground="{ThemeResource ListViewItemDragForeground}"
                                               FocusVisualSecondaryBrush="{TemplateBinding FocusVisualSecondaryBrush}"
                                               FocusVisualPrimaryThickness="{TemplateBinding FocusVisualPrimaryThickness}"
                                               FocusVisualSecondaryThickness="{TemplateBinding FocusVisualSecondaryThickness}"
                                               FocusBorderBrush="{ThemeResource ListViewItemFocusBorderBrush}"
                                               FocusVisualMargin="{TemplateBinding FocusVisualMargin}"
                                               FocusVisualPrimaryBrush="{TemplateBinding FocusVisualPrimaryBrush}"
                                               FocusSecondaryBorderBrush="{ThemeResource ListViewItemFocusSecondaryBorderBrush}"
                                               HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                                               Control.IsTemplateFocusTarget="True"
                                               PressedBackground="{ThemeResource ListViewItemBackgroundPressed}"
                                               PlaceholderBackground="{ThemeResource ListViewItemPlaceholderBackground}"
                                               PointerOverForeground="{ThemeResource ListViewItemForegroundPointerOver}"
                                               PointerOverBackground="{ThemeResource ListViewItemBackgroundPointerOver}"
                                               ReorderHintOffset="{ThemeResource ListViewItemReorderHintThemeOffset}"
                                               SelectedForeground="{ThemeResource ListViewItemForegroundSelected}"
                                               SelectionCheckMarkVisualEnabled="{ThemeResource ListViewItemSelectionCheckMarkVisualEnabled}"
                                               SelectedBackground="{ThemeResource ListViewItemBackgroundSelected}"
                                               SelectedPressedBackground="{ThemeResource ListViewItemBackgroundSelectedPressed}"
                                               SelectedPointerOverBackground="{ThemeResource ListViewItemBackgroundSelectedPointerOver}"
                                               VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal" />
                                    <VisualState x:Name="Selected" />
                                    <VisualState x:Name="PointerOver">
                                        <VisualState.Setters>
                                            <Setter Target="Root.(RevealBrush.State)"
                                                    Value="PointerOver" />
                                        </VisualState.Setters>
                                    </VisualState>
                                    <VisualState x:Name="PointerOverSelected">
                                        <VisualState.Setters>
                                            <Setter Target="Root.(RevealBrush.State)"
                                                    Value="PointerOver" />
                                        </VisualState.Setters>
                                    </VisualState>
                                    <VisualState x:Name="PointerOverPressed">
                                        <VisualState.Setters>
                                            <Setter Target="Root.(RevealBrush.State)"
                                                    Value="Pressed" />
                                        </VisualState.Setters>
                                    </VisualState>
                                    <VisualState x:Name="Pressed">
                                        <VisualState.Setters>
                                            <Setter Target="Root.(RevealBrush.State)"
                                                    Value="Pressed" />
                                        </VisualState.Setters>
                                    </VisualState>
                                    <VisualState x:Name="PressedSelected">
                                        <VisualState.Setters>
                                            <Setter Target="Root.(RevealBrush.State)"
                                                    Value="Pressed" />
                                        </VisualState.Setters>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="DisabledStates">
                                    <VisualState x:Name="Enabled" />
                                    <VisualState x:Name="Disabled">
                                        <VisualState.Setters>
                                            <Setter Target="Root.RevealBorderThickness"
                                                    Value="0" />
                                        </VisualState.Setters>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                        </ListViewItemPresenter>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Page.Resources>

    <Grid Background="Transparent">
        <ListView ItemContainerStyle="{StaticResource LineViewItemContainerStyle}"
                  ItemsSource="{x:Bind Lines, Mode=OneTime}"
                  HorizontalContentAlignment="Stretch"
                  VerticalContentAlignment="Stretch">
            <ListView.ItemTemplate>
                <DataTemplate x:DataType="local:LineViewModel">
                    <Grid x:Name="ItemGrid">
                        <Grid.RowDefinitions>
                            <RowDefinition />
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>
                        <TextBlock Foreground="Black"
                                   Text="{x:Bind Name, Mode=OneWay}" />
                        <Border Grid.Row="1"
                                BorderBrush="Black"
                                BorderThickness="1" />
                    </Grid>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Grid>
</Page>

MainPage.xaml.cs

public sealed partial class MainPage : Page
{
    public ObservableCollection<LineViewModel> Lines = new ObservableCollection<LineViewModel>();

    public MainPage()
    {
        InitializeComponent();

        Lines.Add(new LineViewModel { Name = "Line1" });
        Lines.Add(new LineViewModel { Name = "Line2" });
    }
}

public class LineViewModel
{
    public string Name { get; set; }
}

Note, that instead of using Line I used Border . Also, I needed to override base ListViewItemContainerStyle to set HorizontalContentAlignment and VerticalContentAlignment to Stretch , so that the DataTemplate elements can take up the entire space of the item

The result: