Universal Windows Platform (UWP) App in Xamarin Forms

UWP for Xamarin Forms is still in preview and is available in version 2.0.0 and higher. (Update: Xamarin Forms for UWP is no longer in preview as of 2.1.0). I thought I would document some of the new concepts and challenges with UWP as I came across them. If you just want to get an app running take a look at a Xamarin’s Adding a Universal Windows Platform App.

The sample UWP app is available in my xarch-starter project.

Splash screen

SplashscreenFirst up I thought I would setup the Splash screen. Its a little different in that you go to your App Manifest > Visual Assets and set the images at particular scales. At first you see they want everything in a landscape format. That makes sense with it going into the Store and being accessible by tablets that are generally used in landscape. But on Windows Phone 10 they looked ridiculous in portrait and you couldn’t get it to go portrait.

This is basically a change in the way you will design your splash screen. Microsoft want you to have an image in the center of the screen and transparent everywhere else. You then use the background color to fill out the rest of your splash screen. This does have the advantage of making your splash screen looking nice on multiple sizes and orientations. If you can’t accept that, you can look at How to extend the splash screen (XAML).

Navigation Bar

With Android and iOS you have a navigation bar at the top and with Windows Phone you had to manually add in any header. UWP now has a navigation bar at the top just like the rest of them. However there is a twist. When you add a Toolbar in Xamarin Forms, it hides the top Navigation (Command) Bar.

This seems to be a Xamarin Forms implementation because the Guidelines for Command Bars from Microsoft shows you can have both but it would be confusing and not recommended.

UI Changes

UWP is starting to look a lot more like Android and iOS in its default settings on UWP, which is good news. Hopefully it means less OnPlatform changes to make. As you can see here on WinPhone, UWP and Android. The image in UWP seems to be the only thing really different. It is literally the same size on each device but just realizing here I most likely had 3 emulators are different resolutions, which may have had an impact.

WP81SL UWP Android

Notes

I will add to this blog post if I come across any more interesting changes. Hopefully this helps the huge number of people looking to transition from Windows Phone 8.0/8.1 SL to UWP. (I think that’s about 3 people including myself).


Posted

in

by

Tags: