Joymon's world of WPF

WPF 4.5 New features

noreply@blogger.com (Joy George) — Sun, 18 Sep 2011 16:42:00 +0000

http://msdn.microsoft.com/en-us/library/bb613588(v=vs.110).aspx

Its sad to say that,I can't find much interesting features.

How dependency property internally works? A MUST read for WPF and Silverlight developers

noreply@blogger.com (Joy George) — Mon, 08 Aug 2011 08:18:00 +0000

A good article which I though of writing when I started WPF. This describes how dependency property concept is implemented on top of .Net 2.0 framework without even adding a .net language keyword.

http://www.abhisheksur.com/2011/07/internals-of-dependency-property-in-wpf.html

A MUST read for WPF and Silverlight developers before they actually write code for clients.

Open source WPFInspector

noreply@blogger.com (Joy George) — Sun, 20 Mar 2011 17:29:00 +0000

Another Snoop like debugging tool for WPF.But this is useful to debug and inspect DataContext,Resources,Triggers & Styles.

I don’t want to compare this with Snoop.Check it out yourself !!!

http://wpfinspector.codeplex.com

Technology v/s Concepts and architecture

noreply@blogger.com (Joy George) — Mon, 06 Dec 2010 05:17:00 +0000

First of all this is not a WPF technology post.I posted this in my WPF blog since it has some relation with WPF.ok let’s start.

Technology here means the implementation languages or mediums for a programming solution such as WPF, Silverlight, Linq,WCF etc…While taking interviews, I have often heard that “I can learn or work in any technology since I know concepts and architecture”.Mostly this is the answer from a candidate when we ask “Do you know WPF or are you able to work in Silverlight?”. Some of my friends,they don’t even ready to rate themselves in the technology.If we ask them how do you rate yourself in WPF out of 10? they will say I am strong in concepts so I can do whatever work assigned to me in WPF.

If we think from an entrepreneur perspective this cannot be accepted every time.A person cannot estimate the work in WPF without the knowledge in WPF whatever strong he is in programming concepts and architectures.Also if the work in WPF or Silverlight is critical companies cannot rely on the statement “I know concepts and architecture”.Lets take one example to prove this.

The driver selection story

You are working in Cochin and on a Friday your CEO decided to go Chennai to attend an important meeting on Saturday.There are no tickets in flights and trains since the trip is decided suddenly.So he decided to go by his new highly sophisticated BMW car.He needs some body with him to drive the whole 700 kilometers since he need to attend the meeting with freshness.

There are 5 persons who are free in the week end and ready to accompany CEO.The first person, lets call him A said I have license but have no experience.Person B said I have license and have experience in riding motor cycle.Person C said I had driven my father’s truck.Person D said I have my own car which I am usually driving to come office.But its a 10 year old model.Person E said my uncle owns the same BMW model of yours and I usually drive it in the week ends and holidays.Who will accompany your CEO? obviously person E provided your CEO is smart :)

The case of Person A can be compared like a network guy saying I can do WPF.Person B is like a assembly language programmer saying I can do the WPF without training since I know basics an experience in programming.The case C can be compared as a Java programmer applying for WPF job saying that I am strong in OOPS.The D is like a .Net 1.0 programmer saying I can do WPF since all are .Net.E is the real one who knows WPF.Persons A,B,C & D can do the job provided they get certain time to familiarize the new car and its features.But since the time is limited nobody can be considered for the position.

Do I need to give more importance on technology?

The technology is getting importance over architecture depends on the situation or the demand.If we think from employer perspective ,he needs a technology guy if the work in particular technology is so critical and should be done in time.He don’t have time to give training to the guy he hires. If the requirement is for future project, the choice should give to the guys who are strong in concepts and architecture.Again that depends on the available time.If a WPF project is supposed to come on next month ,.Net guys can be hired and they can get training in WPF.If the time gap is 2 months JAVA or even assembly programming guys can also be included.

Coming to the developer perspective ,he should find some time to the technology as well while learning the architecture.Also while learning technology, learn the technology by comparing with the previous one.Main important thing to consider is “why I should learn a new technology ?”.I know some of my friends doing WPF /Silverlight projects without using data binding.Also they are simply creating controls when and where needed without changing templates.I asked why are you using this technology ? They simply replied “My company/client wants this project to be done in WPF”.

The moral of the story is “Learn technology before architecting your application and get benefits from it’s features”.

Common Code Base 3 handling controls

noreply@blogger.com (Joy George) — Sun, 08 Aug 2010 16:41:00 +0000

Another issue you are going to face is the namespace and assembly differences of classes in WPF and Silverlight.Especially you will find when dealing with controls.ie the classes will be there with same methods and properties.But in different namespaces or assemblies .That prevent us from having common code base.

