Sagar
Sagar

Reputation: 421

How to show a loading image in UWP?

I am developing an UWP application. When user clicks on any control, if that control is taking longer time to execute its tasks I want to show an indication to the user like Operation is taking a long time, please wait with Images on the center of the screen. How can I do that in a UWP aplication?

I think here our UWP is working on Single Thread concept if I am right.
Please give me your suggestion to solve this issue.

Upvotes: 4

Views: 5705

Answers (2)

Daniel Luberda
Daniel Luberda

Reputation: 7454

You could use FFImageLoading it uses various methods for optimising image loading (including download/memory cache) and also supports loading / error placeholders:

<ff:FFImage VerticalAlignment="Stretch" HorizontalAlignment="Stretch" TransformPlaceholders="False" LoadingPlaceholder="loading.png" ErrorPlaceholder="error.png" Height="500" Width="500" Source="http://loremflickr.com/600/600/nature?filename=simple.jpg">

Upvotes: 0

Damir Arh
Damir Arh

Reputation: 17855

The best way to indicate a long running operation is to use the built-in ProgressRing control:

<ProgressRing x:Name="LoadingIndicator" />

Your long running operation should be implemented as an async method. You could call it as follows:

try
{
    LoadingIndicator.IsActive = true;
    await LongOperationAsync();
}
finally
{
    LoadingIndicator.IsActive = false;
}

Setting IsActive to true will display the progress ring and start the spinning. Setting it back to false will hide and deactivate it again. While LongOperationAsync is executing, the application will be responsive and the user will be able to interact with it.

If you're using MVVM, you can of course set a boolean property instead and bind it to IsActive property.

Not sure, where you've heard about a "single thread concept" for UWP apps, but nothing is stopping your app from being multithreaded. Indeed, you can't use the Thread class directly, but you should use Task instead anyway.

Upvotes: 9

Related Questions