Virtualization in WPF CheckedListBox

18 Nov 20185 minutes to read

UI Virtualization support is enabled by default in WPF CheckedListBox, which allows the users to load large sets of data without affecting loading or scrolling performance. This feature allows users to reduce the loading time of WPF CheckedListBox items regardless of items count.

C#

//Model.cs 
public class Model {
    public string Name { get; set; }
    public string GroupName { get; set; }
}

//ViewModel.cs
public class ViewModel : NotificationObject    {
    private ObservableCollection<GroupDescription> groupDescriptions;
    private ObservableCollection<Model> collection = new ObservableCollection<Model>();
    public ObservableCollection<Model> Collection {
        get { 
            return collection;
        }
        set { 
            collection = value; 
        }
    }

    public ObservableCollection<GroupDescription> GroupDescriptions {
        get {
            return groupDescriptions;
        }
        set {
            groupDescriptions = value;
            RaisePropertyChanged("GroupDescriptions");
        }
    }

    public ViewModel() {
        GroupDescriptions = new ObservableCollection<GroupDescription>();

        //Define virtualisation items
        Collection = new ObservableCollection<Model>();
        for (int i = 0; i < 1000; i++) {
            for (int j = 0; j < 10; j++) {                  
                Collection.Add( new Model()
                {
                    Name = "Module " + i.ToString(),
                    GroupName = "Group" + j.ToString() 
                });
            }
        }
    }
}

XAML

<Window.Resources>
    <local:ViewModel x:Key="viewModel">
        <local:ViewModel.GroupDescriptions>
            <PropertyGroupDescription PropertyName="GroupName" />
        </local:ViewModel.GroupDescriptions>
    </local:ViewModel>
</Window.Resources>
<Grid>
    <syncfusion:CheckListBox ItemsSource="{Binding Collection}" 
                             GroupDescriptions="{Binding GroupDescriptions}"
                             DataContext="{StaticResource viewModel}"
                             DisplayMemberPath="Name" 
                             Name="checkListBox"
                             Margin="20">
    </syncfusion:CheckListBox>
</Grid>

Click here to download the sample that showcases the virtualization support in the WPF CheckedListBox.

Disable the Virtualization

By default, only the items that are currently visible are loaded. If you want to mark items as checked that are not currently in view, you need to disable the virtualization; otherwise, the items will not be checked until they are brought into view. You can disable virtualization by using the ItemsPanel template.

XAML

<syncfusion:CheckListBox Name="checkListBox">
    <syncfusion:CheckListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel></StackPanel>
        </ItemsPanelTemplate>
    </syncfusion:CheckListBox.ItemsPanel>      
</syncfusion:CheckListBox>

C#

CheckListBox checkListBox = new CheckListBox();
checkListBox.ItemsPanel = new ItemsPanelTemplate(new FrameworkElementFactory(typeof(StackPanel)));

Click here to download the sample that showcases disable the virtualization.