Lets just consider the case of TreeView in System.Windows.Controls namespace which is present in both WPF and Silverlight.In WPF it is in the assembly PresentationFramework.dll but in Silverlight its System.Windows.Controls.dll. Ideally the schema mapping should do the correct mapping and we should be able to use the xaml. But unfortunately it is not mapped to the schema.Means if we use common xaml file for tree view it will show a compilation error in Silverlight.

The tag 'TreeView' does not exist in XML namespace 'http://schemas.microsoft.com/winfx/2006/xaml/presentation'.

Does this indicate we should stop common code? Not at all.We have one solution which uses inheritance as a hack.I didn’t even think, inheritance will have such a usage.Solution is as follows.

Create your own class for TreeView by inheriting the framework TreeView.Have this linked to WPF too.
Use your treeview throughout the application.

Public Class CCBTreeView
    Inherits System.Windows.Controls.TreeView
End Class

CCBTreeView would be in your controls project which refers PresentationFramework.dll and System.Windows.Controls.dll in WPF and Silverlight respectively. While using, use as follows.

<UserControl x:Class="TestCompatibility.MyControl"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:CCBControls="clr-namespace:CCB.Controls;assembly=CCB.Controls">
<CCBControls:CCBTreeView ItemsSource="{Binding Persons}" />
</UserControl>

This applies to so many controls such as HierarchicalDataTemplate,TabControl etc which differs in namespace or assembly.Refer the sample uploaded here if you still have confusion.Also let me know if anybody have better solution to this problem.

Previous posts on Common Code Base

----------------------------------------------

Common Code Base 1 Introduction

Common Code Base 2 Styles and Templates

Debugging WPF and Silverlight DataBinding

noreply@blogger.com (Joy George) — Sat, 07 Aug 2010 11:37:00 +0000

Good article about debugging data binding in WPF and silverlight.

http://blogs.msdn.com/b/wpfsldesigner/archive/2010/06/30/debugging-data-bindings-in-a-wpf-or-silverlight-application.aspx

In short we can debug databinding in 2 ways

Looking at the output/immediate window.
Using converters.
Putting break points in get and set regions of properties

Common Code Base 2 Styles and Templates

noreply@blogger.com (Joy George) — Sat, 03 Jul 2010 18:50:00 +0000

As everybody knows Silverlight doesn’t support the Triggers which are most common in WPF.That means we cannot use WPF styles as it is.So obviously we need to create new styles even for Silverlight 4 which are same in behavior but using different xaml.Below are the best practices which we can follow to tackle the styles and templates in Common Code Base scenario.

Don’t write any inline styles.Use resource dictionaries.
Merge the resource dictionaries at the application level only.

This will solve the issue with basic styles.Think of a scenario where you are loading the styles dynamically.In WPF you can handle this using DynamicResource binding extension.But the sad thing is Silverlight doesn’t support DynamicResource. So what is the solution.
The solution which we applied was very easy.Use StaticResource in the XAML files and load the styles through code in the App.xaml.vb file.Yes it worked in WPF too.
Download sample from here to see the styles and templates in action in CCB.(See the foreground of Button.Its coming through Style)

Previous posts on Common Code Base
----------------------------------
Common Code Base 1 Introduction

Calling WCF service without AddReference

noreply@blogger.com (Joy George) — Thu, 17 Jun 2010 07:37:00 +0000

One of my Silverlight blog post is about creating a proxy without using the add reference menu in the Visual studio.The solution there is to write all the code which is auto generated when we add the reference through the proxy.ie we are just avoiding the auto generation and writing ourselves.Not a good solution.The reason we need to write all is because Silverlight supports only the Async service calls.But if we consider WPF we can call the service in Sync way.That means we can try out new things which will reduce our works in creating the manual proxy.

Didn’t get anything? In short we are going to create a proxy and call service without using the Add Service Reference menu or the any of the tool (eg:svcutil)available for generating the proxy.How can we achieve that.It’s simple .Share the contract dll.Important thing here is the sharing of contract dll is possible only because WPF and the WCF is using the same framework and runtime.This will not be possible in case of Silverlight since the runtime is different.

Ok.Lets start.We need 3 projects mainly.One is the Contracts where we keep all the WCF contracts.Then a service host project and a consumer of services.In the attached sample the host is a web host and the consumer is a WPF application.We can also host the WCF service in ConsoleHost.But in that case we need to solutions.Thats why I decided to go with WebHost.Below is solution structure.

Note that there is no ServiceReference in the WPF UI project.Only thing is the reference to Core project which contains all the contracts.App.Config should be same as of normal proxy creation in case you want to use default connection settings.All the magic happens inside the ServiceProxy class which is inheriting the ClientBase with a generic class.It will be clear after seeing the code below.

