Update – 2020-03-05

I updated the samples and snippets to include some reader feedback:

1. Accounted for Master-Detail navigation in App.PromptToConfirmExit
2. Provided a toast + back button confirmation alternative sample
3. Updated sample: allow toggling between Master-Detail and Tabbed navigation; allow toggling between dialog and toast confirmation styles.

Overview

Ever hit the navigation bar back button when using an Android app and have it fully exit the app and drop you back on your home screen? I think all Android users have encountered this a few times. It is a frustrating and counter-productive experience. Let’s make sure your app has better UX by using a simple confirmation dialog!

Good news, this is easy to implement and should only take you a few minutes to code and test.

Step 1

Create a property to check if there are pages on your navigation stack. Here’s my implementation:

Step 2

Override the OnBackPressed method in your app’s MainActivity to intercept back navigation. Here’s a sample:

We’re Done!

Wasn’t that easy! Let me know how this works out for your app. Check out my full Xamarin Forms Android Exit Confirmation sample on Github.

Inspired by Steven Thewissen’s excellent MSAL article, I thought I would share what I have learned about MSAL over the 3+ years I have worked with MSAL and Xamarin. If you’re just getting started, be sure to read Steven’s article, he does a great job covering how to use the tools. This article is a collection of my personal learnings and experience using MSAL in my apps.

Without further ado, here are 6 tips/tricks/facts about MSAL, AAD B2C and Xamarin:

1. TIP: Careful with package upgrades!
   • I cannot emphasize how important this is, check out the older packages in nuget: https://www.nuget.org/packages/Microsoft.Identity.Client/ the library was in preview for nearly 3 years and I went through the pain of dealing with api changes and behaviour changes. Read the change log carefully!
2. FACT: You cannot change the Android webview title from “Sign In” without a custom MSAL build.
   • Source: https://github.com/AzureAD/microsoft-authentication-library-for-dotnet/blob/b929e1fc87c4273e73a91701a7984a194e0d4d45/src/client/Microsoft.Identity.Client/Platforms/Android/EmbeddedWebview/AuthenticationAgentActivity.cs#L17
3. TRICK: Use a JWT parser to check your token expiry, if the token is expired, you can pro-actively refresh it avoiding a round trip.
   • System.IdentityModel.Tokens.Jwt.JwtSecurityTokenHander.ReadJwtToken(string token)
   • NOTE: do not parse the token for any other purpose https://github.com/AzureAD/microsoft-authentication-library-for-dotnet/wiki/do-not#do-not
4. TIP: Android devices with older system browsers may have issues loading the sign in webview.
   • See compatibility chart here: https://github.com/AzureAD/microsoft-authentication-library-for-dotnet/wiki/Android-system-browser
5. TRICK: Careful with exceptions
   • MSAL throws an exception when canceling the sign-on, you will likely want to ignore this.
   • There are other specific exceptions you will want to gracefully handle: https://docs.microsoft.com/en-us/azure/active-directory/develop/msal-handling-exceptions?tabs=dotnet
6. TIP: You don’t need your own code to save tokens to secure storage, MSAL does this for you!
   • iOS source: https://github.com/AzureAD/microsoft-authentication-library-for-dotnet/blob/512d74e972bd4bbee02d7653aa4f2205c860c8cb/src/client/Microsoft.Identity.Client/Platforms/iOS/iOSTokenCacheAccessor.cs
   • Android source: https://github.com/AzureAD/microsoft-authentication-library-for-dotnet/blob/512d74e972bd4bbee02d7653aa4f2205c860c8cb/src/client/Microsoft.Identity.Client/Platforms/Android/AndroidTokenCacheAccessor.cs

My Implementation

This is roughly what I have used in my last few projects, not exact, I generally use dependency injection and a few other bits. For simplicity’s sake this is a self-contained sample implementation. I would advise using Lazy<T> for IPublicClientApplication at the very least in a real life application.

Note: The Secrets class is generated by Dan Siegel’s excellent mobile build tools.

Your thoughts?

Please let me know your thoughts, tweet at me @dylbot9000. Happy to hear good/bad/ugly/criticisms/suggestions.

TLDR: The Experimental Mobile Blazor Bindings can result in much less XAML and C#, 64% less in my experiment, but the tech isn’t quite ready for prime time.

Update – 2020-02-24

I migrated my sample to the Mobile Blazor Bindings February Preview 2 Update. It only took a few minutes and fixed the issues I had previously documented and reported!

What are Mobile Blazor Bindings?

First off, Blazor is a new technology within ASP.NET Core which allows rich web applications to be written with C# instead of javascript (for the mostpart). My intent here isn’t to explain Blazor, if you wish to learn more, check out the resources listed at the end of this article.

Blazor uses the ASP.NET Razor template engine to deliver html content to browser clients. Html is markup, Xaml is markup…why not use the Razor engine to build Xamarin?

That’s the question Eilon Lipton answered with Mobile Blazor Bindings. In essence, this approach uses Razor syntax with Xamarin Forms Xaml to create mobile apps.

You may find yourself wondering why you should care…as I did when this was announced. I’m not a massive fan of Razor pages and lately I’m finding myself frustrated with the huge amount of Xaml code required to do some relatively simple things in Xamarin Forms. The Mobile Blazor Bindings approach doesn’t really solve the Razor pages issue, but it certainly helps simplify Xaml and at the same time, it also helps simplify your C# by using a binding which doesn’t rely on INotifyPropertyChanged.

Getting Started with Mobile Blazor Bindings

1. Install Visual Studio 2019 or Visual Studio for Mac and install Xamarin
2. Download and install .NET Core 3.0 or 3.1 SDK
3. Install the Mobile Blazor Bindings project templates: dotnet new -i Microsoft.MobileBlazorBindings.Templates::0.1.173-beta
4. Create a new project: dotnet new mobileblazorbindings -o FirstMobileBlazorBindingsApp
5. This will create a FirstMobileBlazorBindingsApp folder containing a solution and 3 projects:
   1. FirstMobileBlazorBindingsApp – .NET Standard 2.0 library containing Razor templates and cross platform code
   2. FirstMobileBlazorBindingsApp.Android – Xamarin.Android head project.
   3. FirstMobileBlazorBindingsApp.iOS – Xamarin.iOS head project.
6. Open the solution in Visual Studio
7. Run the Android project

Note: I had no luck with iOS, I would stick to Android for now.

Check out the official documentation for Mobile Blazor Bindings and the Github repo for Mobile Blazor Bindings. Be sure to log issues with a sample solution if you run across bugs.

Porting a Xamarin Forms MVVM screen

Let’s look at an example. Since everyone’s likely here for Xamarin, we’ll start with an options selection screen I built using Xamarin Forms and MVVM.

Xamarin Forms MVVM (188 lines)

Blazor Mobile Bindings (68 lines)

120 fewer lines for the Blazor Mobile Bindings approach. Wow. I am sold.

Check out my two solutions on Github.

Conclusion

I was not excited about this approach until I actually saw the results. There is huge upside and promise, I’m looking forward to seeing where this goes. No having to worry about INotifyPropertyChanged, no commanding, far more flexibility in Xaml with the tried and true Razor engine.

On the other side, I ran into 3 relatively major issues.

1. OnClick methods would only fire once
2. An IsVisible flag set by a variable wasn’t working at all
3. iOS wouldn’t work (I didn’t look very close at this).

Note: these issues are all fixed in the Preview 2 update!

There is also no hot reload support at this point, which you miss very fast after getting used to it.

Great job by Eilon Lipton and everyone else from the Xamarin and Blazor teams who brought this experiment to life!