c# - ListBox 和 Checkbox 中有大量数据的奇怪行为 [提供的最小项目]

Question

针对这个问题，我做了一个最小的项目让每个人都能体验到这种行为。我希望它不仅仅是在我的引擎上这样运行。

minimal project

在我的项目中，我实现了一个包含大量示例数据的列表框。列表框也有一个用于每个项目的复选框元素。

问题:首先，我选中/取消选中列表框中的复选框。然后我在我的列表框中滚动几次。现在我注意到很多复选框被随机选中/取消选中。如果我将 ListBox 缩减一点(请参阅源代码中的注释)，则不会出现奇怪的行为。编辑::如果您没有这个问题，请尝试检查列表底部的项目。也许您必须用更多对象扩展列表才能看到问题。

这里是一些代码片段。如您所见，我已经尝试使用 List/ObservableCollection、PropertyChanged 和 LongListSelector 而不是 Listbox。

C#

    // Already tried to use simple List<SampleCheckedData> buildings. 
    // Doesnt change anything.
    private ObservableCollection<SampleCheckedData> buildings;

    // Already tried with this as well.
    /*protected ObservableCollection<SampleCheckedData> Buildings
    {
        get
        {
            return buildings;
        }
        set
        {
            buildings = value;
        }
    }*/

    public MainPage()
    {
        InitializeComponent();

        buildings = new ObservableCollection<SampleCheckedData>();

        buildings.Add(new SampleCheckedData() { Name = "Cloudy", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Sun", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Drizzle", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Snow", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Cloudy", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Sun", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Drizzle", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Snow", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Cloudy", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Sun", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Cloudy", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Sun", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Drizzle", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Snow", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Cloudy", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Sun", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Cloudy", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Sun", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Drizzle", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Snow", IsChecked = false });

        // If you comment this data out, the listbox is smaller and no problem occurs in my case.
        buildings.Add(new SampleCheckedData() { Name = "Cloudy" , IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Sun", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Cloudy", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Sun", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Drizzle", IsChecked = false });
        buildings.Add(new SampleCheckedData() { Name = "Snow", IsChecked = false });
        // If you comment this data out, the listbox is smaller and no problem occurs in my case. [END]

        this.listBox2.ItemsSource = buildings;
    }

我的勾选/取消勾选事件:

    private void CheckBox_Checked(object sender, RoutedEventArgs e)
    {
        //Use this if you use the LongListSelector.
        //ListBoxItem checedItem = this.listBox2.SelectedItem as ListBoxItem;

        ListBoxItem checedItem = this.listBox2.ItemContainerGenerator.ContainerFromItem((sender as CheckBox).DataContext) as ListBoxItem;
        if (checedItem != null)
        {
            checedItem.IsSelected = true;
        }
    }

    private void CheckBox_Unchecked(object sender, RoutedEventArgs e)
    {
        //Use this if you use the LongListSelector.
        //ListBoxItem checedItem = this.listBox2.SelectedItem as ListBoxItem;

        ListBoxItem checedItem = this.listBox2.ItemContainerGenerator.ContainerFromItem((sender as CheckBox).DataContext) as ListBoxItem;
        if (checedItem != null)
        {
            checedItem.IsSelected = false;
        }
    }

还有我的简单数据类:

public class SampleCheckedData
{
    //Already tried with this, but it is not working.

    /*
    private bool _isChecked;
    public bool IsChecked
    {
        get { return _isChecked; }
        set
        {
            if (_isChecked != value)
            {
                _isChecked = value;
                NotifyPropertyChanged("IsChecked");
            }
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    private void NotifyPropertyChanged(String info)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(info));
        }
    } 
    */

    public bool IsChecked
    {
        get;
        set;
    }

    public string Name
    {
        get;
        set;
    }
}

XAML

我的内容是这样的:

    <!--ContentPanel - zusätzliche Inhalte hier platzieren-->
    <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">

        <ListBox x:Name="listBox2" SelectionMode="Multiple">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <CheckBox IsChecked="{Binding IsChecked}" Checked="CheckBox_Checked" Unchecked="CheckBox_Unchecked"/>
                        <TextBlock Text="{Binding Name}" Width="150" VerticalAlignment="Center"/>
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

        <!--//Use this if you use the LongListSelector.-->
        <!--<toolkit:LongListSelector  x:Name="listBox2"  Background="Transparent" IsFlatList="True"   ItemTemplate="{StaticResource citiesItemTemplate}" />-->

    </Grid>

可选，如果你想尝试使用 LongListSelector 包括:

    <DataTemplate x:Key="citiesItemTemplate">
        <StackPanel Grid.Column="1"  VerticalAlignment="Top">
            <TextBlock Text="{Binding Name}" FontSize="26"  Margin="12,-12,12,6"/>
            <CheckBox IsChecked="{Binding IsChecked}" Checked="CheckBox_Checked" Unchecked="CheckBox_Unchecked"/>
        </StackPanel>
    </DataTemplate>

和 xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"

我希望有人能解决这个问题。没有发现任何线索...

编辑:

相关问题:

One Two Three

编辑:

我注意到你必须在列表中添加更多的对象才会有这个问题:

    buildings.Add(new SampleCheckedData() { Name = "Cloudy", IsChecked = false });
    buildings.Add(new SampleCheckedData() { Name = "Sun", IsChecked = false });
    buildings.Add(new SampleCheckedData() { Name = "Cloudy", IsChecked = false });
    .....

然后，当您检查列表顶部或底部的项目时，就会出现问题。

Answer 1

您永远不会保存复选框的选中状态。修复您的 XAML:

<CheckBox IsChecked="{Binding IsChecked,Mode=TwoWay}" Checked="CheckBox_Checked" Unchecked="CheckBox_Unchecked"/>