Tech-talk @ Vivek

Threading Patterns: The Worker Thread Pattern

2011-09-11T06:58:00.000-07:00

The Worker Thread pattern introduces concept of Thread per Message i.e. a data/operation pair is executed in the context of its own thread.

The design pattern eases efficient execution of multiple long running processing. In fact this is nothing but executing long running processing in multiple threads instead of running them sequentially. Usually this pattern is used to move long running processing in different threads.

The example implementation below has an abstract class WorkerThreadBase. This class exposes multiple protected constructors which advanced users can use to specify the name, priority and background/foreground behaviour of the threads.

It has one abstract method Work which encapsulates the actual processing needs to be done.

Public method Start() is to start the operation asynchronous And Stop() method to stop the operation blocks until the thread completes execution.

There is one Boolean protected property StopRequested which can be polled inside the implementation of abstract method Work() to detect if the user wants to stop the thread

User has to create Derived class and call the Start/Stop method to perform the task.

There is a static method WaitAll() on the WorkerThreadBase class that can be used to wait for one or more task.

//wait for the two threads to finish

WorkerThreadBase.WaitAll(copyFileWorker, dummyWorker);

Using this design pattern processing can be performed in efficiently however it involves the overhead of thread creation and clean-up hence use of this Pattern should be limited to only long running processes.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading;


namespace WorkerThreadPattern
{
    public abstract class WorkerThreadBase : IDisposable
    {
        private Thread _workerThread;
        private ManualResetEvent _stopping;
        private ManualResetEvent _stopped;
        private bool _disposed;
        private bool _disposing;
        protected WorkerThreadBase()
            : this(null, ThreadPriority.Normal)
        {
        }
        protected WorkerThreadBase(string name)
            : this(name, ThreadPriority.Normal)
        {
        }
        protected WorkerThreadBase(string name,
            ThreadPriority priority)
            : this(name, priority, false)
        {
        }
        protected WorkerThreadBase(string name,
            ThreadPriority priority,
            bool isBackground)
        {
            _disposing = false;
            _disposed = false;
            _stopping = new ManualResetEvent(false);
            _stopped = new ManualResetEvent(false);
            _workerThread = new Thread(threadProc);
            _workerThread.Name = name == null ? GetType().Name : name;
            _workerThread.Priority = priority;
            _workerThread.IsBackground = isBackground;
        }
        protected bool StopRequested
        {
            get { return _stopping.WaitOne(1, true); }
        }
        public void Start()
        {
            ThrowIfDisposedOrDisposing();
            _workerThread.Start();
        }
        public void Stop()
        {
            ThrowIfDisposedOrDisposing();
            _stopping.Set();
            _stopped.WaitOne();
        }
        #region IDisposable Members
        public void Dispose()
        {
            Dispose(true);
        }
        #endregion
        public static void WaitAll(params WorkerThreadBase[] threads)
        {
            WaitHandle.WaitAll(
                Array.ConvertAll<WorkerThreadBase, WaitHandle>(
                    threads,
                    delegate(WorkerThreadBase workerThread)
                    { return workerThread._stopped; }));
        }
        public static void WaitAny(params WorkerThreadBase[] threads)
        {
            WaitHandle.WaitAny(
                Array.ConvertAll<WorkerThreadBase, WaitHandle>(
                    threads,
                    delegate(WorkerThreadBase workerThread)
                    { return workerThread._stopped; }));
        }
        protected virtual void Dispose(bool disposing)
        {
            //do nothing if disposed more than once
            if (_disposed)
            {
                return;
            }
            if (disposing)
            {
                _disposing = disposing;
                //stop the thread;
                Stop();
                //make sure the thread joins the main thread
                _workerThread.Join(1000);
                //dispose of the waithandles
                disposeWaitHandle(_stopping);
                disposeWaitHandle(_stopped);
                _disposing = false;
                //mark as disposed
                _disposed = true;
            }
        }
        protected void ThrowIfDisposedOrDisposing()
        {
            if (_disposing)
            {
                throw new InvalidOperationException("....................");
                    
            }
            if (_disposed)
            {
                throw new ObjectDisposedException(
                    GetType().Name,"............");
                    
            }
        }
        protected abstract void Work();
        private void threadProc()
        {
            Work();
            _stopped.Set();
        }
        private void disposeWaitHandle(WaitHandle waitHandle)
        {
            if (waitHandle != null)
            {
                waitHandle.Close();
                waitHandle = null;
            }
        }

    }
}

Source Code Download

Developing Green field Enterprise Application in .NET 4.0 by leveraging C# Open Libraries

2011-07-31T02:57:00.000-07:00

As the enhancement in .NET is making life far easier as the same time open source is taking canter stage of .NET technology paradise. The maturity of the .NET technology can be evaluated with the number of open source ready for utilization.

If a chance is given any .NET technologist will be flooded with list of libraries ready to be used. In this blog post I have tried to list down all the libraries of my choice. Off course I will start with front end GUI development in WPF/Silverlight

1. Prism/Composite Application Block: http://compositewpf.codeplex.com/

Prism provides ready to use libraries & guidance to design & develop GUI rapidly. It makes the whole exercise more easily, flexible & easy to maintain WPF desktop application & Silverlight Rich Internet Applications.

Some of the silent features of this Library include:

-Separation of concerns

-Loose coupling

-Easy & seamless integration of module

2. Relay Command:

Relay Command is a simplified variation of the DelegateCommand found in the Prism/ Composite Application Block.

http://msdn.microsoft.com/en-us/magazine/dd419663.aspx#id0090030

3. Making call back in UI thread using Dispatcher

http://msdn.microsoft.com/en-us/magazine/cc163328.aspx

4. Use of ISynchronizationContext for Synchronous Invocation of Delegates

http://www.codeproject.com/Articles/51457/Synchronous-Invocation-of-Delegates-with-the-Silve.aspx

Using UISynchronization context Library developed by Daniel Vaughan

