Eugene Eugene - 1 month ago 8x
C# Question

How to make a loading screen?

I'm writing UWP app. I downloading

, deserialize it and bind it.

Here is code:

public async void Down()
WritingToTable wrt = new WritingToTable();

RestAPI rest = new RestAPI("",
"ck_9d64c027d2c5f81b8bed3342eeccc6d337be813d", "cs_60697b1e6cbdeb8d62d19e0765e339f8e3334754");
WCObject wc = new WCObject(rest);
//Get all products
var orders = await wc.GetOrders(new Dictionary<string, string>()
{"per_page", "100"}
string products = orders.ToFormattedJsonString();

List<RootObject> rootObjectData = JsonConvert.DeserializeObject<List<RootObject>>(products);

foreach (RootObject root in rootObjectData)
string date = root.date_created;
string name = root.billing.first_name;
Orders = new ObservableCollection<RootObject>(rootObjectData)
new RootObject {date_created = date}
OrdersGridView.ItemsSource = Orders;

How I can make loading screen? For example when data is downloading and binding app shows loading screen, when all done app shows data.


There are plenty of ways you can create a loading screen in UWP. It all depends on what you want to achieve. From your question I understand that your goal is to block user interaction with the app while data is being loaded and show a UI that notifies the user about the loading operation.

The simplest way to do this is to define a grid in your xaml. Something like this

        Background="{ThemeResource ABrushResource}" 
        Visibility="{Binding IsLoading, Converter = {StaticResource BooleanToVisibilityConverter}">
        <!--anything else you want to show-->

Make sure that the Grid, when visible, covers the whole page. Use Canvas.ZIndex if necessary to place it above any other content.

You can control the Grid's Visibility with a boolean property in your ViewModel and a BooleanToVisibilityConverter. You can write the converter yourself or find it online

So when you initiate the call to your service you could do this.

 IsLoading = true;
 var orders = await wc.GetOrders(new Dictionary<string, string>() {
                { "per_page", "100" }});

catch (Exception ex)
  // handle any exceptions, e.g. network exceptions
    IsLoading = false;