Silverlight 4 Simple Project Part 3 (MVVM Pattern)

Silverlight 4 Simple Project Part 2 (WCF Service)

In Part 2 we already created our WCF Service that can return some results to us when functions are called.

In this post I will start building my Silverlight Application :)

Silverlight Project

Create new project inside the same solution. Choose Silverlight Application and name it AlkitabApplication. Right-click the project and choose Add Service Reference. click Discover and you can see that our AlkitabWebService.svc is shown. Easy!



In the above picture you can also see that I created three new folders called Model, ViewModel, and Views. Move the MainPage.xaml to the Views folder.

Model View View Model (MVVM) Pattern

For those who are new to this term, you can read this. Otherwise you might want to move on.

MVVM is just a pattern. There is no strict procedure on how to implement it. This pattern is created for developers to separate the logic of their application, providing a nice way to do unit testing and creating blendability between designer <-> developer.

What this means is that designers can focus on playing around with the Views and developers can provide back-end data in the View Model (that perform queries against the Model) independently. The View can then just hook the View Model into it and create the bindings between the UI Elements <-> data. Moreover, developers can provide designers with dummy data to test while designing the Views.

People have been creating tools and frameworks to assist this pattern, such as MVVM Light, MEF, and Prism. However, I won't be using any of those since my application is really simple.

Confused? Let's see in action!

Model

Rather than calling WCF Service straight in our XAML code behind, we will create a class called AlkitabService.cs in our Model folder. It is nice to have a high level layer that provides us with one logical purpose: Our Data Source!

This class will provide us sets of functions that call WCF Service functions asynchronously. Asynchronous call is what Silverlight is all about right? :)



Views

I am not much of a designer, but I like clean design :) Here is what the application looks like:



I won't show you the XAML just yet because I will show it when I'm doing the bindings. In this project I am using Telerik Silverlight controls (RadComboBox and RadGridView). Simple reason, they have nice features such as Auto-Complete, Filtering, etc. However you can use the normal Silverlight controls to do the same thing.

View Model

Here is the main player. This is where all the logic resides. Inside the folder, I created two classes: ViewModelBase.cs and AlkitabViewModel.cs

ViewModelBase is just a base class that implements INotifyPropertyChanged. Remember that all data/properties exposed in the UI need to have this event raised to notify the UI elements.



Inside AlkitabViewModel.cs is where we call our Model and store the data into our class properties that we can then bind to our UI.



Notice that we raise the NotifyPropertyChanged event in the setter of all properties.

I hope you don't get a headache from this. In the next post I will talk about hooking up our ViewModel to our Views and perform the bindings. I will also quickly explain the Commanding in Silverlight 4.

Silverlight 4 Simple Project Part 4 (Binding & Command)

Comments

Post a Comment

Popular posts from this blog

SharePoint 2013 anonymous access add attachments to list item

Image
Hi, Sometimes you want to enable anonymous access to be able to add a list item but at the same time attaching some documents. After good few hours playing around trying to make this work, turns out that we can achieve this functionality. The trick is to use RunWithElevatedPrivileges method for the file upload. We also want the file upload functionality to be available on the NewForm.aspx as it wouldn't make sense to put it in other forms as any user would be able to upload files to other records. The result will be something like this: When it is saved, the user is redirected to the display form: The close button then will take the user back to the homepage (or any page you desire) The steps: 1. Create an ascx control to host your file upload control in your project.  Put the below script in the ascx as well (credit to this post ): The code behind: 2. Create custom form template. You have to put the ascx in the CONTROLTEMPLATES folder of the ...
Read more

Sitecore custom publish agent from specific node and at a specific time

Hi all, As you all know, scheduled publishing will not run automatically unless you enable PublishAgent task in Sitecore config. By default, all items that are in publish queue will get published when this task triggers. This includes all items in the final workflow state and all items that don't have workflows. Sometimes this is not what you want. Maybe you don't enable workflow on media items and you don't want the items to go live when they are not ready. The workaround is to create your own PublishAgent task. Looking at the one provided, we can easily extend the code to insert the RootItem to the PublishOptions (this only works with Full or Smart publish mode however): You will notice that on the Run method I check whether the server time is around the time I set in the parameter (thanks to this post for the code). This will enable us to run the task near the specific time we set (e.g. midnight). In the config patch, just add this to enable the custom agent...
Read more

CRM Plugin - Parent and Child Pipeline

This concept tends to confuse people often - and I was no exception. I came across this problem when trying to create custom auto-numbering for one of my projects. Creating auto-number for Opportunity is easy. This is because the user creates opportunity straight from the home screen - thus the plugin runs on parent pipeline. However, it's a different story if you are dealing with Quote entity. Quote can be created in 2 ways, through the home screen OR the opportunity screen. If you create it from the latter, it will run on the child pipeline and you will find that your plugin will not work. Registering it as a child pipeline is easy, but CRM makes it harder since you can't use ICRMService. Instead, you have to create CRMService manually by using this piece of code: Not only that, with the child plugin you can't use Query expression to fetch other entities in your code unless you register it as ASYNCHRONOUS plugin. Mark Kovalcson in his blog found out that: A C...
Read more