Imports System.ServiceModel
Imports ManualProxyTest.Core
Public Class ServiceProxy
    Inherits ClientBase(Of IMyService)
    Implements IMyService
    Public Function GetData(ByVal value As Integer) As String Implements IMyService.GetData
        Return Me.Channel.GetData(value)
    End Function
    Public Function Divide(ByVal no1 As Integer, ByVal no2 As Integer) As Double Implements IMyService.Divide
        Return Me.Channel.Divide(no1, no2)
    End Function
    Public Function GetChar(ByVal data As String, ByVal position As Integer) As Char Implements IMyService.GetChar
        Return Me.Channel.GetChar(data, position)
    End Function
End Class

For calling the service just create the instance of ServiceProxy and call as usual.Main advantage is the cleanliness in the code and we will have full control over the code.Sample can be downloaded from here.

Common Code Base 1 Introduction

noreply@blogger.com (Joy George) — Sat, 12 Jun 2010 09:46:00 +0000

The thoughts on common code base or single code base for both desktop applications and internet applications has been started with introduction of C# in Silverlight 2. That brought not only the same design and coding languages into WPF and Silverlight but also the same APIs.

Same coding language was used earlier too.It was for Windows forms and ASP.Net.Even we were able to share the assemblies among them.But we were not able to create same application layer for them since the APIs and the design mediums were different.As time evolves Microsoft introduced the concept of XAML and made almost all the APIs same.

As everybody knows still Silverlight is the subset of WPF even in its 4th version.There are so many classes and members missing in Silverlight if we compare with the WPF equivalent.Does that means we cannot go for the common code base?

No.We can go for the approach of common code base as of now.But you cannot have certain WPF specific features in your application.Do your client allows that ? absolutely not.So we need to tackle that situation by providing WPF specific features in the desktop release.That means the road to the single code base is not that much easy as you think. So what is the simpe solution?

The solution is very easy.Develop your application against Silverlight excluding Silverlight specific features such as DeepZoom and compile the same code for WPF.It should work.I am saying this should work because most of the Silverlight classes and their members are available in WPF as same.

This will work if you are developing a simple application without WPF specific features.If you want to use WPF specific features you need to architect your application in such a way that it is following MVVm strictly.MVVm will allow you to switch the views very easily without changing the underlying layers.

Solution structure.

Develop against Silverlight then it will work in WPF. We need to remember this thing while creating the visual studio solution structure.So first create the Silverlight projects and keep the code and xaml files there.Then create WPF projects and link the files from Silverlight project location.Easy..What ever feature you implement in Silverlight or the fixes you do will reflect in WPF application too.

Look at the files MyControl.xaml and MyViewModel.They are real files in the Online solution and linked in Desktop project.

Issues

First issue you may encounter is XAML incompatibility.In WPF when we create a xaml style you normally specify as x:Type Classname.But this x:Type is not at all supported in Silverlight. Silverlight needs just the class name without x:Type .If you look at some of the controls like TreeView ,In WPF this resides in the PresentationFramework dll but in Silverlight it is in System.Windows.Controls.dll so we cannot have same xaml shared between WPF and Silverlight projects.There are so many issues like this.Will discuss about one by one in subsequent posts to make the real common code base.

WPF 3.5 Bug in inheriting DataTemplate

noreply@blogger.com (Joy George) — Sun, 06 Jun 2010 10:41:00 +0000

You can easily reproduce the bug.Just inherit the DataTemplate and use the new DataTemplate class instead of default.You will get an runtime exception.

Your DataTemplate class

public class MyDataTemplate :DataTemplate
{
}

Nothing unusual rite? Then use this DataTemplate in your XAML.

<ListBox x:Name="lstPersons" >
    <ListBox.ItemTemplate>
        <local:MyDataTemplate >
            <StackPanel>
                <Button Content="{Binding Name}" />
            </StackPanel>
        </local:MyDataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

Just using the new class.But when we run this we get the exception as follows.

StackPanel' object cannot be added to 'MyDataTemplate'. Object of type 'System.Windows.Controls.StackPanel' cannot be converted to type 'System.Windows.FrameworkElementFactory.

This is true same in the case of HierarchicalDataTemplate too.

This is an identified bug.Microsoft has fixed this and WPF 4 contains the fix.

Getting ListBoxItem from selected entity

noreply@blogger.com (Joy George) — Fri, 09 Apr 2010 13:34:00 +0000

There will be some scenarios where we need to get the object of ListBoxItem which is hosting one of the the bound entity.Most probably it may be the SelectedItem.

Consider this scenario there is an business class called Employee and it’s collection class is EmployeeCollection.We have binding which binds object of EmployeeCollection to a ListBox.If we access the SelectedItem property of ListBox it will return the Employee object.But the requirement is to get the ListBoxItem which hosts the selected entity on an event say SelectionChanged.

