I am trying to show a loading animation when a page is taking time to load. I am loading multiple/several user controls depending on user request using Thread. I have tried the following ways
this.Dispatcher.BeginInvoke(new Action(LoadSecondPageData), DispatcherPriority.Background);
when I am using this it is making my Loading animation freeze until the page loads
I also tried BackgroundWorker concept Loading animation is working here, but it is not allowing to load the usercontrols and giving an error.
Error: "The calling thread must be STA, because many UI components require this."
You need to start the animation on the main UI Thread using Dispatcher.BeginInvoke, but any loading of data should happen on a background thread so that the animation doesn't freeze.
When the data is loaded, any final updates that effect dependency properties need to be marshalled onto the UI thread using Dispatcher.BeginInvoke once more.
I also tried BackgroundWorker concept Loading animation is working here, but it is not allowing to load the usercontrols and giving an error.
This is by design, you're not allowed to touch anything on the UI side in your background thread, as it will not be STA. Instead, bind your progress indicator to properties that the thread could modify, and then the progress indicator will get the update via the INotifyPropertyChanged event.
For example, if you had a ProgressBar bound to ProgressPercentage, or an indeterminate busy indicator bound to IsBusy:
In XAML:
<ProgressBar x:Name="StatusBar"
Maximum="1" Value="{Binding ProgressPercentage}" />
In Code:
using (var backgroundWorker = new BackgroundWorker())
{
backgroundWorker.DoWork += (s, ex) =>
{
IsBusy = true;
StatusText = "Pretending to do something...";
for (int i = 0; i < 100; i++)
{
ProgressPercentage = (i + 1)/100.0D;
Thread.Sleep(100);
}
};
backgroundWorker.RunWorkerCompleted += (s, ex) =>
{
IsBusy = false;
StatusText = "Export Complete.";
};
backgroundWorker.RunWorkerAsync();
}
The background thread will do its work, the UI thread will not block while waiting, and your progress indicator will update as it goes.
Related
I am trying to create a drawing with 5000 Shape objects in a background thread on a canvas.
I use the asyn-await pattern:
async void CreateDrawingAsync()
{
await Task.Run(() => CreateDrawing()).ConfigureAwait(false);
}
void CreateDrawing()
{
DrawObjects = new ObservableCollectionEx<DrawObject>();
// or: DrawObjects.Clear();
RaisePropertyChanged("DrawObjects");
// etc ... etc ...
}
ObservableCollectionEx means I use an extension of ObservableCollection to add an object to the collection via the Dispatcher.
When I start CreateDrawingAsync in the Loaded event of the Window (in the ctor of Data) the UI is unresponsive.
Using DispatcherPriority.Background the items are added one by one in the UI, but also in that case, the UI is unresponsive.
Loaded += (object sender, RoutedEventArgs e) =>
{
DataContext = new Data(2000, 1000, 1000);
};
1) I expected the background thread would resolve the unresponsive UI issue, what am I overlooking?
2) Why does RaisePropertyChanged("DrawObjects") (see code above) have no effect? I would have expected the drawing would be cleared due to the propertychanged.
You should not do UI operations on a background thread. This includes:
Drawing on a canvas.
Raising PropertyChanged notifications.
Creating or updating an ObservableCollection.
Creating a fake-UI component like ObservableCollectionEx that just forwards all its work to the UI thread doesn't gain you anything.
I have a helper class I've written which can be used to run a long running task on my GUI. What it does is use styles to display a "working" animation and fades out the content so while the task is running, the user can see that something is in progress.
My problem is that when the long running task completes, it fades the content back in and hides the working animation - which is what it should do, but because I am using MVVM and primarily data binding for all my content display, the updates to the GUI components happen separately to the long running task. ie the data binding OnPropertyChanged("") events fire and then these are picked up by the GUI thread AFTER the long running task completes. But the problem is the Worker Animation closes when the long running task completes, but BEFORE the data bindings update.
So the end result is you get the worker animation displaying as expected while the task runs, but the data binding update takes a good 4-5 seconds or even longer for large datasets for all the tree data and during this time, the application is not in "working animation mode" and just freezes.
Is there a way I can have my worker animation continue to run not only for the Long running Method, but for the associated data binding updates from OnPropertyChanged as well?
Consider using BusyIndicator from Extended WPF toolkit. It should provide functionality you described. It has IsBusy property which you can bind to property in your ViewModel and set it to False after all work is done.
You can always change the style of BusyIndicator same way as you do with other controls. In my solutions I always use this control along with BackgroundWorker class from System.ComponentModel and I usually set IsBusy=false at the end of RunWorkerCompleted
private void LongRunningMethod()
{
this.IsBusy = true;
var worker = new BackgroundWorker();
worker.DoWork += this.LongMethodDoWork;
worker.RunWorkerCompleted += this.RunWorkerCompleted;
worker.RunWorkerAsync();
}
private void LongMethodDoWork(object sender, DoWorkEventArgs doWorkEventArgs)
{
...
}
private void RunWorkerCompleted(object sender, RunWorkerCompletedEventArgs runWorkerCompletedEventArgs)
{
...
this.IsBusy = false;
}
Thanks all for the answers. I've actually come across a solution that may be a bit controversial as some would construe it is a little bit of a hack, but it does exactly what I want it to do and there seems to be no other way to do it, so to me that is a code solution, not a hack.
I'm using the WPFBackgroundProgressIndicator open source project I downloaded from codeproject (I think) which has the option to show the busy indicator in the main content with or without a fade out, or as a popup and it runs as a background thread which is ideal and why I chose it.
The problem was that when you run a long running method, the code execution completes synchronously but all the binding OnPropertyChanged("") updates run asychronously and queue on the Dispatcher thread, so your work method completes before the WPF controls have a chance to call the Getters of the dependency properties, to retrieve the new value. What you need to do is effectively "block" until all the Dispatcher events have completed and that is why not everyone will like this solution as it "blocks", but then that is exactly what I am trying to do. I WANT to block the application until the full update has completed as I dont want the user to be able to do anything visually while data is still rendering, so that is my requirement. Clean blocking is preferable to messy interaction.
So the solution, believe it or not, is a single line of code just after the work method call. It is as follows.
Application.Current.Dispatcher.Invoke(new Action(() => { }), DispatcherPriority.ContextIdle, null);
Which as you can see effectively queues a new task on the Dispatcher thread and blocks current code execution until it finishes, but as you give it the lowest priority, this call will wait until all OTHER dispatcher execution finishes, ie all rendering completes. Once render is complete, this line will be executed and you will exit with all rendering complete. The full method I have used it in context is below. I welcome your thoughts and discussion on this approach.
public void LongRunningTaskWithFade(BusyDecorator busy, Action longTask)
{
if (loading) return;
loading = true;
busy.FadeTime = TimeSpan.Zero;
busy.IsBusyIndicatorShowing = true;
// in order for setting the opacity to take effect, you have to delay the task slightly to ensure WPF has time to process the updated visual
Application.Current.Dispatcher.BeginInvoke(new Action(() =>
{
try
{
longTask();
Application.Current.Dispatcher.Invoke(new Action(() => { }), DispatcherPriority.ContextIdle, null);
}
finally
{
HideBusyDisplay(busy);
}
}), DispatcherPriority.Background);
}
I've problem with update value in window, which is open via Show() method not ShowDialog() method. I use MVVM and use binding like:
Value="{Binding Path=MainProgressValue, UpdateSourceTrigger=PropertyChanged}"
In my property I use INotifyPropertyChanged for notify UI.
It worked fine, but now I open new window
window.DataContext = context;
if (owner != null)
window.Owner = owner;
resultHandler = new ViewModelBaseClass.ResultHandler(context_RequestClosing);
getDialogResultHandler = new ViewModelBaseClass.GetDialogResultHandler(context_GetDialogResultAction);
context.RequestClosing += resultHandler;
context.GetDialogResult += getDialogResultHandler;
window.Show();
There is progress bar. The window is shown and main thread continue with proceed program. But when DataContext call RaisePropertyChanged, the progress bar doesn't update. Is it possible that the window with progress bar uses another thread than the main thread?
How to update this value?
My guess based on your description is that you are expecting the UI to refresh while the main application thread is busy doing something. The main application thread is the UI thread so if this is the case you UI thread is blocked.
What you need to do is move the "program" portion that is doing the loading etc. and updating the progress value off into a worker thread (See ThreadPool) and when you want to signal the UI to refresh use the Dispatcher.BeginInvolke() example you found. This will execute your refresh code on the main UI thread.
I have create a custom date time control in silver light , in my silver light custom control there is property names "EditDate" this date is set with the help of binder , and basically doing two way binding , when i set edit date from date time picker , it well set my external property and while setting external property there is a setter event which performs some calculations , now the issue is while the calculation is in progress my date time picker popup remain opened , is there any way i can hide it immediately after setting "EditDate" ?
Thanks
Aman.
I think the calculations are freezing up the UI thread. Put the calculations in a BackgroundWorker so the UI can be updated as the calculations are being processed.
var bw = new BackgroundWorker();
//Will fire when backgroundworker starts
bw.DoWork += (snd, arg) =>
{
//Do your calculations here
CalculationsFunction(param1, param2)
//Cannot access UI elements here
};
//Will fire when backgroundworker finishes
bw.RunWorkerCompleted += (s, arg) =>
{
//Can access the UI here again if needed
if (arg.Error != null)
{
//Show message if error
}
else
{
//Update UI here if needed
}
};
//Begins running the background worker
bw.RunWorkerAsync((this.DataContext as Iteration));
I know that there are several implementations here and there, but i was still not able to 'lock' on something really useful...
Whenever i set some component DataContext or ItemsSource to some big object, there is this 'render time frozen GUI' which make the app real annoying (even when using Virtualization).
I know i can iterate the object and set the items one by one and show progress, but i am looking for some other approach which can let me show some moving indication while GUI is rendering. I also prefer to have some progress bar and not only make the mouse cursor change.
Is there a decent way to achieve the followings?
Many Thanks
Zamboni example is a very good one, but still does not solve the frozen GUI problem.
As mentioned, there is no currently simple way of having something 'alive' to update a gui control while GUI is busy rendering.
I currently found some event that is 'alive and kicking' while gui is rendering, althogh it should be turned off when not needed as it can fire something like 60 times per second.
CompositionTarget.Rendering += ReportRenderProgress;
You can then implement ReportRenderProgress() anyway you like to signal you progress bar to update. Currently, i dont see any better solution available in WPF to update a progress indication while rendering so i am marking this as the answer.
This is actually a problem. You are using the GUI thread to fill the data (from object structure into GUI). The GUI thread is required both to read Windows message queue (prevent app from freezing, allow app to be moved/respond) and it is required to do any updates to the GUI.
One solution could be to slowly fill the the object structure after binding. This would have to be done from the GUI thread, so you could add DoEvents() and/or some percent indicator+forced refresh to make application seem alive.
I am interested to hear if anyone has a better solution though.
BackgroundWorker has everything you need.
EDIT
In WPF the Dispatcher is being employed automatically to invoke cross-thread method calls.
Check out Build More Responsive Apps With The Dispatcher in MSDN magazine.
I also put together some code fragments from a ViewModel that shows a BackgroundWorker updating a progress bar.
<ProgressBar
VerticalContentAlignment="Stretch" VerticalAlignment="Stretch"
HorizontalAlignment="Stretch"
Minimum="0" Maximum="100"
Value="{Binding Path=BarPosition, Mode=TwoWay}"/>
// configure the background worker...
_backgroundWorker = new BackgroundWorker();
_backgroundWorker.WorkerReportsProgress = true;
_backgroundWorker.WorkerSupportsCancellation = true;
_backgroundWorker.DoWork += new DoWorkEventHandler(_backgroundWorker_DoWork);
_backgroundWorker.RunWorkerCompleted += new RunWorkerCompletedEventHandler(_backgroundWorker_RunWorkerCompleted);
_backgroundWorker.ProgressChanged += new ProgressChangedEventHandler(_backgroundWorker_ProgressChanged);
// control progress bar position
private int _barPosition = 0;
public int BarPosition
{
get { return _barPosition; }
set
{
_barPosition = value;
OnPropertyChanged("BarPosition");
}
}
// long operation
void _backgroundWorker_DoWork(object sender, DoWorkEventArgs e)
{
BackgroundWorker bw = sender as BackgroundWorker;
if (bw != null)
{
int pos;
for (int i = 0; i < 100; ++i
{
// report progress here for our long running operation..
pos = i/100;
bw.ReportProgress(pos);
Thread.Sleep(1000); // fake long operation
}
}
}
// report progress,,,
void _backgroundWorker_ProgressChanged(object sender, ProgressChangedEventArgs e)
{
BackgroundWorker bw = sender as BackgroundWorker;
if (bw != null)
{
BarPosition = e.ProgressPercentage;
}
}
// reset scroll bar position
void _backgroundWorker_RunWorkerCompleted(object sender, RunWorkerCompletedEventArgs e)
{
BackgroundWorker bw = sender as BackgroundWorker;
if (bw != null)
{
BarPosition = 0;
// Forcing the CommandManager to raise the RequerySuggested event to refresh UI...
CommandManager.InvalidateRequerySuggested();
}
}