A Journey in the world of DOTNET

Coupling

Coupling is the degree of mutual interdependence between separate units of a Program i.e. how components or modules or classes are linked with one another.

When the two classes depends on each other and when it is difficult to change one without changing the other, they are said to be tightly-coupled.

If we can vary one part of the program independently of another, then they are said to be loosely-coupled. 

Two classes can be linked by

1. Inheritance
2. Interface
3. Generic Interface
4. Delegates
5. Anonymous Delegates
6. Generic Delegates
7. Object Composition
8. WCF
9. Events
10. Web Services
11. LINQ – Most Loosely coupled

In Inheritance, changing the Base class affects all the Derived Classes. For example, adding an abstract method in base class breaks all the derived class. It is most tightly coupled.

WCF, Web Services and LINQ are most loosely coupled.

The remaining features lie somewhere between Tight coupling and Loose coupling.

It is advisable to have a loosely coupled design. 

Cohesion

Cohesion is the number and diversity of tasks that a single unit is responsible for. It is the degree to which the responsibilities of a Module or component form a meaningful unit.  It is inversely proportional to the number of responsibilities a module has.

If each unit is responsible for one single logical task, it is said to have High cohesion. Cohesion is applicable for both classes and methods.

It is always better to have High cohesion.

The philosophy behind Cohesion is often echoed in different Principles like

1. Single Responsibility Principle – An object should shoulder only one Responsibility.
2. DRY (Don’t Repeat yourself)

References

1. Patterns Wiki
2. Cohesion by Edge pereira
3. Bill Wagner's Coupling
4. Design Pattern Reference
5. Kent Bank's Coupling and Cohesion

Silverlight 3.0 has been released. Check out Scott Gu’s post.

Here is a small snapshot of the features:

1. Hardware Graphics acceleration
2. New Media codec support for H.264 video, AAC audio and MPEG-4
3. HD support
4. Smooth streaming support through IIS Media services
5. Immersive graphics experience
6. Out of Browser support – Applications can be run offline
7. Network detection support
8. Rich Data Binding
9. 100s of UI controls
10. New Navigation framework
11. Search Engine Optimization support
12. Richer Networking support

Expression Blend 3.0 is also released. The features include

1. Sketch flow – Easier to create prototypes with dynamic user Experiences
2. Intellisense for C#, VB, XAML
3. Adobe photoshop and Illustrator support
4. Design time sample data support
5. TFS support

Check out more on http://www.microsoft.com/silverlight/ and http://silverlight.net/GetStarted/

In the last post, we created a Simple Maintenance screen and observed a few Data Binding concepts. In this post, we will see how it can be enhanced more with the power of WPF.

We created the CRUD operations in our screen.

The Category dropdown displays only the Category Names. Say, if we want to display an Image along with the Name. Think how it can be done in Windows Forms. In WinForms, we would depend on some Custom controls or create our own Windows Control from scratch by hooking Win32 events.

In WPF, this becomes a lot simpler with its power of Composability. Yes, WPF Controls are composable – One control can be composed of other controls. In our case, the Combobox is not just a dropdown. We can specify a Template saying how the Combobox should look – A Template consisting of a Text and an Image. Does that sound puzzling!! Wait and See…

This was our XAML

In WPF, Controls can be specified with Data Templates, which define how a Data should look.

Let us remove the “DisplayMemberPath” property as we are going to specify a Data Template for display. Here we are instantiating a DataTemplate and assigning it to the ItemTemplate Property of ComboBox.

The DataTemplate can contain one Content Control –> What this means? We have to specify a Layout Control which can include other Content Controls. Let’s go with the StackPanel.

We can now define our custom Template inside the StackPanel.

Let us have a TextBlock and  an Image Control and bind them to the CategoryName and Picture Columns in Categories Table.

A Textblock is an element that can contain Text (It is a Readonly element unlike TextBox) and Image is a control that holds an Image.

A Textblock is not a Control whereas Label is a Control.

Here is the class Inheritance hierarchy. For more detailed differences between TextBlock and Label, check out here.

• Dependency Object
  • Visual
    • UIElement
      • FrameworkElement
        • TextBlock
        • Control
          • ContentControl
            • Label

Observe that the Binding expressions will point to the Respective columns.

Now run the Application. What a Wonder!!!   You can see the Images being displayed from the database, along with the Name in the Dropdown.

Observe how Complex this would be to handle in Winforms and how easily, WPF handles this for us.

With WPF Composability, any kind of UI can be designed and Sky is the limit!!!

Validation

What happens if we enter invalid data in the screen, say a non numeric value in Unit Price. Right now, Nothing happens!!!

This is because, WPF by default ignores any error that happens during validation and displays the Valid data in the screen.

But we would like to show an indication to the user, when ever there occurs an error in Data.

Let’s say, we want to show the user when invalid data is entered into UnitPrice column.

WPF comes with Validation Rules that can be specified during Binding. To specify the Validation rules, let us express Binding in a element centric form in XML.

We are doing the same as before - instantiating Binding and assigning it to Text property of Textbox.

Binding comes with Validation Rules and we can include our custom Validation that needs to be evaluated during Binding.

Let us just include an Exception validation rule, which raises an error whenever Unit Price Column faces an error.

Run the application and observe that the Control is highlighted whenever incorrect data is entered.

Custom Business Validation

Validation can also be included at Model level, i.e. DataSet level.

In our Application, QuantityPerUnit column is a String column and can be empty.

