Is That UWP, WPF or WinForms: Bring Your Desktop App to the New Millennium with XAML Islands
XAML Islands, announced in May at MS Build, has spurred a lot of interest and discussion in the .NET community. Read on to learn about our experience with XAML Islands, starting with an overview of its functionality and features, all the way to its practical implications for .NET application development.
XAML Islands is one of the hot topics .NET developers have been exploring following the keynote announcement of Kevin Gallo at Build 2018. Microsoft has reported that over 2.4M developers are currently building desktop apps in Visual Studio EVERY month, with a 50% increase in the last 20 months.
Source: Windows Developer Slideshare
In this series of blogs, I will cover everything you need to know about XAML Islands, starting from what it actually is and what it provides to .NET developers, all the way to how you can use it in your applications and breathe new “life” and an improved UX to your current Windows Presentation Foundation (WPF) or Windows Forms applications.
Let's start off by covering how XAML Islands was born, and what you can do with them today.
How was XAML Islands Born?
To be a .NET desktop developer nowadays is super exciting. You have a wide variety of technologies from which you can choose to build your application. In addition to already established technologies like Windows Forms and WPF, in 2015 Microsoft announced the Universal Windows Platform (UWP). UWP is not just for desktops, but is rather a cross-platform technology for building applications that could run on desktop, Xbox, IoT, Surface Hub and Hololens.
So, what does UWP actually give us that Windows Forms and WPF don't?
The first thing that comes to our mind is the modern look and feel UWP provides. That look and feel is consistent with the OS. The Fluent design that is incorporated into Windows 10 and its features are also supported and built into UWP – it comes out of the box for the UWP developed applications.
Next, the framework also provides some features that are part of Windows 10 itself out of the box as well – like Tiles and Notifications.
Finally, you have improved servicing. This takes into account the Windows Store. UWP applications can easily be packaged into .appx and deployed into the store. The store provides great variety of services that you can integrate – using them you have multiple ways to deliver, manage and even make money from your app.
The question that likely pops up in your mind here is, “Is it possible to enhance my WPF/WinForms application with all the features UWP provides?” The answer is “Yes.”
What is XAML Islands and how can it Enhance My Application?
Your existing app can call and use almost every Windows 10 API. Some of the APIs require a simple contract to be added in order to be able to use them.
Using Desktop Bridge you can easily package your existing Win32 app into an .appx. The packing also gives a notion of identity to your app and that brings some of the benefits of calling additional Windows 10 APIs that need that identity.
Achieving a look and feel consistent with the OS, however, was mission impossible until now. At Build 2018 Kevin Gallo announced a functionality called “XAML Islands.” Using the islands you can modernize your application with UWP UI and still use your current implementation as much as possible. It has officially been released with the latest version of Windows (1809).
Now let’s dive deep into XAML Islands and see how it works and how to use it.
How do XAML Islands Work?
Source: Windows Developer Slideshare
XAML Islands are the perfect solution for every WPF/WinForms developer that wants to improve the look and feel of their application without migrating them to UWP. All UWP controls could directly be invoked and used from within WPF/WinForms.
The easiest way to work with XAML Islands is to use the NuGet packages provided by the Windows Community Toolkit. The toolkit contains two control implementations. These controls (one for WPF and one for Windows Forms) wrap the WindowsXamlManager and the DesktopWindowXamlSource:
- The WindowsXamlManager’s job is to initialize the UWP Framework inside the thread of your WPF/WinForms application. This will allow you to create UWP UI in WPF/WinForms.
- The DesktopWindowXamlSource’s purpose is to hold the instance of your Island content. It hosts any control that derives from UWP’s Windows.UI.Xaml.UIElement in a UI element that is associated with a window handle (HWND) – it renders to and gets its input from HWND. Using it you can also get and set the focus to that element.
NOTE: In order to be able to use these APIs, the latest version of Windows (1809) is required.Of course you can use the WindowsXamlManager and the DesktopWindowXamlSource’s to implement your host from scratch, but my suggestion is to use the wrappers that are already provided by the toolkit. You have the following packages:
- Microsoft.Toolkit.Wpf.UI.XamlHost – contains the wrapper of the WindowsXamlManager and the DesktopWindowXamlSource for WPF - the WindowsXamlHost.
- Microsoft.Toolkit.Wpf.UI.Controls – contains wrappers for the InkCanvas, InkToolbar, MapControl, and MediaPlayerElement controls that can directly be used in WPF.
- Microsoft.Toolkit.Forms.UI.XamlHost – contains the wrapper of the WindowsXamlManager and the DesktopWindowXamlSource for Windows Forms - the WindowsXamlHost.
- Microsoft.Toolkit.Forms.UI.Controls – contains wrappers for the InkCanvas, InkToolbar, MapControl, and MediaPlayerElement controls that can directly be used in Windows Forms.
If you are a WPF or Windows Forms developer you need to simply add one of the mentioned packages and you can use all wrapper controls or the WindowsXamlHost to host any UWP control.
What can You do with XAML Islands Today?
Currently, only a few UWP controls are wrapped and ready to use out of the box - they are part of the Microst.Toolkit.Forms/WPF.UI.Controls package:
- WebView – UWP control used to show web content using the Microsoft Edge engine. Yeah, we finally got a modern version of the WebBrowser control in our WinForms and WPF apps!
- WebViewCompatible – a version of the WebView that could be used with other operating systems (not only Windows 10). If it is used on Windows 10 version 1803 machine the Edge engine is used. For earlier versions the Internet Explorer engine is used.
- InkCanvas/InkToolbar – a surface for Windows Ink-base interaction.
- MediaPlayerElement – UWP view that streams and renders media content.
What Does the Future Hold for XAML Islands?
As the XAML Islands were released only a few months ago, they are still in a development stage and are constantly improving. In the near future more and more UWP controls are expected to be wrapped and a mechanics for wrapping third party controls is expected to be provided as well.
In our next blog post about XAML Islands we will go deep into the usage of the wrappers and how to create UWP bindings for them inside your WPF/WinForms application. In the meantime, when you have a chance go and check out XAML Islands. Happy playing with it. 😊
Atanas Popatanasov
Atanas Popatanasov is a Software Developer working on the Progress Telerik Xamarin and UWP team. He holds a bachelor's degree in Computer Systems and Technologies. In his spare time, Atanas loves reading programming books, to hang out with friends and to watch his favorite football team.
Related Posts
Comments
All articles
Topics
Latest Stories
in Your Inbox
Subscribe to be the first to get our expert-written articles and tutorials for developers!
All fields are required