WPF：如何避免 ListBox 或 ListView 中选中的复选框闪烁？

Question

如何避免 WPF ListBox 或 ListView 中选中的复选框闪烁？通过单击“刷新”按钮或滚动列表框，可以使用下面的代码来重现它。如果 IsChecked 为 false，则不会闪烁。

Window1.xaml：

<Window x:Class="WpfApplication6.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window1" Height="300" Width="300">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <ListBox Name="listBox">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <CheckBox IsChecked="True"
                                  VerticalAlignment="Center"/>
                        <Label Padding="3"
                               Content="{Binding}"/>
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
        <Button Content="Refresh"
                Grid.Column="1"
                VerticalAlignment="Top"
                Click="Button_Click"/>
    </Grid>
</Window>

Window1.xaml.cs：

using System.Windows;

namespace WpfApplication6
{
    partial class Window1 : Window
    {
        public Window1()
        {
            InitializeComponent();
            Button_Click(null, null);
        }

        void Button_Click(object sender, RoutedEventArgs e)
        {
            var items = new int[10000];
            for (int i = 0; i < items.Length; i++)
                items[i] = i + 1;
            listBox.ItemsSource = items;
        }
    }
}

Answer 1

它闪烁是因为您要丢弃旧的 ItemsSource 并创建一个新的 ItemsSource。这需要重做所有绑定，并且需要重新创建显示每个项目的模板。为了避免重新创建整个列表的性能开销，只需修改现有 ItemsSource 中的各个元素即可。然后，绑定到更改的属性和/或项目的 DataTemplate 部分将自动更新，而无需重新创建整个列表视图。这样做将消除您看到的“闪烁”。

尝试以下代码隐藏：

public partial class MainWindow : Window
{
    private ObservableCollection<object> _items;

    public MainWindow()
    {
        InitializeComponent();

        _items = new ObservableCollection<object>();
        for (int i = 0; i < 10000; i++)
            _items.Add(i + 1);
        listBox.ItemsSource = _items;

    }

    void Button_Click(object sender, RoutedEventArgs e)
    {
        for (int i = 0; i < _items.Count;i++)
        {
            if (!(_items[i] is int)) continue;
            _items[i] = (int)_items[i] + 1;
        }
    }
}

Answer 2

你的意思是复选框被选中吗？我认为当您选中/设置复选框时需要更改动画。

它不会出现在 Windows XP 上（这就是为什么我认为它是一个动画），我还没有测试过 Vista :)

祝你好运。

Answer 3

+1给Snake，他在这里有正确的答案。

添加到此：

CheckBox 控件有一个带有情节提要动画的控件模板，当选中状态更改时，该动画会以动画方式打开/关闭选中的图标。当您绑定到 ObservableCollection 并重新创建 ItemsSource 时，Checked 状态会发生变化，这会导致创建新的复选框（IsChecked=false）并绑定到您的 ViewModel（这可能会导致 IsChecked=True）。

要禁用此“功能”，您可以修改填充 ObservableCollection 的方式，或者如果不可能，您可以更改复选框的模板/样式。

只需对 Checkbox 的 ControlTemplate 进行逆向工程（使用混合或使用 WPF 主题之一）并找到这些行。您需要将两个动画的持续时间设置为零

<!-- Inside the CheckBoxTemplate ControlTemplate -->
<Storyboard x:Key="CheckedTrue">
    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="CheckIcon" 
                            Storyboard.TargetProperty="(UIElement.Opacity)">
        <SplineDoubleKeyFrame KeyTime="00:00:00.1000000" Value="1" />
    </DoubleAnimationUsingKeyFrames>
</Storyboard>
<Storyboard x:Key="CheckedFalse">
    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="CheckIcon" 
                            Storyboard.TargetProperty="(UIElement.Opacity)">
        <SplineDoubleKeyFrame KeyTime="00:00:00.4000000" Value="0" />
    </DoubleAnimationUsingKeyFrames>
</Storyboard>