A quick explainer: recent NuGet packages

Recently I’ve been pushing out a few NuGet packages with components that I use in my every day Xamarin work. This blog post is meant to give you a little overview of these packages and how they can help you in your daily mobile development flow.

PancakeView

Modern design tends to work a lot with borders, rounded corners, gradients, and shadows. Within Xamarin.Forms there’s not really a control available that supplies all of these things and lets you combine them to your heart’s content. The Frame control comes close but wasn’t quite cutting it for me. That’s why I created the PancakeView!

The sample app for PancakeView.

And why is it called a PancakeView you ask? Well, pancakes are also round, have shadows and have a glorious gradient color. What better fit can you think of?

The project can be found on Github and NuGet. After installing the NuGet you need to tell your XAML page where it can find the PancakeView, which is done by adding the following attribute to the ContentPage:

Next up, just smack a PancakeView onto that page and you’re all set, simple as baking real pancakes!

DebugRainbows

This package aims to solve a problem a lot of UI tinkerers like myself face; how is that element positioned? Currently, the easiest way to figure out how a UI element is positioned in Xamarin.Forms is by setting its background color. Luckily, DebugRainbows does exactly that by the flip of a switch! After flipping the switch, the package will assign a random background color to each UI element, allowing you to get a better idea of how the layout is composed.

A sample app with DebugRainbows disabled and enabled.

It’s also available on Github and NuGet and pretty easy to use. Install the package and add the following attached property and namespace declaration to your ContentPage:

EasyLoading

At some point in your app’s lifetime, you will need to load data from an external source. This is usually accompanied by implementing some sort of visual loading mechanism to inform the user of the fact that he/she needs to wait. In Xamarin.Forms there’s an ActivityIndicator but these days new loading paradigms are the new norm. By adding things like a skeleton loader or a full-screen loading overlay with animations we can make our app a less static/boring experience.

This package introduces a LoadingLayout bindable property where we can define a loading template for every layout on a page. By binding to a boolean indicating if we’re loading we can create a completely custom loading experience. All of the relevant code is contained within the elements it logically applies to.

This package is on Github and NuGet. After installing it you can add a loading template to any layout element.

If you want to create a loader for a list of items you can use the RepeatCount bindable property to repeat the template multiple times. This allows you to create e.g. a skeleton loader with multiple skeleton items being repeated vertically.

Pull requests welcome!

If any of these packages has sparked your interest or if you have ideas of your own I welcome PRs! I’m sure they can be extended with additional awesome features I haven’t thought of yet. Go ahead, check out their Githubs and raise an issue or PR!

Related articles

August 25, 2019 19:40 in

Breaking the Pancake mould

You may have used PancakeView in your Xamarin.Forms adventures in the past. Ever dreamed of breaking out of that rectangular/circular mould? Well, now you can with the latest PancakeView update!

November 30, 2018 16:45 in

Xamarin.Forms in Space!

As you may have seen from reading other content on this blog I dabble in the world of cryptocurrency. To help me on my position sizing I figured I’d create a little calculator app. Obviously, if you know me, that has to look sexy. So I decided to go on a journey into space using […]

August 25, 2017 12:02 in

Creating a good-looking Xamarin.Forms UI: Twitter

I love tinkering with UI. There, I said it. Even though I’m a developer first and foremost I cannot help the fact that any mobile app UI I create has to look fancy. However most of my development work takes place in Xamarin.Forms. Can those two worlds be combined?