Xamarin Forms EnumBindablePicker

,

One of the controls missing from Xamarin Forms is a “BindablePicker” that allows you to dynamically bind an ItemsSource and SelectedItem from your view model. Fortunately, the Xamarin forums provide a solution to this problem found here:

https://forums.xamarin.com/discussion/30801/xamarin-forms-bindable-picker

The original implementation of this BindablePicker worked great as long as you had a list of strings as your ItemSource. But what if you have a list of objects and want to set a DisplayProperty that is shown to the user? Xamarin forums to the rescue again… scrolling down in that same post, there is a solution that allows you to do just that.

https://forums.xamarin.com/discussion/comment/110480/#Comment_110480

Simple Enums

Recently, however, I came across the need to have a bindable picker that would allow the user to select a value from an enum. Not finding just what I wanted, I used the BindablePicker in the Xamarin forums as a base, and built an EnumBindablePicker.

This class uses C# generics to automatically generate the list of available items in the picker based on the generic enum type. The SelectedItem getter and OnSelectedIndexChanged use Enum.Parse to convert the string value back to a properly typed enum value.

In your XAML, you must specify the enum type as a parameter to the generic class like this:

I also added a Label below the EnumBindablePicker to verify that the user selected value is updating properly in the associated view model.

EnumBindablePicker - Sample Page

Enums with user friendly descriptions

So this works great if your enum names are user friendly. Oftentimes, we want to display one value to the user, but the internal enum value is something different. One way to accomplish this is to use an attribute on the enum. In my project, using a PCL, System.ComponentModel.DescriptionAttribute is not available, but I was able to use System.ComponentModel.DataAnnotations.DisplayAttribute.

In order to support this, the EnumBindablePicker had to be updated to look for this DisplayAttribute:

This now displays the proper DisplayAttribute information to the user in the picker control:

EnumBindablePick - Sample Page 2

Localized Enum Strings

Again, this is great if you only have one language to support. But what about an app that supports multiple languages?

There are several ways to solve the problem of retrieving the proper localized string. For purposes of this sample, I chose to put my localized strings in a resx file and use a convention {EnumType}_{EnumValue} to find the correct value.

EnumBindablePick - Enums

With a slight modification to the EnumBindablePicker, we can support this functionality as well as looking for the DisplayAttribute.

EnumBindablePick - Sample Page 3

Now we have a Bindable Picker control that works natively with enums and can display a user-friendly description based on attributes or strings in a resource file.

Sample code can be found here: https://github.com/creasewp/EnumBindablePickerSample

2 responses to “Xamarin Forms EnumBindablePicker

  1. One bug: On Android at least, if the initial value of the enum is 0 (which will often be the case) the Title of the picker is not set until a value is picked. I added “Title = Items[0].ToString()” as the last line of the initialiser.

  2. Thanks for the write up. I had been searching for an example on how to obtain the Display Description using System.ComponentModel.DataAnnotations.DisplayAttribute. This explained a lot since we are using Xamarin Forms.

Leave a Reply

Your email address will not be published. Required fields are marked *