Set BindingContext to ViewModel in XAML on Xamarin.Forms

Question

I want to develop a simple project with Xamarin.Form and MVVM. In my solution (named XamarinPOC) i have (in addition to standard Xamarin.Forms projects) one separate project for the model (XamarinPOC.Model) and one separate project for the ViewModel (XamarinPOC.ViewModel).

I defined in a XamarinPOC.ViewModel project an abstract class for a BaseViewModel class (that implements the INotifyPropertyChanged Interface) and after I've created a SummaryViewModel class that extend BaseViewModel class with a simple property:

namespace XamarinPOC.ViewModel
{
    public class SummaryViewModel : BaseViewModel
    {

        private string _test = "The binding is OK!";
        public String test
        {
            get
            {
                return _test;
            }
            set
            {
                _test = value;
                OnPropertyChanged("test");
            }
        }
        public SummaryViewModel(){}
    }
}

Next I created a simple ContentPage (SummatyView) in a XamarinPOC project that contain only a label that i want show the text defined in ViewModel. I want to use a XAML for defining the View and the binding but when I run the app nothing is displayed, I no errors on compile-time and runtime but the text are not displayed. My XAML is this

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:XamarinPOC.ViewModel,assembly=XamarinPOC.ViewModel"
             x:Class="XamarinPOC.Summary"
             Title="Summary List"
             BindingContext="XamarinPOC.ViewModel.SummaryViewModel">
  <StackLayout>
    <Label Text="{Binding test}"/>
  </StackLayout>
</ContentPage>

and finally my app.cs is:

 namespace XamarinPOC
{
     public class App : Application
     {
         public App()
         {
             MainPage = new Summary();
         }
     }
 }

In the XamarinPOC project I've added a reference to XamarinPOC.ViewModel and XamarinPOC.Model assemblies.

I think the problem is in the XAML definition of binding, but i don't find the error. Where am I wrong?

You need to assign BindingContext an instance of your ViewModel, not the class definition itself — Jason

Ahmad ElMadi Ahmad ElMadi · Accepted Answer · 2016-07-24T21:16:41

To bind the view to the viewmodel from Xaml in your case do it like this

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:viewModels="clr-namespace:XamarinPOC.ViewModel; assembly=XamarinPOC.ViewModel"
             x:Class="XamarinPOC.Summary"
             Title="Summary List">
  <ContentPage.BindingContext>
    <viewModels:SummaryViewModel/>
  </ContentPage.BindingContext>
  <StackLayout>
    <Label Text="{Binding test}"/>
  </StackLayout>
</ContentPage>

One side note I noticed is with naming conventions, it is better to put all your ViewModels, even if it is only one viewModel, inside a folder named "ViewModels" So the namespace in your case would be XamarinPOC.ViewModels

Set BindingContext to ViewModel in XAML on Xamarin.Forms

1 Answers