In this article we will learn how the event handling binding has become simpler day by day. Lets check out a simple Button click event implementation.


Lets say our Xaml page contains two text boxes for entering UserName and Password and one submit button. So on click of the Submit button, we are checking in code behind UserName and password.

For Example:

In Xaml page and it's code behind page respectively we have


<Button x:Name="btnSubmit"



private void

btnSubmit_Click(object sender, RoutedEventArgs e)



public void



But how does the view know it's corresponding ViewModel? We need to bind View with it's corresponding ViewModel. So how to do this? We can do it in Xaml or in Xaml.cs file.

1ST METHOD(In Xaml):

Here, just define ViewModel class as a Usercontrol resourcce and use it as a

DataContext source where we need to bind.

< UserControl.Resources>




</ UserControl.Resources>

<Grid x:Name="LayoutRoot" DataContext="{StaticResource employeeviewmodel}" />


2ND METHOD(In Xaml.cs):

Instantiate ViewModel object in it's code behind and bind it as a

DataContext like this.


emv = new EmployeeViewModel();

LayoutRoot.DataContext = emv;

This approach looks good. But what if everything will be done automatically? I mean View will find it's corresponding ViewModel and you do not require above two methods for manual binding. Is not this amazing? Here binding depends upon convention rather than Code. So decreases the amount of Codes. This approach followed by Caliburn framework which is an extension of MVVM. So lets check how to do this through Caliburn.


here the basic convention to follow so that View will find out it's corresponding ViewModel is.

<ViewName>View.xaml //LoginView.xaml

<ViewName>ViewModel.cs //LoginViewModel.cs

Like in case of other approaches we need to use RootVisual property in App.xaml.cs file to find out the start up page, Here we need a BootStrapper class that is used to find out the startup ViewModel page.

Then the ViewModel page will find out it's corresponding View by cutting Model from it's page name. So lets say HelloBootstrapper.cs is the bootstrapper class. It contains LoginViewModel is the start up page. Add a reference to

Caliburn.Micro dll.

public class

LoginBootStrapper : Bootstrapper<LoginViewModel>



We need to remove everything from App.xaml.cs and need to instantiate this bootstrapper in App.xaml



< Application.Resources>

< local:LoginBootStrapper x:Key="bootstrapper" />



In LoginViewModel just define the method like

public void




In xaml page we just need to write

<Button x:Name="Submit"></Button>

Here Method name and Button name are same. So by convention view will try out corresponding Submit method in ViewModel and then bind it with Button.  Hence from all the above examples, we have a clear idea about how to optimize code in particular situation.


Contact Us



Captcha Image

Why Choose Us

Wide Portfolio of Services

Domain Intensive Value Proposition

Technological Excellence across platforms 

Avail competitive pricing (Reduce 70% cost, ensure 100% quality)

Get 4 weeks complimentary Risk-Free Trial*

We Build Innovative Applications: Browse through our Intellectual Property

Client Testimonial

StartQuotes"Mindfire has enabled us to reduce costs and increase productivity. The team we have provides fast and reliable development support. We are very happy with the level of service from Mindfire." - Ken Morency, IceFire Studios Corp.

More Client Testimonials

News & Updates

  • November 19

    20th Year Anniversary Celebration at Malaysia

  • March 19

    Ninth Edition: DDMIT Quiz

Let us Connect!

Awards and Achievements

Red Herringcolor DeloitteFast50 DB ZInnov1   Nascome  DB Stpi

This site uses cookies. We respect your privacy.copyright (c) Mindfire Solutions 2007-2018. Login