Multiple windows in a WinRT app (8.1 and 10) [UPDATED]

With Windows 8.1 appeared multitasking APIs allowing developers to use the Snap capabilities of Windows 8.0, expanded with Windows 8.1.
Since then, apps like Mail can open an embedded link by opening a second window. This multi windowing capability even made Apple jealous, and it is rumored to be available in iOS 9.

Multiple windows

Developers can also open a second window of the same app! This is really interesting as it allows, for example, to open a mail in a second window while having a primary window with all your unread mails.

Multiple instances of the same app

Apart from Microsoft apps, only a few apps are making use of those useful APIs, which is sad but understandable as the multi-windowing feature was designed primarily for tablets, which are definitely not selling like hotcakes.

With Windows 10, Microsoft introduced Tablet Mode (which I like to call Immersive Mode) and apps are in Fullscreen mode only when this mode is enabled. Otherwise, apps will launch in windows, just like it’s been the case before I was even born. Windows is about windows again, rejoice!

Getting started: how to use multiple windows

Interestingly, the APIs are the same whether you’re targetting Windows 8.1 or 10. The new version of Windows brings some new features, such as resizing your window.

Here’s the code.

First, you need to create a new CoreApplication view, so you have a new Dispatcher (new UI Thread) for that new view. Then, get the instance of the current window in that new view, set its Content (a Frame which navigates here to MainPage), and finally activate and show it by sending its Id to

Bonus

As you can see in the code, I take the benefits of some new Windows 10 APIs:

  • SetPreferredMinSize : Allows you to set the default minimum size of a window. If your secondary window is a widget, or a mini-player, this method is for you.
  • TryResizeView : Your UX scenario implies resizing the window for any reasons? Go for it.

Of course, using reflection you can use those in a W8.1 app running on a W10 machine.

Result

Windows 10 Apps

Windows 10 apps can resize and have a minimum size

Windows 8.1 window size can't be set by the developer, while the user has a very limited control over the window's size

Windows 8.1 window size can’t be set by the developer, while the user has a very limited control over the window’s size

Updated

It also works on Windows 10 Mobile!

GitHub

As usual, the samples are available here: https://github.com/ThomasNigro/Sample3-MultiWindowing

Please note: I’m thinking of having just one repo with all the code samples inside, rather than having one repo per blogpost. Any opinion?

Centered alignment of GridView Items

I realized this isn’t the easiest and most intuitive thing to do with XAML and WinRT, so here it is.
The goal is to display items in the Center of a GridView. By design, they are aligned to the left, which may cause a blank space to be displayed on the right if the last item of a row is too big to be actually rendered inside that row, thus resulting in an unexpected design.

This is your concept design, but in reality, if you decrease the width of the window, you'll just have a big, uncomfortable blank space on the right, as you'll see in the next screen

This is your concept design, but in reality, if you decrease the width of the window, you’ll just have a big, uncomfortable blank space on the right, as you’ll see in the next screen

Naively, one would think (and it should work this way) that the GridView’s HorizontalContentAlignment property may solve the issue, by setting it to Center. However, it does not. That’d be too easy. ¯\_(ツ)_/¯

Using GridView's HorizontalContentAlignment property doesn't change anything.

Using GridView’s HorizontalContentAlignment property doesn’t change anything.

The answer

Forget about that property, you’ll need to customize the ItemsPanel of the GridView; use a WrapGrid (or whatever suits your needs), and set HorizontalAlignment to Center. This way, your items will be displayed as desired.

Much better, isn't it?

Much better, isn’t it?

W10 APIs in a W8.1 app: Fullscreen mode

A month ago, Microsoft announced a new Windows 10 SDK which provides hundreds of new APIs. I’ll publish several blog posts on some of them I’m already using in my W10 apps, however, some big apps like VLC can’t just forget about their W8.1 users (millions of them) and jump in the W10 train.

There is a challenge: how can we use some of those W10 APIs in a W8.1 app? By using reflection. At runtime we ask the OS to find properties that are not visible when compiling the app. If we manage to find those properties then we can use them.

The Windows 10 SDK provides two methods to enter and go out fullscreen mode:

var appView = ApplicationView.GetForCurrentView();
appView.TryEnterFullScreenMode();
appView.ExitFullScreenMode();

In order to get those APIs and use them in our apps we need to find the runtime properties:
var runtimeMethods = view.GetType().GetRuntimeMethods();

Then, a simple LINQ request will do the trick 🙂

The full source code and sample solution is available on GitHub here