Dim lbi As ListBoxItem = lstBox.ItemContainerGenerator.ContainerFromItem(lstBox.SelectedItem)

The above code can be used to get ListBoxItem of any object which is present in the collection.

Why WPF ProgressBar is not updating

noreply@blogger.com (Joy George) — Wed, 07 Apr 2010 13:31:00 +0000

When you put a loop and try to update the ProgressBar from that loop, it will not update the visual.The visual will update only after the execution of the loop.ie you can’t see the incremental animation.Here is the solution for that issue.

Private Sub btn_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)
    IncrementContinuously()
End Sub
Sub IncrementContinuously()
    For i = 0 To 50
        Thread.Sleep(100)
        prgs.Dispatcher.Invoke(New CrossAppDomainDelegate(AddressOf IncrementBy1), DispatcherPriority.Background, Nothing)
    Next
End Sub
Sub IncrementBy1()
    prgs.Value = prgs.Value + 1
End Sub

This link contains some more solutions.

MCTS in WPF

noreply@blogger.com (Joy George) — Tue, 09 Mar 2010 14:24:00 +0000

It was my great ambition to clear WPF exam and became a MCTS from the day I started developing in WPF.Yesterday I achieved that.After getting the certification I was just thinking what are the benefits of taking such a certification? Even one of my colleague asked me what you are going to earn by writing these exams? Is it just because company is paying me the fees?

Absolutely no.There are some benefits as a developer.One is “We will get full coverage of WPF”.Second we gets some sort of “recognition in the community” .Third ,we can have the MCTS logo in our resume.The last benefit is our certification will help our company to get or retain partnership with Microsoft.

I don’t care about the last 3 points .Normally people does certification for that.If you elaborate the first point we can see the real benefit of certification.The coverage I meant is about the different areas in WPF.The certification includes all most all areas of WPF including 3D. Even if a person is working in WPF from the beginning, the chance for him to work in 3D is very less.That means he may know anything about 3D programming which is a great feature in WPF.By going for certification he needs to have a little knowledge about 3D programming in WPF using ViewPort3D,Camera etc…

Even I learnt different usages of documents only because of the preparation for the MCTS Exam.So try to get certified in the technology and move smoothly in the fast moving tech world.

Type safe INotifyPropertyChanged

noreply@blogger.com (Joy George) — Mon, 01 Feb 2010 13:35:00 +0000

Usually we pass the property name as string from the setter of properties and raise the INotifyPropertyChanged.PropertyChanged event.This is not type safe as you.There are chances that the end developers may misspell the property name.The below link gives a great idea to make your OnPropertyChanged calls type safe.

http://mfelicio.wordpress.com/2010/01/10/safe-usage-of-inotifypropertychanged-in-mvvm-scenarios/

New WPF and XAML features

noreply@blogger.com (Joy George) — Tue, 08 Dec 2009 14:00:00 +0000

For those who didn’t try the new features yet.

http://blogs.msdn.com/llobo/archive/2009/11/25/concluding-new-wpf-features-series.aspx
http://blogs.msdn.com/llobo/archive/2009/11/19/xaml-2009-features-generics-support.aspx

Using Lambda expression in XAML databinding

noreply@blogger.com (Joy George) — Thu, 01 Oct 2009 16:12:00 +0000

When I was in net last week end the below links took my attention.The reason was they explain how can we give lambda expressions in XAML.As a developer you might also wonder how the author did that.
It is by creating a custom markup extension and constructing lambda expressions on the fly.

Thanks to M. Orçun Topdağı for such a smart solution.I need to find out another way to implement this in my current project as that is in Silverlight and Silverlight does't support custom mark-up extensions.

Auto formatting XAML code

noreply@blogger.com (Joy George) — Wed, 23 Sep 2009 12:02:00 +0000

Here is one way to format our XAML code in a neat way.In VisualStudio open the Options dialog. Tools->Options.

Goto TextEditor->XAML->Formatting->Spacing and set the options as per the below image.

Set it as XAML coding practice and do a smooth code review...

Understanding WPF ResourceDictionary

noreply@blogger.com (Joy George) — Sat, 19 Sep 2009 11:22:00 +0000

When I did a WPF training to .net 2.0 audience, it took some more time to explain the concept of Resource dictionaries.The were all familiar to the resource concept in .net and were trying to relate this to the resource files.
What is ResourceDictionary in WPF

WPF resource dictionary is just a collection of objects which are accessible by their corresponding key.

The objects here means anything which are derived from System.Object.Including integers, strings and controls like TextBlock and Buttons. Normally people thinks that ResourceDictionary is something which is related to Window, Styles & Templates.The problem is that we normally use ResourceDictionary along with Styles and Templates.See a simple sample below.

