Eugene Eugene - 1 year ago 110
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.

Answer Source

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;