How can I make the combobox add items faster?

Question

I used a ComboBox to load all the font on the computer and preview it.

Here is the XAML:

<Window x:Class="Sample.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:Sample"
        mc:Ignorable="d"
        Title="Demo" Height="450" Width="800" WindowStartupLocation="CenterScreen" WindowStyle="None" Loaded="Window_Loaded" Background="White">
    <Window.Resources>
        <local:FontFamilyConverter x:Key="FontFamilyConverter"></local:FontFamilyConverter>
    </Window.Resources>
    <Grid>
        <ComboBox  Margin="10,10,0,10" HorizontalContentAlignment="Stretch" Name="FontFaimlyCB" Height="50" Width="250" ItemsSource="{Binding Source={x:Static Fonts.SystemFontFamilies}}">
            <ComboBox.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding}" FontFamily="{Binding Converter={StaticResource FontFamilyConverter}}" FontSize="20"></TextBlock>
                </DataTemplate>
            </ComboBox.ItemTemplate>
        </ComboBox>
    </Grid>
</Window>

And here is code-behind:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;
using System.Threading;
using System.Globalization;

namespace Sample
{

    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();            
        }

        private void Window_Loaded(object sender, RoutedEventArgs e)
        {            
        }
    }
    public class FontFamilyConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return new FontFamily(value.ToString());
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }
}

When the first time I click the ComboBox, it always takes a long time to add the items(There are almost one thousand fonts on my computer and it will takes 3-4 seconds to finish it). But any other software such as word/photoshop and so on won't like this.

How can I make it add faster? Please help me, thank you.

Answer 1

Create your own observable collection that allows you to suspend notifications when adding items. E.g.:

static void Main(string[] args)
{
    var fonts = new ObservableCollectionEx<string>();
    using (fonts.DeferCollectionChanged())
    {
        for (int i = 0; i < 100000; i++)
        {
            fonts.Add(Guid.NewGuid().ToString());
        }
    }
}

public class ObservableCollectionEx<T> : ObservableCollection<T>
{
    private int deferLevel;
    private bool collectionUpdateNeeded;

    public ObservableCollectionEx()
    {
    }

    public ObservableCollectionEx(IEnumerable<T> collection)
        : base(collection)
    {
    }

    public ObservableCollectionEx(List<T> collection)
        : base(collection)
    {
    }

    public override event NotifyCollectionChangedEventHandler CollectionChanged;

    protected override void OnCollectionChanged(NotifyCollectionChangedEventArgs e)
    {
        if (deferLevel == 0)
        {
            CollectionChanged?.Invoke(this, e);
            collectionUpdateNeeded = false;
        }
        else
        {
            collectionUpdateNeeded = true;
        }
    }

    public IDisposable DeferCollectionChanged()
    {
        ++deferLevel;
        return new DeferHelper(this);
    }

    private void EndDefer()
    {
        --deferLevel;

        if (deferLevel == 0 && collectionUpdateNeeded)
        {
            OnCollectionChanged(new NotifyCollectionChangedEventArgs(NotifyCollectionChangedAction.Reset));
        }
    }

    private class DeferHelper : IDisposable
    {
        private ObservableCollectionEx<T> collection;

        public DeferHelper(ObservableCollectionEx<T> collection)
        {
            this.collection = collection;
        }

        public void Dispose()
        {
            if (collection != null)
            {
                collection.EndDefer();
                collection = null;
            }
        }
    }
}

Answer 2

You could try to use a VirtualizingStackPanel as the ItemsPanel and set the MaxDropDownHeight to a fairly small value in order not to render all containers immediately. And you shouldn't have to use a converter:

<ComboBox  Margin="10,10,0,10" HorizontalContentAlignment="Stretch" Name="FontFaimlyCB" Height="50" Width="250" 
           ItemsSource="{Binding Source={x:Static Fonts.SystemFontFamilies}}"
            MaxDropDownHeight="50">
    <ComboBox.ItemsPanel>
        <ItemsPanelTemplate>
            <VirtualizingStackPanel />
        </ItemsPanelTemplate>
    </ComboBox.ItemsPanel>
    <ComboBox.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding}" FontFamily="{Binding}" FontSize="20" />
        </DataTemplate>
    </ComboBox.ItemTemplate>
</ComboBox>