<Window x:Class="Window1"        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"        xmlns:sys="clr-namespace:System;assembly=mscorlib"        Title="Window1">    <Window.Resources>        <sys:Byte x:Key="day">18</sys:Byte>        <sys:String x:Key="month">Apr</sys:String>        <sys:Int32 x:Key="year">1984</sys:Int32>        <TextBlock x:Key="monthtxt"                   Text="{StaticResource month}" />        <sys:Double x:Key="fontsize">14</sys:Double>    </Window.Resources>    <StackPanel Orientation="Horizontal">        <TextBlock FontSize="{StaticResource fontsize}"                   Text="My DOB :" />        <ContentControl  Content="{StaticResource day}" />        <ContentControl Content="{StaticResource monthtxt}" />        <ContentControl Content="{StaticResource year}" />    </StackPanel ></Window>

Note that the integer and string are from mscorlib.

Who all can have ResourceDictionary
In simple words who has a property of type ResourceDictionary can hold resources. Here the Resources property defined in one of the base classes called FrameworkElement. Most of the WPF elements are inherited from FrameworkElement and hence they can hold resources.

Accessing objects in ResourceDictionary
There are mainly 2 ways to get objects from ResourceDictionary.One is through XAML with mark-up extension and other through code.The above code shows how to retrieve through the StaticResource markup extension.Another method is through the tag <StaticResource>

<Window x:Class="Window1"        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"        xmlns:sys="clr-namespace:System;assembly=mscorlib">    <Window.Resources>        <sys:String x:Key="fullname">Joy George K</sys:String>        <TextBlock x:Key="nametxt"                   Text="{StaticResource fullname}" />    </Window.Resources>    <StackPanel Orientation="Horizontal">        <TextBlock Text="FullName :" />        <StaticResource ResourceKey="nametxt" />    </StackPanel ></Window>

Accessing from Code

Dim fullname As String = Me.FindResource("fullname")If Not String.IsNullOrEmpty(fullname) Then    MessageBox.Show("My FullName :" & fullname)End If

My current project is in VB.Net and that is why you are seeing vb code instead of C# :-)

Merged ResourceDictionaries

Now one question comes.I have so many resources in ResourceDictionary such as Brushes, ControlTemplates and Styles.Can I categorize these in to separate files and merge them like CSS ?

Yes.It is possible by using Merged ResourceDictionaries.Add ResourceDictionary files by following the steps below and merge them at your Window or Application level.

Right click on the project -> Add -> ResourceDictionary

The below code show how to merge the ResourceDictionaries into your Window.xaml

<Window x:Class="Window1"        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"        xmlns:sys="clr-namespace:System;assembly=mscorlib">    <Window.Resources>        <ResourceDictionary>            <ResourceDictionary.MergedDictionaries>                <ResourceDictionary Source="brushes.xaml" />            </ResourceDictionary.MergedDictionaries>        </ResourceDictionary>    </Window.Resources>        <StackPanel Orientation="Horizontal">        <TextBlock Text="FullName : Joy George K"                   Background="{StaticResource background}" />    </StackPanel ></Window>

Static & Dynamic ResourceDictionaries
We have seen the resources are being accessed by a mark-up extension StaticResource. Normally one question comes into our mind as a developer.Is there something called DynamicResource?
Yes.There exists DynamicResource mark-up extension too.Then what are the differences?
The main difference between Static and Dynamic resource mark-up extensions is the value calculation.In StaticResource it is done only once.But in DynamicResource it is done when ever the value of the resource changes.
I know it is difficult to understand.First question will be how to change the value of resource ? Simple .Its by code.
Lets take one example.There is a Brush resource in ResourceDictionary with color white and key backBrush.We have used this brush to give background to 2 StackPanels.One is by StaticResource and another is by DynamicResource mark-up extension.
It will work fine.When we run the application both these StackPanels will have white as background.Now suppose if I change the value of backBrush resource to Red through code what will happen? The answer is .The StackPanel which used DynamicResource will get the Red color and the other will be still in white.Hope this clears.

Refer this sample if you are still in confusion.

WPF Training at Orion

noreply@blogger.com (Joy George) — Fri, 31 Jul 2009 19:01:00 +0000

I have seen so many times Jim Mangaly giving nice presentations and trainings, when I was working in Identitymine.As a Software engg I never thought that I have to take WPF sessions.

But the earth didn't stop it's rotations.It became weeks,weeks became months and months became years.After 2 years I joined in Orion Inc and at a fine noon ,I was asked to present a WPF session.