http://www.codeproject.com/KB/silverlight/Mtvt.aspx

http://www.codeproject.com/KB/silverlight/SL4FileUploadAnd_SL4_MVVM.aspx

Various use of Dispatcher in Silverlight GUI:

http://dotnetslackers.com/articles/silverlight/Multithread-Programming-in-Silverlight-4.aspx

5. Useful Library Cinch

Many features can be borrowed from this library

http://cinch.codeplex.com/

6. ManifestManagerUtility

Usueful in the deployment of WPF client application. This tool uses ClickOnce APIs for deployment. Its designed to address most common administrative tasks done using ClickOnce in Visual Studio.

Its a lightweight desktop based application that can be given to IT administrators.

http://compositewpf.codeplex.com/releases/view/14771

Libraries useful for Service Development:

1. Design Patterns for Decomposition and Coordination on Multicore Architectures (Parallel Programming with Microsoft .NET 4.0)

http://msdn.microsoft.com/en-us/library/ff963553.aspx

For Backend processing one of the following Parallel Programming Pattern can be pickedup:

http://parallelpatterns.codeplex.com/

2. Web Service Software Factory (no more too relevent but can be looked for illustrations)

http://servicefactory.codeplex.com/

3. Microsoft Enterprise Library

http://entlib.codeplex.com/

http://msdn.microsoft.com/en-us/library/ff648138.aspx

Data Access Block is widly used feature of Microsoft Enterprise library. Even retrieving Data as Objects is possible:

http://msdn.microsoft.com/en-us/library/ff953187%28v=PandP.50%29.aspx

4. Composite Services

Library, Sample applicaiton & Guidance for building enterprise SOA-based composite service applicationshttp://compositeservices.codeplex.com/

Agile Development Practices:

http://msdn.microsoft.com/en-us/practices/dd128747

NHibernate is an open-source ORM for .NET derived from the successful open-source ORM Hibernate for Java. Its one of the most popular and most-used ORMs in the open-source community; it has well-established community support and numerous plug-in and code generators.
http://nhforge.org
http://fluentnhibernate.org/
FluentNHibernate is an open-source plug-in helpes in generating mapping files using C#

