XAML Markup Extensions Cheat Sheet

A quick reference guide to common markup extensions used in Xamarin Forms XAML. Xamarin’s intellisense is not as powerful as WPF’s, nor are the markup extensions of XAML the same between WPF or Xamarin Forms and if you come from a web background, XAML may seem rather confusing at first. Here are some of the more common or desired markup extensions you can do in Xamarin Forms XAML. This article is for developers who have a basic understanding of binding. If you don’t have a read through Data Binding Basics from Xamarin first.

Markup Extensions

In keeping it as basic as possible, markup extensions are what occurs between the curly brackets. {  .. extension  …    } and includes the extension name and some parameters or values to help it perform its function. For example

  • Binding
  • StaticResource
  • TemplateBinding

These are markup extensions and what goes after them are parameters these functions use to complete their purpose. E.g. Binding takes a Property Name to bind to.

Binding to Data Source

Starting out with the basics, here is where you can bind a BindableProperty to the BindingContext. The BindingContext is a property on the Page (or any BindableObject) that you assign an object to. Anything you try to Bind in the XAML will try to match to a property in this object. If no property exists, Xamarin Forms uses a default value to pass back to the page.

Binding Mode

By default the BindingMode of any element is OneWay, meaning that it will listen to updates from the BindingContext, but won’t send them back if changed in the View. Many controls such as the Entry have the default changed to TwoWay to ensure anything typed in the Entry goes back to the BindingContext. However if you have a control that has a BindingMode you don’t want, you can override it by specifying the BindingMode in XAML.

Making a label TwoWay is not really useful but just there to illustrate the point.

Multiple Source Binding

A tricky situation is normally when you are in a repeating control, such as a ListView or CarouselView. These controls take a DataTemplate and then repeat that template for each item in the ItemsSource. However when you use Binding you are binding to the particular item in the ItemsSource and not the main page, hence if you want to the main BindingContext you will need to specify a Source property.

As shown below, the OpenUrlCommand is in the Page’s BindingContext but the Url value is in the list item of MyData. You specify the source of the OpenUrlCommand to the instance of the page, then reference it by BindingContext.OpenUrlCommand.

Converters

Sometimes you need to convert a type to another type before binding to the property. You can do this with TypeConverters. The most common type is a NotConverter or an InverseConverter. Instead of adding more properties to your model you can just flip values in XAML. Sometimes a converter is used for more complex conversions.

Formatting

If you want to format a string just for the View, you shouldn’t go creating a new property or format it in the model, since this is only for display purposes. For this purpose we can use a formatter in the binding to display the value however you want.

Template Binding

Template Binding has only come about in 2.1.0+ with the introduction of Control Templates. This binding is just as simple as the regular binding, however you are binding to the BindingContext of the control it is applied to. You only need to reference BindingContext.PropertyName if the BindingContext of the control is an object with a BindingContext, otherwise you can reference the property directly.

Static Resource

Sometimes you want to reference a static resource rather than the BindingContext. StaticResources are defined in the ResourceDictionary and are available at compile time.

If you want to reference a static object and not a static resource you do as below. Remember a resource is defined in a ResourceDictionary a static object is just a static object in your code.

    // Define in your Page Attributes
    xmlns:common="clr-namespace:YourNamespace;assembly=YourActualAssemblyName"

    // Use where ever needed in your page
    BindingContext="{x:Static common:MyStaticObject}"

Dynamic Resource

Dynamic Resources are the same as static resources with one difference, they can be added / removed at runtime. If you resource is being loaded into the ResourceDictionary at runtime, then you will need to use the DynamicResource reference.


XAMARIN.FORMS MONTHLY NEWSLETTER

JOIN 1,000+ SUBSCRIBERS

  1. Don't miss out on updates
  2. The latest info from this site, Xamarin and the community
  3. Unsubscribe at any time*

* We use MailChimp, with double opt-in, and instant unsubscribe

Microsoft MVP | Xamarin MVP | Xamarin Certified Developer | Exrin MVVM Framework | Xamarin Forms Developer | Melbourne, Australia

Related Posts

Leave A Comment?