Initially I was in big confusion "How to present the new features in WPF ?" It is very easy to work with.But very difficult to make others understand these new features.I had 1 hour left with me to prepare.It is not enough to prepare even about XAML.But I have to convey what is xaml.My audience is from .Net2.0 so finally I decided to present WPF features by relating the drawbacks of .Net 2.0 windows forms, and coresponding solutions in WPF.See some examples below.

Windows forms developer has to get design(in some format like jpg) from designer and implement himself.This eats a good amount developer's precious time and the work is repetition.WPF has a solution which is called XAML to solve this problem.
In Windows forms if someone needs to replace a digital clock control by analog clock he has to create a new control and override it's OnPaint method.But WPF provides a mechanism called templating which does this in a shorter time.
Rotating a button in Windows forms is a 'Job'.But in WPF its a matter of 3 lines of code which specifies a RotateTransform.

Yes.This did the trick.At least they got some words like "XAML","Template","Transform","Styles" etc... which are going to make their life easier in the WPF world.The feedback was good and I decided to continue giving detailed sessions on WPF.2 sessions are over as of now and hope I can complete the other sessions soon...

Different styles for alternate rows in ListBox

noreply@blogger.com (Joy George) — Sun, 12 Jul 2009 17:55:00 +0000

Simple but important feature which really help us in real-time applications.Giving different look and feel or colors to alternate rows helps users to differentiate two consecutive rows in a ListBox or ListView.Basically controls which are derived from ItemsControl.

Below xaml code shows how alternate colors are applied into a ListBox

Xaml code to create ListBox with 6 items

<ListBox AlternationCount="2">    <ListBoxItem Content="Item1" />    <ListBoxItem Content="Item2" />    <ListBoxItem Content="Item3" />    <ListBoxItem Content="Item4" />    <ListBoxItem Content="Item5" />    <ListBoxItem Content="Item6" /></ListBox>

Xaml code of the Style which has the alternate style support.Note the change is in the ItemContainerStyle.Here Style is applied to ListBoxItem

<Style  TargetType="{x:Type ListBoxItem}">    <Style.Triggers>        <Trigger Property="ItemsControl.AlternationIndex"                 Value="0">            <Setter Property="Background"                    Value="LightBlue"></Setter>        </Trigger>        <Trigger Property="ItemsControl.AlternationIndex"                 Value="1">            <Setter Property="Background"                    Value="LightGreen"></Setter>        </Trigger>    </Style.Triggers></Style>

When we run it shows as follows

Description

Here the ItemsControl has got most of the implementation part.It has some members which control the behavior of alternate style.The attached property ItemsControl.AlternationIndex tells the index and according to that we can change color or anything through style.

The Alternation count specifies the frequency.Below code uses 3 as ItemsControl.AlternationCount.See the difference.

Creating ListBox

<ListBox AlternationCount="3">    <ListBoxItem Content="Item1" />    <ListBoxItem Content="Item2" />    <ListBoxItem Content="Item3" />    <ListBoxItem Content="Item4" />    <ListBoxItem Content="Item5" />    <ListBoxItem Content="Item6" /></ListBox>

Style supports AlternationCount=3

<Style  TargetType="{x:Type ListBoxItem}">    <Style.Triggers>        <Trigger Property="ItemsControl.AlternationIndex"                 Value="0">            <Setter Property="Background"                    Value="LightBlue"></Setter>        </Trigger>        <Trigger Property="ItemsControl.AlternationIndex"                 Value="1">            <Setter Property="Background"                    Value="LightGreen"></Setter>        </Trigger>        <Trigger Property="ItemsControl.AlternationIndex"                 Value="2">            <Setter Property="Background"                    Value="LightYellow"></Setter>        </Trigger>    </Style.Triggers></Style>

I don't think a sample is needed.

Deploying applications in Microsoft Surface SP1

noreply@blogger.com (Joy George) — Tue, 09 Jun 2009 10:28:00 +0000

The surface has a launcher application which is launching applications registered with the Surface Shell.Launcher can be activated from any of the 4 access points located at corners of surface.

Registering Microsoft Surface Application
To register an application with Microsoft surface shell we have to copy the application’s xml definitions file into the %PROGRAMDATA%\Microsoft\Surface\Programs folder.This is the folder where surface looks for application definitions.It maintains a list of applications listed here to load on demand by launcher.

Application’s definition file is a simple xml file which describes the application.Common elements included in the definition are

Title : Title of the application
Description:Description about application
Executable: Path to exe.Path need to be absolute.
IconImageFile:Icon of application.
Preview: Preview images

A sample xml file

