Xamarin: FontAwesome Image

download.pngNow that Xamarin supports a FontImageSource as a source for an Image, it’s time to create a simple custom Image control that uses it.



Step 1: In your App.xaml add a reference to the FontAwsome font you’d like after you have added it to your iOS and Android project:

<OnPlatform x:Key="FontAwesomeLightFontFamily" x:TypeArguments="x:String"
            Android="fa-light-300.ttf#Font Awesome 5 Pro"

Step 2: Go to Andre’s site and generate a Font Reference for that font. It will look like this:

static class FontAwesomeLight
    public const string GlassMartini = "\uf000";
    public const string Music = "\uf001";
    public const string Search = "\uf002";

Step 3: Create this control that is based on an Image:

public class FontAwesomeImage : Image
    public string FontImageGlyph
        get { return (stringGetValue(FontImageGlyphProperty); }
        set { SetValue(FontImageGlyphPropertyvalue); }
    public static readonly BindableProperty FontImageGlyphProperty =
        BindableProperty.Create(nameof(FontImageGlyph), typeof(string), typeof(FontAwesomeImage),
            propertyChanged: (bindableoldValuenewValue) => ((FontAwesomeImagebindable).Populate());
    public double FontImageSize
        get { return (doubleGetValue(FontImageSizeProperty); }
        set { SetValue(FontImageSizePropertyvalue); }
    public static readonly BindableProperty FontImageSizeProperty =
        BindableProperty.Create(nameof(FontImageSize), typeof(double), typeof(FontAwesomeImage),
            propertyChanged: (bindableoldValuenewValue) => ((FontAwesomeImagebindable).Populate());
    public Color FontImageColor
        get { return (ColorGetValue(FontImageColorProperty); }
        set { SetValue(FontImageColorPropertyvalue); }
    public static readonly BindableProperty FontImageColorProperty =
        BindableProperty.Create(nameof(FontImageColor), typeof(Color), typeof(FontAwesomeImage),
            propertyChanged: (bindableoldValuenewValue) => ((FontAwesomeImagebindable).Populate());
    void Populate()
        this.Source = new FontImageSource()
            FontFamily = "FontAwesomeLightFontFamily",
            Color = FontImageColor,
            Glyph = FontImageGlyph,
            Size = FontImageSize

Step 4: To use it, just add this markup to your XAML page.

                FontImageGlyph="{x:Static fonts:FontAwesomeLight.Bookmark}"



Speeding up Android Emulator using Windows Hyper-V – Tricks to make it work

image01.pngThe Android emulator is so very slow compared to the Apple iOS Simulator. But with recent changes in, the Android emulator is now a bit faster, though not as fast as Apple still.

Here’s all the lessons I learned with getting Android’s Emulator to run as fast as possible.

I assume you have installed Visual Studio 2019

Step 1: Enable Hyper-V  in your Bios

Look for “VT-X” or other “Virtualization” related terms. Often under “Security”:


Step 2: Install Hyper-V on your Windows 10 PC

Search for “Add/Remove Windows Features” in the Start Menu. Add Hyper-V


Step 3: Open the Android Device Manger in Visual Studio and “Factory Reset” your devices

2019-04-09 08_43_08-Android Device Manager.png

GOTCHA! Step 4: Edit your devices and make sure that the hw.gpu.mode is set to host. This will ensure that your PC’s GPU will do the heavy lifting.

2019-04-09 08_43_47-Hyper_81.png


Make sure that your machine has Hyper V successfully installed. To do so, open a CMD prompt and type systeminfo. You should see this if all is well:




Debugging Xamarin Forms 3.6 and up

download.jpgWhen your app fails, is it your app, or is there a bug in Xamarin Forms? How to know? In this post I’ll show you how to run Xamarin Forms in debug mode so that exceptions are caught and displayed deep inside Xamarin Forms.

In my previous post I showed you how to debug Xamarin Forms 3.5 and below. 3.6 and above are very different (and easier).

Let’s get to it!

GOTCHA: Make sure you have all the UWP components from the Visual Studio installer or you’ll get errors building. When in doubt, just add it all.

2019-04-02 09_08_19-Window.png

GOTCHA: Delete any Xamarin Forms github repro you have.

Step 1: Create a folder to contain the GitHub source code. I use e:\GitHub

Step 2: Open the GitHub Windows Client and clone  Xamarin Forms Git Hub Repro . Switch to version 3.6

2019-04-02 09_06_16-Window.png

The code is now in e:\GitHub\Xamarin Forms

Step 3: With notepad, create this batch file  e:\GitHub\Build Xamarin NuGet.bat

cd E:\GitHub\Xamarin.Forms

PowerShell.exe -Command “& ‘Build XF By Batch file.ps1′”

Step 4: With notepad, create this ps1 file e:\GitHub\Build XF By Batch file.ps1

Set-ExecutionPolicy Unrestricted -Scope CurrentUser -Force

cd E:\GitHub\Xamarin.Forms
./Build.ps1 -Target NugetPack

Step 5: Double click Build Xamarin NuGet.bat to build

GOTCHA: It can take 6-10 minutes to build. Really. Coffee time….

2019-04-02 09_12_32-Window.png

Now we have the NuGet packages for Xamarin Forms on our machine.

In Visual Studio, add this Nuget repository , then upgrade your projects to the new Xamarin Forms build (Prerelease Nuget)

GOTCHA: Don’t forget to check the “Include Prerelease” checkbox.

2019-04-02 09_15_42-Window.png

GOTCHA: Update project by project, not the whole solution at once. I often get NuGet errors on the solution.

GOTCHA: Delete all bin/obj folder, restart Visual Studio then rebuild.

All done! Now you can debug into Xamarin Forms.




Using Azure’s AI for Search with AngularJS and ASP.Net MVC

Azure’s AI tools are easy to use and can extend the functionality of your app or web site with a few steps. I’m going to show you how to set up Azure Search in this tutorial.

In Part one we will add the accounts and tools needed to search

In Part two we will build the web site to leverage Azure’s Search AI

First, login to Azure at https://Portal.Azure.com and add a new Storage Account:

2019-03-11 12_38_24-Home - Microsoft Azure.png

Once you’ve filled in the simple form, click Blobs to add a new Blob which will store your documents:

2019-03-11 12_39_50-bahaisearchstorage - Microsoft Azure.png

Now that you’ve got a blob you can add documents and folders via the SDK in your app, or with Microsoft Azure Storage Explorer. We’ll use the latter:


When you open Storage Explorer  up, navigate to your account and open your Storage Account and Blob and drag in some files. Word, PDF, Excel, Text etc:

2019-03-11 12_43_26-Microsoft Azure Storage Explorer.png

Now we’ll add some Search tools to our Azure account, click the Search Services and add a new service. Make sure the data center you choose here matches your data center used for the Blob storage.

2019-03-11 12_44_45-bahaisearch - Microsoft Azure.png

Once you’ve added an Index to your Search, you are ready to try out the search. Tap the Search Explorer button in your Search Service:

2019-03-11 12_46_11-bahaisearch - Microsoft Azure.png

A simple Azure UI will appear letting you search your documents in Test.

2019-03-11 12_48_07-Search explorer - Microsoft Azure.png

In the next article I’ll show you how to search using the SDK in your own apps.

Use that I created an AngularJS based search tool in a few hours. You can try it here: https://bahaitestai.azurewebsites.net/aisearch


2019-03-11 12_49_46-Baha'i Search.png







Xamarin.Forms ListView Scrolling Up/Down Detection

download.pngI have a FAB on my page and wanted it to fade when the ListView was scrolled down, and fade back when scrolling up. Here’s an easy way to do it.

I assume you have a image or button on your form called fabCreateButton.

Wire up the OnDisappearing event in your ListView to this in your code behind:

private int _lastItemAppearedIdx = 0;
private bool _lastDirectionWasUp = false;
private void ListView_OnItemDisappearing(object sender, ItemVisibilityEventArgs e)
    if (e.Item is AddressBookItem item)
        var currentIdx = Model.Items.IndexOf(item);
        if (currentIdx > _lastItemAppearedIdx)
            if (_lastDirectionWasUp == falsefabCreateButton.FadeTo(.3, 250, Easing.Linear);
            _lastDirectionWasUp = true;
            if (_lastDirectionWasUp == truefabCreateButton.FadeTo(1, 250, Easing.Linear);
            _lastDirectionWasUp = false;
        _lastItemAppearedIdx = currentIdx;



Debugging Xamarin.Forms from GitHub


This is for version 3.4.0 and under, see below for 3.5.0 changes

Sometimes strange things happen in your app, it could be that a problem deep in Xamarin.Forms is the cause. Here’s a very condensed, simple way to have your App point to the Xamarin.Forms code so that errors can be caught and causes more easily determined.

Note: Breaking changes in 3.5.0, see below

This is heavily based on the guide at Xamarin, but simplified and condensed into a path I found that works.

For Windows – Visual Studio 2017/2019

Get the Code:

Install the GitHub Desktop application.

GOTCHA: If you’ve tried before delete any repo and start fresh.

Run it and choose the opportunity to Clone a repository from a Url. Enter the URL https://github.com/xamarin/Xamarin.Forms . I put my repos into E:\GitHub

2019-02-06 14_04_12-GitHub Desktop.png

Build the Code in Visual Studio

Turn off Resharper if you have it, it’ll slow you down really badly. You can re-enable it later.

Go to your repo, in my case E:\GitHub and open Xamarin.Forms.sln

Switch to the version branch you want to debug, like 3.4.0

When it loads in Visual Studio, Switch to Any CPU, then Build the Solution. This can take 5 minutes!!  You will see errors probably. You should be able to ignore them.

GOTCHA!! It must be Any CPU

2019-02-06 14_05_50-Maximizer - Microsoft Visual Studio  (Administrator).png

Close Visual Studio

Build the NuGet

Add a System Environment variable to where you have NuGet.exe. I put mine in e:\GitHub\

GOTCHA!! Add a \ to the end of the folder

2019-02-06 14_09_51-New System Variable.png

Open a Command Prompt and go to the main folder in the repo. In my case E:\GitHub\Xamarin.Forms

Run the batch file .create-nuget.bat all

GOTCHA – Did you forget the all parameter?

2019-02-06 14_12_20-Command Prompt.png

When done, there will be a new file named something like Xamarin.Forms.9.9.0.nupkg in the .nuspec folder

2019-02-06 14_14_10-.nuspec.png

Copy this file to a new Folder which will serve as your NuGet folder. I use E:\NuGetServer

2019-02-06 14_15_12-NuGetServer.png

Open your app, then add a new Nuget server pointing to that folder.

2019-02-06 14_15_53-Options.png

Now update your Xamarin Forms Package to point to your NuGet folder. Notice the version is 9.9.0.

2019-02-06 14_17_03-Maximizer - Microsoft Visual Studio  (Administrator).png

GOTCHA!! Manually delete all bin and obj folders and restart Visual Studio. I’ve had strange things happen when I switch Xamarin Forms versions if I don’t.

Run your app!

Now when there is an error, Visual Studio will step into the Xamarin.Forms code

Changes for version 3.5.0 onwards

Switching to Cake and powershell

Go to the Xamarin.Forms folder in Powershell, then allow for all scripts to be run with this:
Set-ExecutionPolicy Unrestricted -Scope CurrentUser -Force

Then you can run the Build PowerShell:
./Build.ps1 -Target NugetPack 


The Growth of #Xamarin – An independent metric

download.pngI’ve been using #Xamarin for iPhone and Android app since it was pronounced “Monotouch”. I may have been one of the first commercial users. It’s a great platform, but is it growing? Here’s an interesting and independent metric.

My Xamarin blog’s visitors trend is below. I don’t advertise, I just write articles on things I find interesting. Then let Google and the internet decide if it’s of value.

Note: I wrote this at the start of Feb, 2019 hence the low last value.

Screen Shot 2019-02-03 at 12.07.36 PM.png