How to use Loading / Progressbar from ModernUi Framework?

Dec 1, 2013 at 12:20 AM
Hi All,

I've created a simple custom page based on a ModernUI Basic Page. On this page I have some controls e.g. ComboBox.
To get the data for this control I have to execute a time intensive action that takes some seconds. Now I like to show the loading points (like a loading screen) or like in the DemoApp by the flickr example during this time...

But I could not find a good example to get this working.
My Code I have so far is below this message. What I am doing wrong or is something missing?

<UserControl x:Class="SharePointManager.ChangeListItem"
             d:DesignHeight="412" d:DesignWidth="678" Width="800" Height="600">
    <Grid Style="{StaticResource ContentRoot}">
            <StackPanel MinWidth="200">
                <TextBlock Text="Change List Item" Style="{StaticResource Heading2}" />
        <ComboBox x:Name="cboWebApplication" HorizontalAlignment="Left" Margin="146,35,0,0" VerticalAlignment="Top" Width="400" ToolTip="Select WebApplication"/>
        <Label x:Name="lblWebApplication" Content="WebApplication" HorizontalAlignment="Left" Margin="20,35,0,0" VerticalAlignment="Top"/>
        <Label x:Name="lblSiteCollection" Content="SiteCollection" HorizontalAlignment="Left" Margin="20,75,0,0" VerticalAlignment="Top"/>
        <ComboBox x:Name="cboSiteCollection" HorizontalAlignment="Left" Margin="146,75,0,0" VerticalAlignment="Top" Width="400" ToolTip="Select SiteCollection"/>
        <Label x:Name="lblList" Content="List" HorizontalAlignment="Left" Margin="20,115,0,0" VerticalAlignment="Top"/>
        <ComboBox x:Name="cboList" HorizontalAlignment="Left" Margin="146,115,0,0" VerticalAlignment="Top" Width="250" ToolTip="Select List"/>
 public partial class ChangeListItem : UserControl
        public ChangeListItem()


        private async void GetWebApp()
            SharePointLoader loader = new SharePointLoader();
            await Task.Run(() => loader.GetWebApplications());
public class SharePointLoader : IContentLoader
        public async Task<LinkCollection> GetWebApplications()
            LinkCollection WebApplications = new LinkCollection();
            await Task.Run(() => Thread.Sleep(10000));


            return WebApplications;

        public async Task<object> LoadContentAsync(Uri uri, CancellationToken cancellationToken)
            await Task.Run(() => Thread.Sleep(10000));
            object test = new object();

            return test;
            //throw new NotImplementedException();
Dec 19, 2013 at 12:40 AM
To do this, I cheated and made ModernFrame.IsLoadingContentPropertyKey public. After you do this, add the following to your main window:

ModernFrame m_ModernFrame = null;
/// <summary></summary>
public ModernFrame ModernFrame
    if (null == m_ModernFrame)
        m_ModernFrame = GetTemplateChild("ContentFrame") as ModernFrame;
    return m_ModernFrame;

Now you can call:
((MyMainWindw)MainWindow).ModernFrame.SetValue(ModernFrame.IsLoadingContentPropertyKey, true);((MyMainWindw)MainWindow).ModernFrame.SetValue(ModernFrame.IsLoadingContentPropertyKey, false);

It'd be nice if this were exposed in the library using a reference count maybe to handle multiple operations.
Dec 20, 2013 at 11:49 AM
Edited Dec 20, 2013 at 11:50 AM

What would be nice, is if the notion of a mui page life cycle could be explored, i.e 1) the page life cycle should keep state and allow the invocation of that state like mentioned above, 3) a mui bootstrapper and to specify a custome DI container, and custom MVVM framework to be used within the MUI template, 3) inject workflow with parameterization into it not just a hook, basically typical features like this, as my little UI work arounds are growing.