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?

PageXML:
<UserControl x:Class="SharePointManager.ChangeListItem"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:mui="http://firstfloorsoftware.com/ModernUI"
             mc:Ignorable="d" 
             d:DesignHeight="412" d:DesignWidth="678" Width="800" Height="600">
    <Grid Style="{StaticResource ContentRoot}">
        <ScrollViewer>
            <StackPanel MinWidth="200">
                <TextBlock Text="Change List Item" Style="{StaticResource Heading2}" />
            </StackPanel>
        </ScrollViewer>
        <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"/>
    </Grid>
</UserControl>
PageCode:
 public partial class ChangeListItem : UserControl
    {
        public ChangeListItem()
        {
            InitializeComponent();

            GetWebApp();
        }

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

            MessageBox.Show("Test");

            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
{
get
{
    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
Hi,

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.

Regards
PrakashZa