Xamarin Forms & WPF Comparison

Xamarin Forms borrows much of it’s technologies from WPF and Silverlight. The UI can be described using XAML in much the same way that we do in WPF. This provides all the binding support that enables us to use MVVM to separate the application logic from the UI. As a WPF developer this is great news. I can transfer all my skills across to Xamarin Forms and write cross-platform natively backed UI’s. However, it’s not a direct transfer. There are differences, in much the same way that there were differences between Silverlight and WPF. But these go much deeper.

What’s not supported?

Xamarin Forms feels very much like the cut down version that Silverlight was. This makes sense  for mobile devices because we need to make everything as lightweight as possible. Here is a list of what appears to be missing, or not yet supported.

  • Styles
  • MuiltBinding
  • Triggers
  • DataBinding – ElementName & RelativeSource (see Binding)
  • XmlnsDefinition for mapping namespaces to Xaml namesspaces
  • d:DataContext, DesignInstance, DesignHeight, DesignWidth

It’s a shame in particular that Syles and Triggers are currently not supported as we can do some nice things in WPF with them. Silverlight got around Triggers with the Visual State Manager, but this is also not supported.

XmlnsDefinition can be used in WPF to map your c# namespaces to Xaml namespaces so that they can share the same namespace in the same way that we can reference many WPF features by using the x: namespace. I like to do this so that I don’t end up with lots of namespaces in my Xaml for each namespaced folder in my projects. Unfortunately this is currently not available.

I guess the d: blend design namespace no longer applies seeing as there isn’t currently a designer to work with. However I find d:DataContext and d:DesignInstance invaluable in WPF for enabling DataContext intellisense for my DataBindings. Sadly this is not available, but at least we do have some Xaml intellisense when using Xamarin Studio. More details in that here.

What’s changed?

DependencyObject & DependencyProperty

There are something’s that have simply been implemented under a different name. This is very important as they form the backbone of the binding mechanism. If you’ve done any WPF you’ll no doubt be familiar with DependencyProperty and DependencyObject. You won’t find these in Xamarin Forms because they are called something else. DependencyObject is now BindableObject, and DependencyProperty is now known as BindableProperty. Fundamentally they are the same.

DataContext

DataContext is now renamed BindingContext and you will find that each control deriving from BindableObject has a BindingContext property.

DataTemplate

DataTemplate is also somewhat different. In WPF we can define a DataTemplate and simply put whatever content we like in its content. In Xamarin Forms you must define a Cell. Out of the box you can use EntryCell, SwitchCell, TextCell, ImageCell or a ViewCell which lets you define your own custom content within its View property, like  this;

<ListView ItemsSource="{Binding Items}">
    <ListView.ItemTemplate>
      <DataTemplate>
        <ViewCell>
          <ViewCell.View>
            <Label Text="{Binding Name}" />
          </ViewCell.View>
        </ViewCell>
      </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

This can be simplified using a TextCell like this;

<ListView ItemsSource="{Binding Items}">
    <ListView.ItemTemplate>
      <DataTemplate>
         <TextCell Text="{Binding Name}" />
      </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

The one thing that is sadly missing from DataTemplate though is DataType. In WPF we can define DataTemplates for a specific Type. This is great for MVVM where we can just work with ViewModels and have them rendered to their associated View using this technique. This is currently not possible with XF. In fact at the moment it seems DataTemplate is exclusively for the use of ListView and TableView for declaring what the items should look like.

Binding

Bindings work similar to those in WPF, with OneWay and TwoWay bindings fully supported. However, ElementName is missing therefore you cannot bind to another control in the same way as you do in WPF. This is achieved by setting the BindingContext to another control using the x:Reference markup extension, like this;

<Slider x:Name="slider" Maximum="100" />
<Button BindingContext="{x:Reference slider}" Text="{Binding Value}" />

The problem here is I now can’t bind to my View Model because I have changed the BindingContext. For example, if  I want to bind the Button Command to a command on my ViewModel I can’t. I tried several ways to get around this. One was to use RelativeSource but this is also not available in Xamarin Forms. A request has been raised to support this so lets hope this is included at some point.

More on Data Binding this can be found in the Xamarin Forms Data Binding Basics Guide.

Layouts

Grid is about the only Layout control that is consistent with WPF. Row and Column Definitions work as you’d expect. Gone are WrapPanel and DockPanel and StackPanel is replaced with StackLayout. New layout controls include RelativeLayout and AbsoluteLayout. Another change is LayoutOptions which is used to define the Horizontal and Vertical Options. Start  defines either Top or Left, and End defines either Botton or Right depending on whether you are setting the Horizontal or Vertical Options. In addition there are StartAndExpand and EndAndExpand which fill the remaining space in the same way the DockPanel filled the last child. There is also Center, Fill and FillAndExpand. Full details on layouts can be found on the Xamarin Forms Layout Guide.

Controls

Xamarin Forms has a different set of controls than WPF which are then rendered on each platform as a native control. These controls are referred to as Views and include things like Buttons, Labels and text entry controls. A full list of these controls can be found in the Xamarin Forms Views Guide.

There are probably many more differences and comparisons to be made as I continue my adventures and I will point them out as I find them. For now I hope you found this comparison useful.

One thought on “Xamarin Forms & WPF Comparison

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s