UnoConf 2020
This article was originally published 12th August 2020 on Linkedin
The Evolution of Client Development - Richard Campbell
Computers as long ago 1980s with the IBM PC with the 80x25 character greenscreen and helped kick off the computer in the business world, then a couple of years later the Mac was released which brought the GUI and the mouse to the general market. Microsoft started releasing GUIs after this with Windows and with Windows 3.11 came Networking built in with Windows and there was Client Server architectures.
The challenge then was programming against Windows which initially would be written in C and any mistakes resulted with a crash and this changed in 1995 with the introduction of Visual Basic and introduced the familiar era of client development using mouse and keyboard.
Tim Berners Lee who worked for CERN developed the World Wide Web with HTTP and HTML and the first computer developed on it and was also the first web server. Later NCSA started developing browsers and where Mosaic was developed and developed another version known as Netscape was developed from this. With these there was a way to interact on the internet as well as for distribution for applications online, this type of client was very disruptive and was also supported by newer browsers with Internet Explorer.
Windows 95 moved to 32 bit computing, though to Windows 2000 which was a very important version of Windows which merged 9X and NT line of operating systems and had TCP/IP networking by default and also with Windows XP, which shipped with Internet Explorer 6 and stuck around for five years.
.NET was released in 2002 which brought VB.NET which was different from VB, but applications were still built the same way with WinForms as it was in 1991. Visual Studio 2005 with .NET 2.0 that manifested the intended goal of .NET at that time with the corporate utilisation of the internet was growing to build web applications, protocols such as SOAP became more relevant and how you communicate with different machines.
Windows Vista took a while to come out but was released in 2006, there were four key pillars which were all dropped but XAML came from WPF which was supposed to be incorporated into Windows Vista itself. There was not much guidance in WPF in .NET 3 and Microsoft were not using it much themselves.
In 2007 the iPhone was released, which previous phones featured keyboards and other elements, and this helped introduce the mobile revolution and the User Interface was changed with touchable screens on phone. Silverlight came out in 2007 which was for media and using JavaScript, the second version added XAML and the third added the most useful features with C# and XAML both supported.
Windows 7 was released after this and also the launch of Windows Azure (now Microsoft Azure) and in 2010 the changes that will happen will be rapid after this point which introduced .NET 4.0 and Microsoft uses WPF in a meaningful way with Visual Studio 2010 used this and Silverlight 4.0 was introduced supporting many players and features. Also in 2010 the first iPad was introduced and the impact of this wasn't clear at the time but table breaks the idea of mobile and desktop - need to build a client that will scale to different device sizes to be able to run anywhere.
Windows later went through revisions to introduce a tablet version where Windows 8 came from then there's Internet Explorer 9 and chrome where running JavaScript everywhere became a powerful force with support on the server with node.JS and even in Windows with WinJS.
If skills are C# and XAML and need to write JavaScript applications what does that mean? But a company was formed called Xamarin which released Mono to allow C# developers to target iOS and Android. Most apps for Windows 8 were C# and XAML not JavaScript, then HTML 5 and CSS 3 were finalised in 2014.
Later came UWP which was supported on Windows 10 when it released in 2015 and on mobile although that later was no longer supported, Windows 10 was being updated every quarter with new features being added but the version of this mattered and this was changing more often than ever.
There are new client technologies coming down the pipeline including .NET running in WebAssembly which is now known as Blazor - which allows C# development within the browser without a plugin. In 2020 Windows 10 is being rearchitected to allow client developers to work with it.
The future for client developers, what is going to disrupt the smartphone? Over the past decade or so the phone is just the same, either bigger or have more features but are basically the same although there are many more of them than ever. Some form of Augmented reality glasses like HoloLens which is essentially a PC on your face.
XAML is a good language for working in 3D space and was part of the Avalon design back in 2006, Augmented Reality glasses are only for Enterprise but are quite expensive but once these get less expensive and into the consumer space this will change when these are good enough, this represents more opportunities for client developers.
WinUI & Project Reunion: The Present and The Future - Ryan Demopoulos
The Windows development platform is undergoing a major transformation and are collaborating with Uno to keep you at the forefront of this change. Why the Windows dev platform cares about Uno? What makes the Windows platform good?
Does the Windows Development experience have Capability with access to sensors plus good user experiences, Productivity to allow people to easily build experiences they want for their users and Reach for the places the developers for that platform want to reach. This is where Uno Platform is more robust that the current development platform supports which is beyond Windows such as Android and Linux. Uno Platform can take the capabilities and experiences to other platforms beyond Windows and want it to succeed and support it.
Started Microsoft in June 2007 and joined the "<Scenic>" team and its mission was to build a public XAML-based UX framework for Windows Developers - what happened to it? The release of Office 2007 which featured a new User Interface paradigm which was the Ribbon and was embraced by the industry with high user satisfaction and there were requests to build a Ribbon which was then done by that original team to build the Windows Ribbon, which is featured in File Explorer, Paint and other applications.
The "<Scenic>" framework was built and used for only one thing in Windows which is the colour picker in Microsoft Paint which is a Full XAML-based framework within the application to drive this component. They also developed Windows Common Controls, DirectUI (Internal framework), WinJS, UWP XAML and WinUI 3.
What is WinUI?
MFC dates to 1992 based in Native C++, WinForms from 2002 and WPF in 2006 based on .NET and UWP XAML from 2012 based on C++ and .NET, plus there has also new additions such as the Fluent Design System. UWP apps run in a Sandbox as opposed to Desktop (Win 32) apps, UWP XAML can't be used by all types of apps as this is UWP only, it's difficult to deliver new features into the mass market as these are tied to the latest version of Windows and don't become ubiquitous until quite a while after release, inconsistent behaviour across operating system versions due to changes caused by updates and compatibility needs to be maintained as much as possible.
WinUI 2 Library was released which introduced decoupled Controls and Styles so are able to backport new features, consistent behaviour across operating system versions, allows for faster updates of library to every few months or even faster as not tied to Windows 10 updates and everything could potentially be decoupled.
WinUI 3 takes all the UWP XAML capabilities for every UX feature from this and the existing WinUI library and can be used by UWP and/or Win32 apps. A year ago, WinUI 2 created a mature fully-featured UX stack that powers a wide range of apps, Office, Xbox and the Windows shell itself with these experienced totalling hundreds of millions of users with billons of hours of use every month. Six months ago, was the beginnings of the third generation of WinUI and only contained a fraction of what the WinUI 2 stack offers though some capabilities added already including the new Chromium-based WebView2.
WinUI 3 today is in a preview phase where more capabilities and stability are being added and fixing issues. Many new features from WinUI 2 bit some are WinUI 3 exclusive. Months from now WinUI 3.0 will be released and many WinUI 2 features will be included, with some WinUI 2 features being added later such as Acrylic Material, a few WinUI 2 features will never be included such as SearchBox and other deprecated controls and WinUI 3 will have exclusive features not available in WinUI 2 and will be the first officially supported release. Beyond 3 will have more released every few months adding more features, capabilities, and fixed plus this will be done in the open on GitHub.
WinUI 3 is not just WinUI 2 lifted, it is a new generation that will have many similarities to WinUI 2 but will also have some differences. WinUI is meant to replace WinUI 2 but that will unfold over time, while this happens WinUI 2 will continue to have new features and investment with the final release of WinUI 3 will be sometime in 2021. WinUI 3 will be prioritising will be improving and stabilising already previewed features, ARM64 support will be added by the final preview, Visual Studio integration will be improved, interoperability with Win2D and WinAppDriver, off-thread input, Windows improvements, drag'n'drop, improvements to DPI support, accessibility, performance, integrating new controls planned for WinUI library 2.5 and React Native integration.
What is project reunion?
Today there are Desktop Apps and Libraries which use Desktop APIs and UWP Apps and Libraries which use UWP APIs, some of these APIs have been ported from one to the other such as XAML Islands and this will continue but the aim is to lift the APIs via a decoupled package so that any Windows app can use any library they want and get access to the things they need to use for both Desktop Apps, Desktop Libraries, UWP Apps and UWP Libraries can use this and WinUI 3 is part of this and there will be in the future Windows Apps and Libraries and the distinction between these is dissolved. This is not a new application model, it is solving the differences between Desktop and UWP and there's just one app model, it needs to work with existing apps where your app can start calling reunion APIs without a re-write, only use the reunion technologies you need so you won't bloat your app's size, you're always getting the latest APIs and capabilities offered by the Windows developer platform plus all of this will be open sourced as a principle.
A bit more detail for Project Reunion include libraries will include File APIs, Security & Identity, Composition & Input APIS, WinRTC, DirectWrite, DirectX graphics and more and will be supported from Windows 10 1809 onwards and Uno Platform could take advantage of many of the features of Project Reunion and taking advantage of the transformation of the Windows Development platform. The future for Project Reunion is platform unification and fundamentals including security container etc, app & platform deployment with MSIX etc, support great UI & user experience with WinUI etc.
The Future of Uno Platform - Jerome Laban and François Tanguay
Creating rich apps that run everywhere puts pressure on developers to do this, but the Uno Platform allows developers to make this process easier for them. There have been a lot of developments to Uno Platform to add many features in the last two years and there is today a 3.0 release of the Uno Platform that supports everything that has been previewed so far.
Developers should be able to control how their applications look where there's support for abstractions for native rendering and there are canvas rendering which is an entirely custom layout but Uno Platform sits in the middle of this with support for native controls and custom looking controls with Control Templating, this allows you to build applications that even Microsoft's own designers thought were only possible in Flutter using the Uno Platform.
Win UI is the best UI framework out there and can support many different size of devices and by bridging that platform can become truly universal but supporting UIKit, AppKit, Views and HTML 5 so get all the native behaviours of those controls as well as use WinUI directly in Windows 10. There is also support for the SKIA backed for the Uno Platform which you can use with WPF host application to show WinUI content using the Uno Platform. It is also possible to use SKIA backend to get the XAML Controls Gallery to run on Windows 7 using SKIA with a WPF shell, although WebAssembly is also supported.
You can target Windows, Browser, iOS, MacOS, Android and now support for Linux using the Uno Platform using a GTK Shell to integrate with the rest of the system to get events using a SKIA Sharp back end with all the WinUI controls supported and you can even run this on a Raspberry PI and use the WinUI API to communicate with the system.
Support for the whole FluentUI design system with the uno-fluentUI-assets to make applications use this on all the platforms Uno Platform supports including the Acrylic Brushes, and you can also design apps using Material Design with support across all platforms.
Gallery example at gallery.platform.uno allows you to see Material Design and Fluent Design along with Light and Dark themes. If you have Windows Subsystem for Linux you can run Uno Platform applications within this, allowing you to test your applications without needing to have a dedicated machine running Linux, this can be supported via an application server to allow the window of the application to be displayed. The Gallery is fully open source to allow you to use it for guidance, how to style controls properly.
Playground example at playground.platform.uno has been updated so the XAML has improved text highlighting to make it easier to write XAML directly in the browser using the Monaco Editor.
IDE support for Visual Studio 2019, Visual Studio for Mac, Visual Studio Code and Rider for various platforms. Hot Reviews allows you to quickly review and iterate code pull requests using GitPod to check out a Pull Request from the browser and see in real-time if a PR is doing what it is supposed to be doing.
Performance benchmarking with DOPES test of platform.uno/dopes-performance and compare the performance of the Uno Platform with others such as Flutter with Uno Platform and SkiaSharp outperforming Flutter and many other platforms on many other platforms. Also been able to reduce the WebAssembly playload to 50% and have good performance compared to .NET AOT.
Roadmap for Uno Platform is following WinUI, more coverage for UI controls that have not yet been ported, Uno Toolkit will be provided for specific platforms, Programming Models like MVVM are supported but other ones will be supported. Other platforms where Uno Platform should be run on, such as Tizen as an experiment it is possible to run Uno Platform examples on a Tizen Watch.
SkiaJumping into Powerful 2D Graphics using SkiaSharp with Uno Platform - Matthew Leibowitz
Skia is a cross-platform 2D graphics library using hardware rendering or software rendering and is written in C++, C and Assembly plus other languages and the library is written and maintained by Google. SkiaSharp is a wrapper around Skia and supports all the features of Skia and basically runs on everything that C# runs on and this library is maintained by Microsoft.
How does it all work? Surface wraps the underlying platform, Canvas translates the drawing commands into operations that the surface understands, and Paint describes what the drawn object will look like. How can you draw on a view? You can install the SkiaSharp.Views.Uno from NuGet to use this with a SKXamlCanvas to Paint on within a View and you can subscribe to events to allow you to paint onto a surface and you can take advantage of this with your applications.
The Unexpected Cross-Platform APIs of Uno Platform - Martin Zikmund
Uno Platform not only gives access to UI APIs but other APIs. You can update the contents of the Title Bar of your application to change the Title of the Window and even the colour using cross-platform APIs. Network information can be obtained such as checking connectivity or observing connectivity so can show if an internet connection is available or not.
You can perform Geolocation to get your GPS coordinates in a cross-platform manner. You can get information from the Accelerometer using the UWP APIs and could provide information when the device is shaken. There is support for Jump List in Windows, Android and iOS and can create a shortcut to a specific part of your application or trigger a process in the application. Vibration is also available in a cross-platform on Windows, Android, iOS and WebAssembly. Speech Recogniser is available across platforms but only in Chrome for WebAssembly but Edge is not yet supported.
MIDI is supported that allows the device to talk to a musical instrument to play the notes on a MIDI device in a cross-platform supported in Windows, Android, iOS, macOS and WebAssembly. There are other sensors and APIs such as Gamepad APIs, Keyboard navigation, Bluetooth and more are being added to Uno Platform.
Developing for macOS with Uno Platform - Andres Pineda
macOS support was announced in May 2020 to keep the aim of running Uno Platform on as many platforms as possible and allow developers to create new applications to target macOS. You can use Visual Studio for Mac - you can create projects using the command line using a template to create solution with the different heads, but you can also use Visual Studio Code on macOS as well.
What about existing applications? You can include macOS support onto existing applications such as Uno Calculator, which was ported from the Windows Calculator or any of your existing applications that are or could take advantage of the Uno Platform. With an existing Uno Platform project, you can add support for macOS by adding the necessary project head by creating a new Uno Platform solution and then copy the macOS project from this into the original solution. You can also take advantage of the xmlsn:macos namespace to override any styles for that platform, you can also use pre-compiler directives to additionally support macOS with #if__MACOS__. There's also a few considerations anything that uses .NET standard should work but if using a UI library this will need support for macOS, to use the menus you will need to add extra code and there are also a few controls that aren't supported for macOS but these may be supported in the future based on feedback from the community.
Developing for Dual Screen with Uno Platform - Mackenzie Whalen
Surface Duo is a new device running Android, with a 360-degree hinge and has dual 5.6 inch screens and you can interact with this in different ways such as Extended Canvas which gives the most space by utilising both screens. Master Detail allows a list to be on one side and the other side would be the details of that list item. The Two-Page view is a book like view for reading and note taking applications. The Dual View is good for compare and contrast style experiences. Companion Pane can allow hidden features to be exposed in applications such as photo editing apps and gaming applications, but also need to make sure applications are aware of the hinge! You can also get information about the screen such as details about the hinge values, the screen rectangles, if it is in dual-screen mode and the current rotation.
To get started with dual-screen development with the Uno Platform you will need Visual Studio 2019 and the Surface Duo emulator with the Android Studio. You can use the TwoPaneView to define a dual-screen view for an application where each pane may contain a single child layout control. You can also get information about the device using a DualScreenInfo Class to return the states of the screens and how they are being used and you will need to install the Uno.UI.DualScreen NuGet package in the Android project.
Powerful Data Visualization with Simple XAML on Uno Platform - Billy Hollis
Take the most powerful mark-up on the market of XAML on multiple platforms using the Uno Platform but often the power of XAML is underused. You can support features such as layering to have multiple items overlapping plus there is powerful binding for things such as opacity and you can also support data templating to visualise data and expose data in innovative ways.
You can control the way data is displayed with the colours of the data and the opacity of the values being data bound and allows separate data sets to be overlapped to easily compare data in a visual manner and XAML allows you to do this and you can create sophisticated interactive interfaces with pure XAML and data binding with little code needed and shows the power of XAML.
From PowerShell Script to Multi-Platform Uno Platform Applications - Jeremy Sinclair
How to convert an idea on how to track timings from a PowerShell script to a multi-platform Uno Platform application. PowerShell is a scripting and task automation framework build on .NET and is now cross-platform and has cmd-lets which allow lots of code to be called easily and simply and is quite powerful.
Their PowerShell script communicates with Azure DevOps via a VSTeam module where the user enters their work item Id and this starts a timer when the work is completed the timer is stopped and this will populate the information for that completed work field.
If they wanted to use this on their phone or macOS as a native application and gave them the idea to use the Uno Platform to develop a consistent UI using UWP XAML as a Windows 10 application and target it to everything and don't have to deal with anything separate which is really wonderful. They got inspiration from the Windows 10 stop-watch application. Then they needed to set up their development environment and create their Uno Platform Solution in just a few clicks with the project types they needed.
Then by following the Windows 10 guidelines, paste in examples and code to create the application layout they needed where they can enter the work item number, see the title of the work item they are tracking and have a large time box to display the timer and then just a few other controls to create the layout. The hardest part was dealing with the Azure DevOps API they used nSwag Studio which creates classes based on a Swagger UI description of the API to create the class they needed to interact with the API and they then ran the application and it just works and not only that works in UWP on Windows 10 and WebAssembly in the browser. Plus, it also runs on macOS which was one of the reasons they wanted to do this so they could have the application run there as well.
Experience was that this was their first Uno Platform application and it had no dependencies on any platform specific APIs, they were able to produce the user interface with a WinUI control with XAML and the issues they found on macOS could be resolved by contributing to the Uno Platform to resolve these issues.
Windows Community Toolkit ❤ Microsoft Graph ❤ Uno Platform - Michael Hawker
They are known as a the XAML Llama and they are a senior software engineer at Microsoft, drive partner engagement and work on the Windows Community Toolkit.
Windows Community Toolkit which is a series of controls, extensions and helpers for Windows development based on UWP and .NET Standard, is part of the .NET Foundation and has had millions of downloads and thousands of commits with a sample application available to download from the Microsoft Store.
Microsoft Graph is the Microsoft 365 data that describes information from Microsoft 365, it is your organisation and user data and it does not cross boundaries between organisations and requires consent to access it.
Windows Community Toolkit supports Microsoft Graph Components with LoginButton, PersonView and PeoplePicker with support for GraphPresenter, which is a new control which allows you to explore different facets of the Microsoft Graph and find out more at aka.ms/wgt.
GraphPresenter control allows you to interact with the Graph directly such as email messages from Microsoft 365 and using a DataTemplate in XAML easily create some visuals to display in the user interface with some simple XAML templating.
Windows Community Toolkit and Microsoft Graph Components are supported on Uno Platform and you can display Calendar, Mail, OneDrive, Tasks, Teams and much more which you can also explore at aka.ms/graph/explorer to see what data could be represented.
MVVM Toolkit is a new .NET Standard MVVM Library which is Microsoft.Toolkit.Mvvm and is simple to pickup and use and is a modular part of the Windows Community Toolkit and you can use whatever pieces of it that you need and is designed to be a Reference Implementation.
MVVM Toolkit Library is inspired by MVVMLight by Laurent Bugnion and was started in April 2020 from the ground-up to a modern .NET Standard implementation and is highly performant to reduce memory and CPU cycles and is vastly more performant that MVVMLight. MVVMLight and Calburn.Micro no longer intend to be maintained and other frameworks require specific requirements when structuring your application and this framework is designed for advancements in .NET and Application Development.
MVVM Tookit supports ObservableObject, RelayCommand plus Others, Messenger with Pub/Sub and Inversion of Control support with IServiceProvider. There is a sample application with the MVVM Toolkit Sample App with interactive examples and details such as how to use asynchronous commands and more. There is a preview available today at aka.ms/mvmtoolkit and will ship as part of the 7.0 release of the Windows Community Toolkit in late 2020. The 8.0 release of the Windows Community Toolkit will take the WinUI 3 dependency in 2021.
Embedding JavaScript components in Uno Platform Web Applications - Carl De Billy
Sometimes you may want to reuse JavaScript/HTML components. Uno-WebAssembly internals are the Web Browser, HTML/CSS, JavaScript and WebAssembly with full access to the HTML 5 APIs that you can use from your applications.
Calculator is using the HTML 5 DOM to render in the WebBrowser, Managed Code from C# is being converted to a HTML DOM element to render it, from Managed Code you can control the rendering with extension methods to change any CSS or what DOM elements are used to render the output.
You can create a custom configuration using CSS and JS and you can instantiate native JavaScript controls and can use Properties and use Events and can change the state of the DOM or execute some JavaScript.
To use components in your application you will need to inject any necessary JavaScript and CSS by adding a new file in the WasmScripts and WasmCSS folders and place some code to load the resources needed and then include this file as an embedded resource. You can create a custom UI element that will be rendered using the JavaScript that has been added to the project and you can instantiate the control when needed for example the FlatPicker Date Picker control with a Textbox.
You can also handle events from a JavaScript component by registering events that your application will respond to in both C# and in JavaScript to raise the handlers that will be responded to by the application where needed, any other assets need to be set as content and CSS and JS will be embedded resources.