Microsoft Enterprise Library - Validation Application Block (VAB)
Additional validation frameworks that you want to explore for .NET are:
EVIL (http://evil.codeplex.com) An open-source project that works much like the VAB library, using decorations and rulesets.
Active Record (http://www.castleproject.org/activerecord/index.html) An open-source plug-in for NHibernate that transforms your domain into an Active Record domain.
Conditions (http://conditions.codeplex.com) Another open-source framework that uses the Fluent Interface (see Chapter 2) instead of attributes.

WPF Ribbon control available
http://wpf.codeplex.com/

Cinch is available on CodePlex at http://cinch.codeplex.com/,
Cinch, by Sacha Barber

MEFedMVVM
MEFedMVVM is a library for building Managed Extensibility Framework (MEF) applications using Silverlight or WPF
http://mefedmvvm.codeplex.com/

MVVM Light Toolkit, by Laurent Bugnion
http://www.galasoft.ch/mvvm/getstarted/

a set of utilities for MVVM toolset “Radical.”
http://radical.codeplex.com

Calcium is an open-source WPF and Silverlight (alpha release) composite application toolset that takes advantage of the Composite Application Library - http://calciumsdk.net/

Caliburn was introduced to WPF developers at around the same time Microsoft released the first version of Prism.

http://caliburn.codeplex.com/

Full complement of features, Caliburn also ships in a micro version called Caliburn.Micro, available at
http://caliburnmicro.codeplex.com/.

Manifest Manager Utility makes ClickOnce Deployment easy for IT Administrators

2011-07-30T03:47:00.000-07:00

Usually ClickOnce deployment feature can be utilized from Visual Studio IDE But the problem with this approach is that Visual Studio is not preferred & convenient for an IT Administrator. However Visual Studio exposes most of the capabilities needed for ClickOnce Deployment.

Open Source tool Manifest Manager Utility has been developed to ease the control & audit requirements associated with Enterprise Level Application deployment. This tool has been designed to addres most common administrative tasks for ClickOnce.

This is a friendly desktop based application for IT administrators. Unlike providing very detailed steps that needs to be performed in the correct order, for common tasks during deployment such as modifying the application files listed in the application manifest, it makes deployment simpler.

Manifest Manager Utility also demonstrates how to use the ClickOnce publishing API to manage deployment and application manifests in a simpler way. This utility is used for updating application manifest file lists and deployment manifest settings. It can be further customized as per the project specific requirements.

More Details about the APIs can found at

http://msdn.microsoft.com/en-us/library/ms125799(v=VS.80).aspx

http://msdn.microsoft.com/en-us/library/ff921100(v=pandp.20).aspx

http://msdn.microsoft.com/en-us/library/t71a733d(v=VS.100).aspx

http://msdn.microsoft.com/en-us/library/748fh114.aspx

http://msdn.microsoft.com/en-us/library/s22azw1e.aspx

WPF Busy Indicator

2010-11-28T04:37:00.001-08:00

BusyIndicator control in WPF

Environment: Visual Studio 2010

Download : Sample code

Extended WPF Toolkit has come with the much needed Busy Indicator pretty much similar to the Activity control of Silverlight. You can put content inside the BusyIndicator and bind its property IsBusy with the dependency property in the ViewModel layer.

BusyIndicator makes it easy to let the user know when an application is busy. Simply wrap the relavent content in an instance of the BusyIndicator control and toggle its IsBusy property to True during any long-running process.

Simple steps to get the application up:

Download the Extended WPF Toolkit get WPFToolkit.Extended.dll

Reference WPFToolkit.Extended.dll in the project

Add namespace:

xmlns:extToolkit="clr-namespace:Microsoft.Windows.Controls;assembly=WPFToolkit.Extended"

<extToolkit:BusyIndicator IsBusy="False" >

..............

Any no of content

..............

</extToolkit:BusyIndicator>

Download : Sample code

Saral Framework Development Team: Join & be part of exciting learning Exercise

2010-08-23T06:05:00.001-07:00

Disclaimer: This is an open community project without any funding, liability or restriction, every one involve in the project is owner of project and code.

Join Saral Framework Development Team – Learn, Contribute & Keep the knowledge floating.

Objective: A framework to ease the development of Prism (Composite Application Library) & MVVM based WPF application.

Mode of Operation : Virtual Platform, Free tools (Gtalk, Skype, Codeplex, TortoiseSVN client)

Get Started:

- New to WPF

http://windowsclient.net/learn/videos_wpf.aspx

http://windowsclient.net/wpf/

- New to MVVM based application

http://msdn.microsoft.com/en-us/magazine/dd419663.aspx

- New to Prism (Composite Application Block)

http://msdn.microsoft.com/library/cc707890

http://msdn.microsoft.com/en-us/library/ff648611.aspx

http://channel9.msdn.com/posts/akMSFT/What-is-Prism-v2/

First phase of Plan:

- Putting together reusable classes to ease common tasks (Strictly no code behind/ MVVM a must)

Second phase of Plan:

- Putting together reusable Navigation patterns to facilitate development of Prism & MVVM based WPF application

Third phase of Plan:

- Development of Customizable Prism Shell where modules can be injected.

Simplified ICommand implementation in WPF MVVM application

2010-08-23T05:55:00.001-07:00

Saral framework which provides utilities to ease the MVVM implementation in Silverlight and WPF application presents SaralCommand. This is a simplified version of DelegateCommand which was introduced with Microsoft Composite Application Library

SaralCommand makes things very simple by allowing developer to concentrate on business logic and get rid of ICommand interface implementation. I have just checked-in the code of SaralCommand in the Saral framework hosted on Codeplex

This post provides an example implementation of SaralCommand. I have taken a Prism and MVVM based WPF application posted in my previous blog post to work with SaralCommand.

Environment: Visual Studio 2010

Source code : Download

   public class SaralCommand : ICommand
    {

        readonly Action<object> executeLogic;

        readonly Predicate<object> canExecuteCondition;

        readonly bool predicateFlag;

        public SaralCommand(Action<object> executeLogic, Predicate<object> canExecuteCondition)
        {
            this.executeLogic = executeLogic;
            this.canExecuteCondition = canExecuteCondition;
            this.predicateFlag = false;
        }

        public SaralCommand(Action<object> executeLogic)
        {
            this.executeLogic = executeLogic;
            this.canExecuteCondition = null;
            this.predicateFlag = true;
        }

        public bool CanExecute(object parameter)
        {
            if (predicateFlag == false)
            {
                return canExecuteCondition(parameter);
            }

            return true;
        }

        public event EventHandler CanExecuteChanged
        {
            add { CommandManager.RequerySuggested += value; }
            remove { CommandManager.RequerySuggested -= value; }
        }

        public void Execute(object parameter)
        {
            executeLogic(parameter);
        }
    }

Illustration of SaralCommand

   private Saral.Command.SaralCommand saralCommand;

        public ICommand SearchCommand
        {
            get
            {
                return saralCommand;
            }
        }

        /// <summary>
        /// Constructor of view model
        /// </summary>
        /// <param name="eventAggregator"></param>
        public SearchViewModel(IEventAggregator eventAggregator)
        {
            this.eventAggregator = eventAggregator;

            saralCommand = new SaralCommand(param => OnSearch(title), param => CanSearch());
        }

        private void OnSearch(object title)
        {
            IDictionary<string, string> searchInputDictionary = new Dictionary<string, string>(1);
            searchInputDictionary.Add("title",(string)title);
            eventAggregator.GetEvent<SearchTopicPropagationEvent>().Publish(searchInputDictionary);

        }

        private bool CanSearch()
        {
            return true;
        }

Environment: Visual Studio 2010

Source code : Download

Different approaches for Commands/Command Logic while implementing Prism & MVVM in WPF

2010-08-22T01:51:00.001-07:00

MVVM enforces empty code behind files, except the standard code that calls InitializeComponent inside the constructor. Even if you remove code behind file from the project still it will compile and run correctly.
Even without having event handler in the code behind application can be made to react on the user interaction events. It can be done by binding ICommand object exposed by ViewModel layer with UI controls. Command is an object that makes it easy to consume ViewModel’s functionality from the view declared in XAML.

Usually ViewModel has to expose a property of type ICommand. This command property is usually initialized in the constructor of ViewModel.

For example – Following code has been taken from one of my previous blog post on Navigation in Prism with MVVM.

public class NavigatorViewModel
    {
        IEventAggregator eventAggregator;
        ICommand navigateToRevenueCommand;
        ICommand navigateToSalesCommand;
        string activeWorkspace;

        public NavigatorViewModel(IEventAggregator eventAggregator)
        {
            this.eventAggregator = eventAggregator;
            this.activeWorkspace = "Revenue";
            this.navigateToRevenueCommand = new NavigateToRevenueCommand(this);
            this.navigateToSalesCommand = new NavigateToSalesCommand(this);
        }

       public ICommand NavigateToRevenue
       {
           get
           {
               return navigateToRevenueCommand;
           }
           set
           {
               navigateToRevenueCommand = value;
         }
       }

       public ICommand NavigateToSales
       {
           get
           {
               return navigateToSalesCommand;
           }
           set
           {
               navigateToSalesCommand = value;
           }
       }

       public string ActiveWorkspace
       {
           get
           {
               return activeWorkspace;
           }
           set
           {
               activeWorkspace = value;
           }
       }

       public IEventAggregator EventAggregator
       {
           get
           {
               return eventAggregator;
           }
           set
           {
               eventAggregator = value;
           }
       }

    }

This class exposes ICommand property which has been instantiated inside the constructor of the class.
Even it can be injected or can have private class to implement the ICommand Interface. But it becomes difficult if you have too many commands in your ViewModel class.

Microsoft Composite Application Library introduces DelegateCommand which can be used for command implementation within the module.

Recently I have designed a class to simplify the Command implementation by generalizing it I have created SaralCommand as part of Saral Framework hosted on Codeplex.com
I will describe it in my next blog post.

Working with DataSet in WPF application implementing MVVM Design

2010-08-20T20:53:00.001-07:00

Though its recommended to use Data Classes with Observable Collection or Binding List for the Data binding in the WPF application however it is quite easy to work with DataSet for the Data binding. At the same time MVVM design pattern can be implemented.

Environment: Visual Studio 2010

Source Code : Download

ModelView Layer:

private DataView testDataVM;

public DataView TestDataVM

{

get { return testDataVM; }

set

{

testDataVM = value;

InvokePropertyChanged("TestDataVM");

}

Model Layer:

DataTable dataTable = new DataTable();

// Initialize the dataTable with DataSet retrieved from the Database

DataView testDataView = dataTable.DefaultView;

public DataView TestDataView

{

get { return testDataView; }

set

{

testDataView = value;

InvokePropertyChanged("TestDataView");

}

Source Code : Download

Entity Data Model / EDM Example applicaiton in WPF

2010-08-15T01:43:00.001-07:00

This blog post explains the an example application to demonstrate the ADO.NET Entity Data Model.

Development Environment : Visual Studio 2010

Download : Source Code

The EDM wizard of Visual Studio helps generate the base entity model, which can be modified later as per the need.

SchoolEntities entities = new SchoolEntities();

var q = from c in entities.Departments

select c;

List<Department> departmentList = q.ToList<Department>();

Display Message Box and File Open/ Save Dialog Box in MVVM design pattern based application

2010-08-09T05:11:00.000-07:00

MVVM design pattern discourages code behind and introduces command based processing. It comes with whole host of advantages but makes tricky to display message box or even file open/save dialog box. This blog post introduces classes that can be used for above said purpose either from ViewModel or Model as per the design of your application.

These classes are part of Saral Framework that I have hosted recently on CodePlex. The vision behind Saral framework is to put together the entire infrastructure required to perform most common tasks while working with MVVM based Silverlight/WPF application.

I have just posted the initial version of this Framework which provides infrastructure to display ShowMessage(), OpenFileDialog() and SaveFileDialog() from Model or ViewModel layer of MVVM based Silverlight/WPF application.

Infrastructure for ShowMessage() message box:

Infrastructure for File Open/Save Dialog:

Download link: Source code

I will post an example application in next blog post.

WPF Demonstration application using PRISM and MVVM

2010-07-31T00:43:00.001-07:00

Source Code Download

This blog post presents a demonstration/sample application to explain WPF application development using PRISM (Composite application Block) with MVVM design pattern. PRISM facilitates the development of individual modules with or without any design pattern. In fact it is up to architect to make a choice between MVP & MVVM design pattern.

The sample application provided with PRISM library is based on MVP design pattern. As in MVP design pattern Presenter has a reference to View which many architect including me don’t like. There are not many sample application available to demonstrate the PRISM modules using MVVM design pattern. Over the last weekend I decided, It worth to demonstrate PRISM module with MVVM design pattern. I choose a very simple task for this demonstration. I have to do a search of RSS feed using REST based URL provided by Google.

This sample demonstration application covers following concepts:

- Development of WPF PRISM modules using MVVM Design pattern

- Passing multiple parameter/values from one Module to another to facilitate interaction

- Demonstration of Boolean to Visibility enumerator converter

Environment :

Microsoft Visual C# 2010 Express Edition

Composite Application Guidance Library for WPF - May 2010

Application Design:
The Prism Shell has two regions, Search Region and Result Region respectively as shown in figure below.

Both regions are developed as separate Modules in separate visual studio project part of single visual studio solution. As shown in snapshot below Modules.SearchPanel and Modules.SearchResultPanel are visual studio projects for Prism Modules.

The Infra layer provides the even necessary wiring even to facilitate interaction between the two modules SeachPanel and SearchResultPanel respectively.

Infra layer has an even derived from CompositePresentationEvent which facilitates the propagation of Dictionary and hence multiple parameter/values from one module to another module.

public class SearchTopicPropagationEvent : CompositePresentationEvent<IDictionary<string, string>>
{

}

Source Code Download

Silverlight Flip window made of standard controls

2010-04-08T23:08:00.001-07:00

This post explains the making of Flip window in Silverlight using standard controls.

Source code: Download

Development Environment:

- Microsoft Visual Web Developer 2008 Express Edition

- Microsoft Silverlight 3 SDK

Test application has a test page (MainPage.xaml) which hosts the Flip window. User can flip the visible area on flip window either downward or upward based on initial state. At page load the default state is up flip is invisible.

The down flip at the time of initial page load :

Down flip on mouse over:

Down flip on mouse pressed /clicked:

Up flip at the time of initial load initial load:

Up flip on mouse over:

Up flip on mouse pressed/ clicked:

Source code: Download

Prism for Navigation in WPF Application

2010-02-24T05:45:00.000-08:00

This post explains the use of PRISM in a WPF application to facilitate the navigation from one module to another module

Source code: Download

There are following three UI module which has been hosted in the PRISM shell.

- Navigation

- Revenue

- Sales

These is another layer/module named Infrastructure which provides

CompositePresentationEvent to facilitate interaction between UI modules through EventAggregator

Infrastructure Module defines ModuleLoadingService which is responsible for activation of the selected module by calling IRegion.Activate(object view)

Revenue Module is active in the above snapshot. The above two buttons are part of Navigation module. These buttons are wired to commands and hence they are enable or disabled based on the state of command.

Source code: Download

Grouping in Standard Silverlight DataGrid

2010-02-06T10:04:00.000-08:00

This post presents a sample application to test the Grouping in standard DataGrid that comes with Silverlight 3

Source code: Download

This post makes use of standard class System.Windows.Data.PagedCollectionView

This class represents a view for grouping, sorting, filtering and navigating a paged data collection.

Standard DataGrid that comes with Silverlight 3 can be bound to the data contained in the object of type System.Windows.Data.PagedCollectionView

The class System.Windows.Data.PagedCollectionView

provides many methods to change view based on the group selection.

pagedColletionView.GroupDescriptions.Clear();

pagedColletionView.GroupDescriptions.Add(new PropertyGroupDescription(“ grouping_text”));

As always, as soon as the binding source changes the view of the control changes automatically. The sample code attached with this post does not implements MVVM design pattern however it can be achieved easily.

In the ViewModal (VM) layer a property of type System.Windows.Data.PagedCollectionView can be exposed which in tearn can be bind to the DataGrid.

Command can be defined and bind to grouping facilitaor control to change the Grouping on object of type PagedCollectionView

Source code: Download

Image Gallery in Silverlight using List Box

2010-01-07T23:18:00.000-08:00

This post and sample project available for download explains the implementation of Image Gallery in Silverlight.

A list box can be customized to achieve the Image Gallery having option to view the images in different size based on the selection of view button. In the following post it has been achieved by having multiple data template of items in the list box. The template is assigned at runtime based on the view button selection done by end user.

In addition to that it uses the wrapping of items in the list box in order to display multiple Gallery images in a row. The width of list box is fixed hence it grows in size vertically.

Following different Data Templates has been created to display images in different size

ItemTemplate4byN

ItemTemplate2byN

ItemTemplate1byN

There are three button for three different view of Gallery

private void btn4XN_Click(object sender, RoutedEventArgs e)
{

     galleryListBox.ItemTemplate = (DataTemplate)this.Resources["ItemTemplate4byN"];

     galleryListBox.ItemsSource = itemList;

}

private void btn2XN_Click(object sender, RoutedEventArgs e)

{

        galleryListBox.ItemTemplate = (DataTemplate)this.Resources["ItemTemplate2byN"];

         galleryListBox.ItemsSource = itemList;

}

private void btn1XN_Click(object sender, RoutedEventArgs e)

{

    galleryListBox.ItemTemplate = (DataTemplate)this.Resources["ItemTemplate1byN"];

    galleryListBox.ItemsSource = itemList;

}

< ListBox x:Name="galleryListBox" BorderBrush="Transparent" BorderThickness="0"

          ScrollViewer.HorizontalScrollBarVisibility="Disabled"
          ScrollViewer.VerticalScrollBarVisibility="Visible"     MouseLeftButtonUp="galleryListBox_MouseLeftButtonUp"
     ItemTemplate="{StaticResource ItemTemplate4byN}"   >

< ListBox.Template   >

   < ControlTemplate >

            < Grid >

                  < ScrollViewer BorderThickness="0,0,0,0" >

                              < ItemsPresenter / >

                    < / ScrollViewer >

           < / Grid >

       < / ControlTemplate >

< / ListBox.Template >

< ListBox.ItemsPanel >

         < ItemsPanelTemplate >

           < local:WrapPanel Width="Auto" / >

        < / ItemsPanelTemplate >

< / ListBox.ItemsPanel >

< / ListBox >

Sample project is available for download at following link

Download

Wrapping of items in Silverlight List Box

2010-01-07T22:16:00.000-08:00

Wrapping in Silverlight list box provides much needed way to place multiple items horizontally as well as vertically. It like filling the list box horizontally first before moving to next row. I have a sample application to demonstrate it. Find the download link at the buttom of the post.

< ListBox Height="300" Width="170" >

< ListBox.ItemsPanel >

         < ItemsPanelTemplate >

                    < local:WrapPanel Width="Auto" / >

             < / ItemsPanelTemplate >

< / ListBox.ItemsPanel >

< ListBox.Template >

         <   ControlTemplate >

                    <   Grid >

                               < ScrollViewer   >

                                              < ItemsPresenter   / >

                               < / ScrollViewer >

                         < / Grid >

           < / ControlTemplate >

< / ListBox.Template >

< / ListBox >

public class WrapPanel : Panel

{

               private static readonly DependencyProperty WrapPanelAttachedDataProperty =

                   DependencyProperty.RegisterAttached("WrapPanelAttachedDataProperty", typeof(WrapPanelAttachedData), typeof(WrapPanel), null);

               private readonly List rowHeights = new List();

                     // To maintain the row no. for each item.

                       private readonly Dictionary indexRowMapping = new Dictionary();

                  public double GetOffsetFromTop(int indexOfItem)

                        {

                                double offset = 0;

                                if (!this.indexRowMapping.ContainsKey(indexOfItem))

                                   {

                                                  return 0;

                                    }

                               // Get the row no. for the given item.

                                  int rowNo = this.indexRowMapping[indexOfItem];

                                    // If row no. is 0 then offset would be 0.

                                  if (rowNo == 0)

                                    {

                                                return 0;

                                      }

                                           else

                                            {

                                                 // Add the height of the rows which are before the row of the given element.

                                               for (int index = rowNo - 1; index >= 0; index--)

                                              {

                                                                offset += this.rowHeights[index];

                                                 }

                                   }
                                       return offset;

                    }

                            protected override Size MeasureOverride(Size availableSize)
                            {

                                         foreach (FrameworkElement child in this.Children)

                                               {

                                                       child.Measure(availableSize);

                                                 }

                                     double rowHeight = 0;

                                      int row = 0;

                                                    int elementNo = 0;

                                                    this.rowHeights.Clear();

                                                    this.indexRowMapping.Clear();
                                                   Size desiredSize = Size.Empty;
                                                    Point nextChildPosition = new Point(0, 0);

foreach (FrameworkElement child in this.Children)

{

                  if (nextChildPosition.X + child.DesiredSize.Width > availableSize.Width)

{

           this.rowHeights.Add(rowHeight);

            ++row;
                     nextChildPosition.X = 0;

                    nextChildPosition.Y += rowHeight;

                     rowHeight = 0;
}

// Insert the index of the item and the row no.

this.indexRowMapping.Add(elementNo, row);

elementNo++;

WrapPanelAttachedData data = GetWrapPanelAttachedData(child);

if (data.TargetPosition != nextChildPosition)

{

data.TargetPosition = nextChildPosition;

data.Row = row;

}

desiredSize.Width = Math.Max(desiredSize.Width, nextChildPosition.X + child.DesiredSize.Width);

desiredSize.Height = Math.Max(desiredSize.Height, nextChildPosition.Y + child.DesiredSize.Height);

rowHeight = Math.Max(rowHeight, child.DesiredSize.Height);

nextChildPosition.X += child.DesiredSize.Width;

}

this.rowHeights.Add(rowHeight);

return desiredSize;

}

protected override Size ArrangeOverride(Size finalSize)

{

foreach (UIElement child in this.Children)

{

WrapPanelAttachedData data = GetWrapPanelAttachedData(child);

child.Arrange(new Rect(data.TargetPosition.X, data.TargetPosition.Y, child.DesiredSize.Width, this.rowHeights[data.Row]));

}

return finalSize;

}

private static WrapPanelAttachedData GetWrapPanelAttachedData(DependencyObject obj)

{

object value = obj.GetValue(WrapPanelAttachedDataProperty);

if (value == null)

{

WrapPanelAttachedData data = new WrapPanelAttachedData();

SetAnimatedWrapPanelAttachedData(obj, data);

return data;

}

return (WrapPanelAttachedData)value;

}

private static void SetAnimatedWrapPanelAttachedData(DependencyObject obj, WrapPanelAttachedData value)

{

obj.SetValue(WrapPanelAttachedDataProperty, value);

}

private class WrapPanelAttachedData

{

public static readonly Point Unset = new Point(-1, -1);

public WrapPanelAttachedData()

{

             this.TargetPosition = Unset;

}
                public Point TargetPosition { get; set; }
                public int Row { get; set; }
}

}

A Sample project is available for download at following link

Download

Multiple Template ListBox in Silverlight

2010-01-07T05:40:00.000-08:00

List box can have multiple item templates. If a list need to have items with different behaviour can be achieved using the multiple list box item template. For example you have list of vehicles available for rent. This list can have Cars, Bike etc. Now every different types of vehicle have diffident attributes to be displayed. This requirement can be achieved using the Multi Template List box.

public class LayoutViewListBox : ListBox

{

public static readonly DependencyProperty TemplateSelectorProperty = DependencyProperty.Register("TemplateSelector", typeof(DataTemplateSelector), typeof(LayoutViewListBox), new PropertyMetadata(new PropertyChangedCallback(OnTemplateChanged)));

public DataTemplateSelector ItemTemplateSelector

{

get { return (DataTemplateSelector)this.GetValue(TemplateSelectorProperty); }

set { this.SetValue(TemplateSelectorProperty, value); }

}

protected override void PrepareContainerForItemOverride (DependencyObject element, object item)

{

base.PrepareContainerForItemOverride(element, item);

ListBoxItem listBoxItem = element as ListBoxItem;

if (listBoxItem != null)

{

listBoxItem.ContentTemplate = this.ItemTemplateSelector.SelectTemplate(item, this);

}

private static void OnTemplateChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)

{

}

Create a derived list box class and register a dependency property “TempateSelectorProperty”

public class DataTemplateSelector

{

public virtual DataTemplate SelectTemplate(object item, DependencyObject container)

{

   return null;

}

}

Create a class for DataTemplete selection and provide the implementation for template selection based on the value at runtime data binding.

public class LayoutViewTemplateSelector : DataTemplateSelector

{

   public DataTemplate CarViewTemplate { get; set; }

   public DataTemplate BikeViewTemplate { get; set; }

public override DataTemplate SelectTemplate(object item, DependencyObject container)

{

     if (item != null)

{

if (item is CarViewClass)

{

     return this.CarViewTemplate;

}

if (item is BikeViewClass)

{

    return this.BikeViewTemplate;

}

}

return null;

}

}

Source code can be downloaded at following link
Download

Vivek Kumar

Simplified cover flow to display images

2009-12-24T00:49:00.000-08:00

This post uses the control library named Silverlight Coverflow hosted on codeplex.com
Attached sample project has some local image resources which is bind with the coverflow control.

< c : CoverFlowControl Height="500" Margin="0,30,0,0" x:Name="flowControl" BorderBrush="Green" BorderThickness="1,1,1,1" >

< c:CoverFlowControl.ItemTemplate >

< DataTemplate >

< Image Source="{Binding ImageUrl}" CacheMode="BitmapCache" Height="150" Width="180" / >

< / DataTemplate >

< / c:CoverFlowControl.ItemTemplate >

< / c:CoverFlowControl >

You need to modify the ItemTemplate of CoverFlowControl. In addition to Image, other control can also be included like TextBlock to display the Title or any other information about the image.

These images can be moved like Apple QuickTime movie trailers in this application.

Version detail:

Silverlight 3

Visual Studio 2008

Source code can be downloaded at following link

Download

- Vivek Kumar

Custom Animation in Silverlight Activity Control

2009-12-23T02:06:00.000-08:00

Activity Control (Click for Detail) Provided a much needed way to disable the GUI & indicate the background activity.

Activity Control (Click for post about Activity Control) can be used with most demanding RIA Silverlight application. But the default look and feel may not be suitable for a professional application. I have tried to customize the appearance of Activity Control in the following post. Activity control (Click for Source code of Activity Control) uses a typical ResourceDictionary like any other Silverlight control.

In the Activity Control, I have introduced a WaitDrawingPage.xaml which has definition for wait animation /storyboard.

In place of default progress bar in the generic.xaml of Activity Control, I am hosting the WaitDrawingPage.xaml In the code behind of WaitDrawingPage.xaml the is an event handler LayoutRoot_Loaded () which start the animation by calling Storyboard.Begin() Hence once content of WaitDrawingPage.xaml is loaded animation starts automatically.

Source code can be loaded at following

Download Source Code

List box as a Cover flow control

2009-12-13T06:45:00.000-08:00

This sample explains the customization of ItemTemplate, ItemsPanelTemplate and a custom style for ScrollViewer ScrollViewerStyle

Source code: Download

The list box in the sample uses a wrap panel in the ItemsPanelTemplate so that contents can be wrapped horizontally.

<ListBox.ItemsPanel>

<local:WrapPanel Width="Auto"/>

</ItemsPanelTemplate>

</ListBox.ItemsPanel>

ItemTemplate has been customized to accommodate the Image and other controls.

<ListBox.ItemTemplate>

<StackPanel Orientation="Vertical"

VerticalAlignment="Center"

HorizontalAlignment="Center">

</StackPanel>

</DataTemplate>

</ListBox.ItemTemplate>

Source code: Download

Wait indicator cycling animation in Sliverlight

2009-10-11T03:50:00.000-07:00

Silverlight is based on asynchronous interaction with backend. However there are times when user has to wait for data retrieval from backend system. This is very common situation where user has to wait for data to be loaded or work to be completed in the background. There is a need to provide visual display of background activity.

If the amount of work to be complete in background is small and it completes quickly then may be there is no need to display any special animation to keep user inform about background activity. But its better to provide some kind of animation or suspending the UI interaction till needed background activity completes.

AJAX loader style animation is one of the typical ways to keep user informed about the background activity. In this post I am going to provide a sample silverlight application to emulate AJAX style cycling animation in silverlight.

Sample code is available for download. This application has been developed with Visual Web Developer 2008 Express Edition and Silverlight 3.0 SDK
Download

Next, Previous & Close Button, Left to Right arrow toggling in Bu

2009-09-17T03:43:00.000-07:00

This post has sample application with following silverlight button styles.

Next button

Previous button

Close button

Source code: Download

It has following styles that has been applied on buttons

PreviousButtonStyle

NextButtonStyle

CloseButtonStyle

These styles define values of common properties in addition to the custom ControlTemplate that is responsible for having custom visual tree having desire geometry. These styles are reusable and can be applied to any button.

Left to Right and Right to Left arrow toggling button

Source code: Download

Passing values to Silverlight controls from ASP.NET Hosting page at runtime

2009-07-26T06:26:00.000-07:00

Silverlight control hosted on an ASP.NET web page can be accessed in the code behind using the ID of Silverlight control.

For example the following control.xap has been hosted on the ASP.NET page.

< div style = "height:100%;" >

< asp:Silverlight ID="SilverlightControl"

runat="server"

Source="~ / ClientBin / control.xap"

MinimumVersion="2.0.31005.0"

Width="100%"

Height="100%" / >

< / div >

Now it is required to pass some parameters from ASP.NET page to this silver light control at runtime.

In the page load event handler InitParameters can be initialised with the runtime values of required string values.

// initialize with some value at runtime

string value1 =
string value2 =

string value3 =

string value4 =

// Now silverlight control can be accessed using the ID of the control

this.SilverlightControl.InitParameters = "parameter1=" + value1 + ",parameter2=" + value2 + ",parameter3=" + value3 + ",parameter4=" + time;

SOAP Message Logging in ASP.NET Web Service

2009-05-11T10:06:00.001-07:00

SOAP Extension facilitates creation of very interesting applications on top of the core SOAP architecture provided by .NET. Logging of SOAP request and response messages can be done using the SOAP Extension classes.

Following Two class need to be created

- A class derived from System.Web.Services.Protocols.SoapExtension

- A class derived from System.Web.Services.Protocols.SoacpExtensionAttribute

MSDN version of Trace Extension provides a simplest implementation for Trace Attribute to log SOAP request and response messages. However it has some limitation.

I found TraceExtension on codeplex.com very useful and easy to use. It provides configuration control using Web.config to turn logging on and off.

However its difficult to investigate the problem or bug using this log if multiple sessions or clients are accessing web method simultaneously. There is need of having separate logging file for each session from each IP address. TraceExtension cretes separate file name for logging at runtime.

This can be modified to create file name with session ID and client IP address. Session ID and client IP can be retrieved HttpContext using following properties respectively.

HttpContext.Current.Session.SessionID

HttpContext.Current.Request.UserHostAddress

But It will work only if TraceExtension.cs file is part of the ASP.NET web service project. Otherwise with HttpContext, TraceExtension can not be complied in the separate assembly. This source code file should be placed in the App_Code of the Visual Studio web service poject.

Session specific data handling in ASP.Net Web Services using ThreadStaticAttribute

2009-05-11T09:02:00.000-07:00

Typically ThreadStaticAttribute is used on a static data member in a class to create a separate variable for each thread executing it. ThreadStaticAttribute prevents from sharing the static data member across the threads accessing the class. A static data member with the ThreadStaticAttribute is not shared across the thread accessing it. Each thread accessing it will have a separate copy of the same data member. In this way ThreadStaticAttribute gives the best of both static and instance.

Similar behaviour can be emulated in the ASP.Net Web Service class where web methods execute in session specific threads and static data members are shared across sessions. There may be need to have separate copy of static data members for each session. This can be achieved using ThreadStaticAttribute.

TestService.asmx

[WebService(Namespace = "")]
public class TestService : System.Web.Services.WebService
{

[ThreadStatic]
public static ArrayList list = null;

[WebMethod(EnableSession = true)]
public bool AddToList(string testString)
{
try
{
list.Add(testString);
return true;
}
catch
{
return false;
}
}

[WebMethod(EnableSession = true)]
public string RemoveFromList()
{

return (list[0].ToString());
}

}

Global.asax

void Session_Start(object sender, EventArgs e)
{
// Code that runs when a new session is started

TestService.list = new ArrayList();
}

Run Server Side Java Script on IIS Server

2008-11-11T05:08:00.000-08:00

Web Pages that contain server-side script stored on IIS must be saved with the file extension .asp. The IIS check only pages with .asp extension for server-side script. If server-side script is in the standard .htm or .html file, it will be ignored.

In case of an .asp page, the IIS goes through each line in the page and execute any JavaScript marked for server-side execution before sending the page back to the browser.

If page is just an .html or .htm file, the IIS will simply sent it back to browser without checks for any script that should be run server-side. If a page doesn't contain server-side script, it's best to save it with an .htm or .html extension rather than an .asp extension, otherwise the server will spend processing time checking for server-side script.

Default language for Client-side scripting is JavaScript, While inserting client-side JavaScript, It is not necessary to specify that the script language(However it is reccomended)

In case of server-side scripting in ASP, the default language is VBScript so in order to run server-side Java Script, you must specify the scripting language. In fact it's Jscript, the Microsoft version of JavaScript. Two ways to specify the scripting language:

<> Tags:

< language="JavaScript" runat="server">
// Server-side JavaScript

< /script >

< % and % > Delimiters:

It tells the server which language is used for all server-side script on the current page by adding the following to the very first line of the page:

< %@ language = JavaScript% >

It has been designed to contain the server directives & its effective for page only. Variables in the server side script can be accessed directly to the page by adding following

< %=variable% >

It should be on the top of the page. Once it has been included in the page to add server-side script to the page we simply enclose it in < % and % > which are script delimiters. Server side script is not being hosted in a browser , but is being run by the server and its environment.While writing server-side script, you can't use the window object or the document object or any of the object that the BOM object that a browser makes available; You can use server-related objects and the ASP object model.
Server side script and client side script should be considered as running on separate machines.

Review of free Tools to Measure Web Page Load Time

2008-09-28T00:02:00.000-07:00

There are few free tools to measure the Web Page load time. From web page optimization point of view the load time of individual components is very important.

Web Inspector of Safari Browser
Safari Browser provides excellent support for mesurement of loading time. It provides sufficent data about loading of individual page ememnets.It provides details about the manner in which web pages are delivered to web browsers.These details includes the timing, size and identity of each item in a page.

The Develop menu should be enabled in order to run Web Inspector of Safari Browser.

These data can be used to isolate problems and improve performance and user satisfaction.It provides ways to inspact indiviual page elements. It has very friendly and attractive GUI.
Shortcoming:
Web Inspector does not provides way to generate log. Data captured by Web Inspector can not be saved automatically.

IBM Page Detailer Basic Version
One of the best tool to measure the loading time, size and order of individual components of a web page. It provides data both graphical and tabular views, clearly showing how the page was delivered to the browser.

Shortcoming:
Data generated from this tool can not be saved automatically. Basic version of tool does not provides text log to save data.

Firefox Add-on : Load Time Analyzer 1.5
Facilitates measurement of web page load time Graphical representation of occurrence of events such as requests for the page, images,scripts and other page elements. It Works with Firefox version 1.5 & 2.0 but does not works with firefox 3.0

Firefox Add-on : Extended Statusbar 1.5.3
It is a Status bar to display current speed, time and loaded size. It does not provides measurement of individual page elements.It has no advantage over other tools.

Review of free C#.NET Library to parse HTML

2008-09-26T21:46:00.001-07:00

It was a hot morning and I was browsing around for some cool stuff to parse the HTML files from C#.Net application. Problem was complex and my requirement was to be able to modify HTML file from C#.Net application. I found many articles, free source code and lot of idea about how to develop such library.

As always, your responsibilities never allow you to do what you love most. My case was no different. After quick search and analysis on available text and comments from other visitors, I zeroed on two C#.Net libraries. First one was HtmlLegacyParser and another one was Html Agility Pack.

HTML that has many versions, multiple tools and techniques to work with presents lot of challenges, when it comes to parse, validate modify programmatically.

Dealing with malfunctioned HTML and not throwing error message was my one of the requirement and this is where I found Html Agility Pack a better tool to work with.

Html Agility Pack provides sufficient scope for developing application on the top of it without any significant exercise around it. Most of the application developers working around XML are familiar with XPath queries. An XPath query provides a very flexible way to work with DOM. You are done if you know XPath query statements and looking for similar application development for HTML.

Html Agility Pack: Wonderful C#.Net library to parse agile HTML
It’s a C#.Net code that allows user to parse HTML files. It emulates object model provided with System.Xml
Download link for Html Agility Pack
It can be used to fix the page. It provides very flexible DOM that can parse with a bunch of XPath queries. It has not other dependency except standard .Net framework. Library is tolerant to badly structured agile HTML pages. Some typical example can be removing comments from HTML document, scanning and fixing img/src or a/hrefs with a bunch of XPath queries.

Code Project: HtmlLegacyParser

It’s a C#.NET windows application that has a class library to parse source code. This class library uses C5 Generic Collection library which is not provided and must me downloaded and complied separately.
This application is intended to be used with HTML content retrieved by the .NET WebResponse class. The class library that comes with this application provides rich tag based parsing classes. Class library comes with NUnit testing script.

Disadvantage: It has a dependency on C5 Generic Collection library. Unlike HTML Agility Pack, It does not provide XML DOM model and XPath queries.

ASP.NET : Managing Configration Data Programmatically

2008-06-25T05:52:00.001-07:00

Mistake

How to debug JavaScript in IE

2008-06-25T05:50:00.000-07:00

mistake

Web Page Development: Best Practices

2008-06-20T03:01:00.001-07:00

Mistake

Java script client for SOAP based Web Services

2008-06-20T03:00:00.000-07:00

mistake

The XMLHttpRequest object for AJAX

2008-06-20T02:58:00.000-07:00

Mistake TO be removed

Creating Windows Service in .NET

2008-06-11T04:14:00.000-07:00

Mistake

Connection oriented protocol versus Web Services

2008-06-03T23:04:00.000-07:00

Mistake TO Be removed