Silverlight - Block the screen while the ListBox is rendering using BusyIndicator

Question

I have a ListBox which is wrapped by a BusyIndicator. The ListBox is quite heavy sometimes it could take 4 or 5 seconds to render.

I wonder what is the best way to block the UI using the BusyIndicator while the ListBox is rendering?

Edit: Sorry I didn't make my question very clear... Please be aware of that the ItemsSource of the ListBox is bound to an ObservabaleCollection in the viewmodel. This colletion is populated fast. The thing I guess that really slows everything down is the UI rendering as the ListBox contains customised ListBoxItems which are quite complex.

Also the ListBox's ItemsPanel is a WrapPanel. It's not like the default VirtualisingStackPanel, so I guess this could be a ListBox performance issue?

Answer 1

This is basically how you could do it.

XAML file

<toolkit:BusyIndicator HorizontalAlignment="Left" VerticalAlignment="Top"
    x:Name="m_BusyIndicator">
    <ListBox Width="200" Height="300" x:Name="m_ListBox"/>
</toolkit:BusyIndicator>

CS file

public MainPage()
{
    // Required to initialize variables
    InitializeComponent();
    InitializeListBox();
}

private void InitializeListBox()
{
    m_BusyIndicator.IsBusy = true;
    m_ListBox.ItemsSource = null; // Load your data (mayby async) when done call OnListBoxItemsLoaded()
}

private void OnListBoxItemsLoaded()
{
    m_BusyIndicator.IsBusy = false;
}

Answer 2

If you don't want to use the toolkit you can use my answer to this question:

http://stackoverflow.com/questions/3437755/wpf-loading-image-to-show-page-loading-status/3438062#3438062

Answer 3

If you want to lock the entire UI, then you need to wrap the whole control layoutroot content with the busy indicator.