Window freezes when adding items to ObservableCollection

Question

I have a DataGrid which is bound to an ObservableCollection ProductsFound which is exposed as a property in my ViewModel. By typing text in a TextBox, products contained in the model that have the Code property that contains the text inserted in the TextBox are added to ProductsFound.

I found out that if the DataGrid is contained in any control such as a StackPanel or a TabItem, the Window (the program) stops responding when I try to type text into the TextBox; while if the DataGrid isn't contained in any control, everything runs normally.

Here's the code for the window:

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

        // This method just fill the dataset I pass to the model's contructor in the next line.
        Init();
        ProductsModel model = new ProductsModel(dataSet);
        searchViewModel = new ProductsSearchViewModel(model);

        DataContext = searchViewModel;           
    }

    private ProductsSearchViewModel searchViewModel;

   // This handler supports the binding between the TextBox and the MatchText property of the View Model.
    private void TextBox_TextChanged(object sender, TextChangedEventArgs e)
    {
        var binding = ((TextBox)sender).GetBindingExpression(TextBox.TextProperty);
        binding.UpdateSource();
    }

}

And here's my ViewModel:

public class ProductsSearchViewModel : Notifier, IProductsSearchViewModel
{
    public ProductsSearchViewModel(IProductsModel inModel)
    {
        model = inModel;
        productsFound = new ObservableCollection<ProductViewModel>();       
    }

    private string matchText;
    private IProductsModel model;
    private ObservableCollection<ProductViewModel> productsFound;

    // This is a helper method that search for the products in the model and adds them to ProductsFound.
    private void Search(string text)
    {
        Results.Clear();

        foreach (Product product in model.Products)
        {                
            if (product.Code.ToLower().Contains(text.ToLower()))
                Results.Add(new ProductViewModel(product));
        }
    }

    public string MatchText
    {
        get { return matchText; }

        // This setter is meant to be executed every time the Text property of the TextBox is changed.
        set
        {
            if ((value != matchText) && (value != ""))
            {
                matchText = value;

                // This raises INotifyPropertyChanged.PropertyChaged.
                NotifyPropertyChanged("MatchText");
                Search(value);                  
            }
        }
    }

    public ObservableCollection<ProductViewModel> ProductsFound
    {
        get
        {
            return productsFound;
        }
        set
        {
            productsFound = value;
            NotifyPropertyChanged("Results");
        }
    }
}

Here's the XAML:

<Window x:Class="MyNameSpace.UI.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
<Grid>
    <StackPanel>
        <TextBox Text="{Binding MatchText, Mode=TwoWay}" TextChanged="TextBox_TextChanged"  />
        <DataGrid x:Name="grid1" ItemsSource="{Binding Results}" >
    </StackPanel>
</Grid>

With that StackPanel the program stops responding when I try to type text in the Textbox and no item is added to the DataGrid; but if i remove it everything runs ok. What could the problem be? Am I missing something in how the WPF binding system works? Is my view model coded wrong?

Thanks in advance.

Answer 1

Putting that StackPanel there prevents the DataGrid from acquiring a specific Height, thus it just expands down to infinity, and that breaks UI Virtualization.

Remove the StackPanel from there and use a non-infinite container, such as Grid or DockPanel.