<?xml version="1.0" encoding="utf-8" ?>
<ss:ApplicationInfo
 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 xmlns:ss="http://schemas.microsoft.com/Surface/2007/ApplicationMetadata">
  <Application>
    <Title>Test Surface App</Title>
    <Description>This is a test Surface application.</Description>
    <ExecutableFile>%ProgramData%\Microsoft\Surface\Programs\SurfaceApplication1.exe</ExecutableFile>
    <Arguments></Arguments>
    <IconImageFile>%ProgramData%\Microsoft\Surface\Programs\Resources\icon.png</IconImageFile>
    <Preview>
      <PreviewImageFile>%ProgramData%\Microsoft\Surface\Programs\Resources\iconPreview.png</PreviewImageFile>
    </Preview>
  </Application>
</ss:ApplicationInfo>

Changing the Orientation or Surface application

noreply@blogger.com (Joy George) — Sat, 30 May 2009 12:53:00 +0000

Surface supports orientation of applications to 2 sides according to the seating position of the user.If we are developing applications we have to rotate our applications our self.Its done by checking the static property Microsoft.Surface.ApplicationLauncher.Orientation.
There is an event called Microsoft.Surface.ApplicationLauncher.OrientationChanged which fires when the user changes his side by clicking on the access buttons at the corresponding side.

Setting the Orientation
We need to have a RotateTransform in our application whose Angle ,we are going to change according to the Orientation.Normally we place the RotateTransform in the root element of the SurfaceWindow.

<s:SurfaceWindow x:Class="SurfaceApplication1.SurfaceWindow1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:s="http://schemas.microsoft.com/surface/2008"
    Title="SurfaceApplication1">
  <Grid Name="MenuGrid">
    <Grid.LayoutTransform>
      <RotateTransform x:Name="OrientationTransform" Angle="0"/>
    </Grid.LayoutTransform>
    <TextBlock Name="OrientationTextBox" HorizontalAlignment="Center"/>
   </Grid>
</s:SurfaceWindow>

Subscribe to the ApplicationLauncher.OrientationChanged event and set the Angle as per the ApplicationLauncher.Orientation property.

private void AddActivationHandlers()
{
    // Subscribe to surface application activation events
    ApplicationLauncher.ApplicationActivated += OnApplicationActivated;
    ApplicationLauncher.ApplicationPreviewed += OnApplicationPreviewed;
    ApplicationLauncher.ApplicationDeactivated += OnApplicationDeactivated;
    ApplicationLauncher.OrientationChanged += ApplicationLauncher_OrientationChanged;
}
void ApplicationLauncher_OrientationChanged(object sender, OrientationChangedEventArgs e)
{
    OrientationTransform.Angle = ApplicationLauncher.Orientation == UserOrientation.Top ? 180 : 0;
    OrientationTextBox.Text = ApplicationLauncher.Orientation.ToString();
}

Using Triggers to change the Orientation or Surface application based on ApplicationLauncher.Orientation.

Its clear like water that we can’t use EventTrigger to set the Angle of Transform.Another method is PropertyTrigger.Since the ApplicationLauncher.Orientation is not an AttachedProperty we can’t use that method too.Simply saying we have to write code in order to achieve.I am searching for a method which does the same using xaml alone.If anybody finds,please share with me.

Generating and Printing Surface IdentityTag

noreply@blogger.com (Joy George) — Sun, 24 May 2009 06:58:00 +0000

Tags support is the most important feature in Microsoft Surface.Tags enable our application to recognize objects through surface.As you know there are 2 types of tags.Byte tag and identity tag.So before placing objects on the surface to recognize we have to print the tag and stick on the bottom part of the object.Then only surface can identify the tag value through its infrared sensing mechanism.There are 3 ways to visualize the tags.One is using the command line tool GenTag.exe and another using it’s visual tool GenTagUI.exe and last using our own programs which make use of the class IdentityTagGenerator

Using IdentityTag Image Generator
Tool is located at

[Install drive]:\Program Files\Microsoft SDKs\Surface\v1.0\Tools\GenTag\GenTag.exe

Syntax :
GenTag.exe <Series> <Value> <FileName.png> [/dpi:number]

Value and Series are in Hex.This tool outputs the tag as png image.Later we can print that image.Dots Per Inch (dpi) is optional.

Using IdentityTag printing tool
Surface now includes a tool in it’s sdk which helps us to generate and print IdentityTags.You can locate the program in start menu itself

Programs->Microsoft Surface sdk 1.0 sp1->Tools->Identity Tag Printing Tool

or in the location

[Install drive]:\Program Files\Microsoft SDKs\Surface\v1.0\Tools\GenTag\GenTagUI.exe

There is nothing to explain about using the tool I think.Try yourself.

Using IdentityTagGenerator class
Microsoft has provided API to visualize the tags and later we can save or print them.The entry to tag visualization API is IdentityTagGenerator.That class contains 2 static methods for getting tag in it’s actual form.

