I have a WPF application which uses a TabControl
for navigation. When opening a page with a lot of controls, the application hangs for a few seconds before opening the requested page.
I would like to add an overlay to the screen immediately after clicking to give the user the sensation that the application responds instantly. Users now often click multiple times since they don't get immediate feedback. Since rendering is done on the UI thread, how can I show the overlay before rendering starts?
This question has been asked a few times before with varying answers. I was hoping someone could point me to the best approach for this kind of issue.
ViewModel
internal void Navigate()
{
OverlayVisibility = Visibility.Visible;
// What to do here to show the overlay?
ViewModel currentPage = GetPage();
Pages.Add(currentPage);
CurrentPage = currentPage;
OverlayVisibility = Visibility.Collapsed;
}
View
<TabControl Grid.Row="1" ItemsSource="{Binding Pages}" SelectedItem="{Binding CurrentPage}" DisplayMemberPath="Title" />
<Border Grid.Row="1" Background="Red" Visibility="{Binding OverlayVisibility}" />
Option 1: Task.Delay
This answer suggests running an async operation of waiting 1 ms, which works but seems like a hack.
Option 2: Dispatcher.PushFrame
This answer proposes to manually trigger the Dispatcher but advises against using it.
Option 3: Render on lower Dispatcher Priority
This article proposes to execute the rendering code in a lower priority but also warns for issues regarding performance.
Is one of these options recommended for my issue or should I use another approach?