MvvmCross with Template10

Question

I'm attempting to create a version of the UWP app for the TipCalc sample here: https://github.com/MvvmCross/MvvmCross-Samples/tree/master/TipCalc

There already is a UWP version in the sample, which works fine. However I'm attempting to use Template10 (https://github.com/Windows-XAML/Template10) and I am having trouble getting the two libraries to work together.

MvvmCross wants me to modify the OnLaunched method, which has a reference to the root Frame. However, Template 10 instead abstracts this method exposing OnStartAsync which has no such reference...

There is an override in Template 10 for CreateRootFrame which seems like the right place to initialize the mvvmcross app, but this doesn't appear to work the way I expected...

Although the launched app DOES navigate to the appropriate page, and does also appear to initialize the view model (a breakpoint on the Start method in the associated VM does get hit), the page itself is blank.

comparing the Visual Tree of both apps reveals that while the existing UWP app from the sample has a Frame:

my Template10 App is loading a Modal Dialog:

I forked the original sample project and added the template 10 version, if you wish to try it for yourself: https://github.com/selaromdotnet/MvvmCross-Samples

Has anyone else been able to integrate MvvmCross with template 10? do you have any idea what i'm doing wrong, and any advice for the best practices in using both of these libraries together?

I also attempted to move the start.Start() method to OnStartAsync but when I did I get this error: Error converting value \"Type\" to type 'Template10.Services.SerializationService.JsonSerializationService+Container'. A quick search suggests this is a bug that was fixed but updated to the very latest preview version of template 10 had no effect and I get the same result — SelAromDotNet
actually I was wrong, I don't get the same result when updating to the latest Template10 (preview) version, but instead the CreateRootElement is not called at all, and is in fact obsolete, so my app is never initialized and I get a null reference error. so yea definitely lost here, would appreciate any insight! — SelAromDotNet

SelAromDotNet SelAromDotNet · Accepted Answer · 2016-05-19T05:20:42

hmm it turns out that the ModalDialog is the expected behavior for Template10, according to the current docs here: https://github.com/Windows-XAML/Template10/wiki/Docs-|-Bootstrapper

I'm not familiar enough with Template10 to say why this is the case, but it does also say you can change this by overriding OnInitializeAsync, which I did, restoring the original frame in the same way the regular UWP project does:

    public override async Task OnInitializeAsync(IActivatedEventArgs args)
    {
        Frame rootFrame = Window.Current.Content as Frame;

        // Do not repeat app initialization when the Window already has content,
        // just ensure that the window is active
        if (rootFrame == null)
        {
            // Create a Frame to act as the navigation context and navigate to the first page
            rootFrame = new Frame();


            if (args.PreviousExecutionState == ApplicationExecutionState.Terminated)
            {
                //TODO: Load state from previously suspended application
            }

            // Place the frame in the current Window
            Window.Current.Content = rootFrame;
        }

        if (rootFrame.Content == null)
        {
            var setup = new Setup(rootFrame);
            setup.Initialize();
        }
        await Task.CompletedTask;
    }

This did the trick! I'm sure I still have a ways to go (I believe Template10 has it's own way of restoring state, so I probably shouldn't be doing it here)...

but this at least change finally got me to a working app. IF you know more about what I'm doing incorrectly here or what I should be doing instead, your comments would be greatly appreciated, thanks!

MvvmCross with Template10

1 Answers