Let us say, we want to throw an error message, whenever QuantityPerUnit is not entered.

We need to include this Validation in the ColumnChanged event in DataSet.

In C#, to use a DataSet event, we need to override the EndEdit event of DataSet and specify our own event handlers.

Let us write a Validation method, which accepts the ProductsRow, checks if QuantityPerUnit is empty and throws an error message. 

To raise an error, just Call the “SetColumnError” in the DataSet. This accepts a Column and an error message.

We can now call this Validation method from ColumnChanged Event. This helps us to mitigate error in case of Update.

We can call this method, when a new Row is created.

There are three steps to support Validations:

1. Data sources have to implement IDataErrorInfo.  DataSets and DataTable already handle this event. If you write your own custom Data Source, you need to implement this Interface to specify Validations in Data Binding.  
2. Enable Validation in Binding. Set the ValidatesOnDataErrors property to true.
3. We need to specify a Control Template to show the Validation errors.

Let us enable Validation on Binding.

Then, we need to specify an errorTemplate, than can be used across Multiple windows.

Hence we will write the error Template in App.Xaml file. (This is the Application Markup and anything generic to the entire Application can be specified here)

There are too many things we are doing here:

1. We are going to Specify a Control Template – This is similar to how we specify a DataTemplate.
2. We are going to make the Control Template generic for the Application. We can apply the Generic Template to the specific scenarios which require that template. How to do that?
   1. We are going to use a Feature called Styles in WPF; We are going to specify a Generic style for Validation and apply the Style to as many as controls we want – in our case, any Control that has the Error Style will show the Error.
3. We are going to show an error message as Tooltip. This means we need to somehow set the Tooltip property whenever error occurs.
   1. We are going to use a Feature called Triggers in WPF. Triggers enable us to specify a Property which can be triggered to set in case of a specific scenario – in our case, when Validation fails.

Again a Reminder!!! WPF is awful with its Powers of Styles and Triggers

Let us build a Control Template.

The Target Control in a Control Template is Specified by AdornedElementPlaceHolder class.

Say, we want to decorate the Target Control with a Red Border.

Now we want to Display an Asterisk (*) before the Control.

Let us use a DockPanel to dock the Asterisk to the Right of the Control.  DockPanel allows its child elements to get docked into any of the four directions.

DockPanel has LastChildFill property which when enabled allows the Last element in the DockPanel to fill its entire layout. We will have the Target control as the Last element, allowing it to fill the entire Control Template, after leaving a space for Asterisk.

Now we have our Control Template ready and we need to make this template generic and apply to a Control in case of Error.

Let us define a Style for Error Template in App.XAML.

Styles have a TargetType property which defines the Type of the Control where the style can be applied.

WPF has an Extensive Property system, where in many things are achieved using Properties. WPF leverages the use of Properties in .NET than the Events in a larger extent.

Styles allow a collection of Setter class, which allows to set a Value to a Property.

In our case, we want to set the Control Template as the Error Template in case of Validation. 

Let us include the Control Template that we created before, in this Style.

Now that the Control Template is created, we need to define Triggers, which can, set the Tooltip in case of Error.

A Trigger has a Property and a Value. The trigger executes the logic in Setter whenever the Property matches the Value.

Styles allow a collection of Triggers to be included.

We want to enable the Setter when Validation fails. Hence include Validation.HasError as PropertyName.

We can then set a generic error message for Tooltip.

Now a Generic Style has been created, we want to set the Style to our Controls. It is much simpler.

We will create an another style which applies the Error Style to a Control. Styles have a “BasedOn” property which signifies that the Target Control will be based on the ErrorStyle.

Now, having included the Validation, we can Add a new Row when there are no errors.

We can save the data only when there are no errors.

We can also prevent the user from navigating to a different Product unless these errors are rectified.

Let us now run the Application.

Try saving without entering QuantityPerUnit.

The error Template is applied to TextBox control and the Tooltip is shown.

An error message will be shown on Save. Try clicking Add, the window will not be cleared.

In this post, we have explored

1. Composability in WPF
2. How to specify a Data Template
3. How to include Validation
4. Validation Rules
5. How to specify a Control Template
6. How to set a Style in WPF
7. How to write Triggers in WPF
8. What is AdornedElementPlaceHolder

References

1. Validation
   1. How Do I: Hook Up and Display Validation in WPF (22:20)  
   2. How Do I: Associate a Validation Rule with a Binding (16:53) 
2. Data Templates
   1. How to use Data Templates in WPF
3. Styles
   1. How to Use Styles in WPF (10:22)
   2. Style Inheritance using BasedOn in WPF (17 minutes, 38 seconds)
   3. Apply Styles in WPF (12 minutes, 40 seconds)
   4. Sharing Styles Among Heterogeneous Elements (13:05)
   5. Override a Style for a Local Control’s Property Value in WPF (12:47)
   6. WPF Soup to Nuts (Part 10 of 18): Adding Pizzazz with Style (Level 200)
   7. Introduction to Themes in WPF (15:14)
4. Triggers
   1. Interactivity Through Triggers in WPF Control Templates (15:26)
   2. Implementing Data Triggers in WPF (10:25)
   3. Complex Logic Using Triggers in WPF (13:36)
   4. Implementing Property Triggers in WPF (13 minutes, 02 seconds)
5. Control Templates
   1. How to Apply Control Templates in WPF (12:24)
   2. Use a Control Template to Define a Desired Look (16:34)
   3. Control Templates in WPF (Level 200)