Image GenerateTag(long series,long value) : As its signature implies, it returns the tag image according to parameters series and value.There is an overload available which takes dpi as parameter and returns image according to that.
RenderTag(long series,long value,Point point,Graphics g) :Draws identity tag on the Graphics object.Mainly targeted to be used in Windows forms applications.Also this helps in distributing tags through asp.net applications.

In the first method we can set the returned Image object as source of image control in our application.The second method uses Graphics object and that is available in OnPaint methods or we can create it using the Graphics class.

The usage is straight forward.Seems there is no need to post a sample.

NB: Printed tag should be exactly 1.125 inches square in order to get detected by Surface.

Introducing Surface SP1

noreply@blogger.com (Joy George) — Wed, 20 May 2009 09:42:00 +0000

The first Service pack for Microsoft surface has released on May 10.It has got significant changes comparing to the older older.Here are the main features I noticed.

New controls
1. ElementMenu
2. LibraryBar
Tagged object routing
Improved contact visualization
Improved access points

More details here
http://blogs.msdn.com/surface/archive/2009/05/11/service-pack-1-officially-released-today.aspx
http://arstechnica.com/microsoft/news/2009/05/microsoft-surface-sp1-adds-new-features.ars

As a developer, I am more interested in the new controls and will be posting about them later.

WatermarkTextBox by inheriting TextBox

noreply@blogger.com (Joy George) — Tue, 19 May 2009 06:24:00 +0000

I am very happy to see that my previous post “WPF Watermark TextBox using XAML Style” helped a lot of peoples to solve their issues and currently that is the most popular post in my blog.That post describes about creating a WPF watermark textbox by changing it’s style.All the things are done in xaml and there is no property to set the water mark text.
There was a requirement from one of the readers for such a property.ie a Watermark property which decides the watermark text.So rewriting the sample with that property.
Here I just derived a new class called WatemarkTextBox from standard TextBox added a new dependency property called Watermark and defined default style for that control in generic.xaml.The steps are as follows

Subclass TextBox and create a new class called WatermarkTextBox.
Add a new DP called Watermark which is of type object.
In the generic.xaml write the default style.

public class WatermarkTextBox : TextBox
{
    static WatermarkTextBox()
    {
        DefaultStyleKeyProperty.OverrideMetadata(typeof(WatermarkTextBox),
            new FrameworkPropertyMetadata(typeof(WatermarkTextBox)));
    }
    
    public object Watermark
    {
        get { return (object)GetValue(WatermarkProperty); }
        set { SetValue(WatermarkProperty, value); }
    }
    // Using a DependencyProperty as the backing store for Watermark.  This enables animation, styling, binding, etc...
    public static readonly DependencyProperty WatermarkProperty = DependencyProperty.Register(
        "Watermark", 
        typeof(object), 
        typeof(WatermarkTextBox), 
        new UIPropertyMetadata(null));
}

And its style in generic.xaml contains almost same elements as of my last post.But here I have used TemplateBinding to set Watermark into the TextBlock.

<Style TargetType="{x:Type local:WatermarkTextBox}">
    <Setter Property="Foreground"
            Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" />
    <Setter Property="Background"
            Value="{DynamicResource {x:Static SystemColors.WindowBrushKey}}" />
    <Setter Property="BorderBrush"
            Value="Blue" />
    <Setter Property="BorderThickness"
            Value="1" />
    <Setter Property="Padding"
            Value="1" />
    <Setter Property="AllowDrop"
            Value="true" />
    <Setter Property="FocusVisualStyle"
            Value="{x:Null}" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:WatermarkTextBox}">
                <Grid>
                    <Microsoft_Windows_Themes:ListBoxChrome x:Name="Bd"
                                                            SnapsToDevicePixels="true"
                                                            Background="{TemplateBinding Background}"
                                                            BorderBrush="{TemplateBinding BorderBrush}"
                                                            BorderThickness="{TemplateBinding BorderThickness}"
                                                            RenderFocused="{TemplateBinding IsKeyboardFocusWithin}"
                                                            RenderMouseOver="{TemplateBinding IsMouseOver}">
                        <ScrollViewer x:Name="PART_ContentHost"
                                      SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                    </Microsoft_Windows_Themes:ListBoxChrome>
                    <TextBlock x:Name="textBlock"
                               Opacity="0.345"
                               Text="{TemplateBinding Watermark}"
                               TextWrapping="Wrap"
                               Visibility="Hidden" />
                </Grid>
                <ControlTemplate.Triggers>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="IsFocused"
                                       Value="False" />
                            <Condition Property="Text"
                                       Value="" />
                        </MultiTrigger.Conditions>
                        <Setter Property="Visibility"
                                TargetName="textBlock"
                                Value="Visible" />
                    </MultiTrigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Download sample from here.