Yesterday, we had the Flemish and European elections took place here in Belgium (in case you aren't familiar with Belgian/Flemish government, take a look here. Note: it's quite complicated!).

I'm not planning on turning my blog into a place for political statements, absolutely not. However, Microsoft technology took a prominent place in these elections. VTM, the Flemish commercial TV station, used Microsoft Surface technology to show the results.

The presenter used several items that were recognized by the Surface's internal camera's to switch between the results of the parties (seen around her left hand in the below screenshot).

When placing the tagged item on the surface, the results for the selected party are shown.

Also, a lot of dragging was implemented in the application. By clicking on a header, she could show more details on the results.

With this example, Surface has (as far as I know, I never watch TV...) made its debut on Belgian television. And it made quite an impression on people as well... My girlfriend came asking me if I knew what this "thing was they were using to drag stuff around" on TV :)

Update: here's the MSN Soapbox video:

Wow, what an exciting week this is! In fact, I'm having trouble waiting for all the info that will come our way tomorrow.
Why tomorrow, you might ask? Well, Mix'08 is starting in Las Vegas in just a few hours. And as expectec, a lot of great info and visions will be shared, mostly during the big opening keynote.

A little further in this post, I have collected some info I managed to find already. Some of the things we'll see being announced tomorrow will greatly expand the possibilities we as webdevelopers/designers have. In fact, the web is wide open, the oppurtunities coming are way are endless.

One of, if not THE biggest announcement tomorrow, will of course be Silverlight 2.0 beta. A great toolset will make it much easier to create next-gen UX for the web. Datagrids will be on the rendez-vous, whom are still missed in WPF however. Today, Nokia announced the availability of Silverlight on their (Symbian) smartphones, so it's a guess, but I think we'll see more on a mobile version of Silverlight tomorrow (as I said, it's a guess...)

I managed to find some info on Expression too... Expression Studio V2 is coming this April appearantly, if we can already believe the rumors. Laurent Bugnion has more info on that on his blog.

And if you're not in Vegas, do use the possibilites of the web to take a look at the future! The opening keynote will be broadcast live (750kbps, 300kbps, 100kbps) at 9:30am Pacific / 5:30pm GMT. Microsoft also made a promise that all sessions will be downloadable within 24 hours! That means, start your download engines, go get soms sleep today, as you won't be having any time to go to bed once all this info is online!

Stay tuned for more Mix info on Snowball.be!

KaXaml has finally hit the 1.0 milestone! Indeed, finally!

In case you don't know this great little (free) XAML tool, here's what the official website has to say on it:
Kaxaml is a lightweight XAML editor that gives you a "split view" so you can see both your XAML and your rendered content (kind of like XamlPad but without the gigabyte of SDK).

There are a lot of new features included in the 1.0 release, including Intellisense support, a new UI and tabsupport. To see an overview of all the new features, go here. One other interesting thing it that it now has basic support for Silverlight too!

Convinced that this can and will make your XAML life easier? Go here for the free download or visit www.kaxaml.com .

Since the dawn of WPF (Windows Presentation Foundation), it became easy for developers to create applications that were nearly impossible to create without it. Creating animations, transformations, gradients is as easy as 1-2-3. In the end, the user who has to work with the application will benefit from this. The User Interface is what you are looking at every day, so don't you want it to look at least a little nicer than the old-school grey?

Sadly enough, I still hear people complain that UI is not important, which is ignorant in my opinion(Ignorance is bliss, they say, however in this case, I beg to differ). If you have the nicest architecture imaginable, if your application is developed with the latest best practices or if you used the newest ways of service communication, it all falls apart when your application looks like it was developed in the 90's. The end user will not see this.
Take your average customer and present him an ugly and nicely architectured program, and another one, only this time with a really cool looking UI, but not developed as it should.
Which one will he choose? I would bet my money on the latter one.

Maybe it's not obvious at first sight, but I'm sure that users really look for nicer looking apps. Computers are capable of displaying nicer graphics, well then, use this possibility.
I rest assured that WPF and Silverlight really are the platforms to develop next-gen applications.

In a question to Dino Esposito on DevConn07 on the fact if Silverlight and WPF will replace Winforms and ASP.net, he says the following:

I firmly believe that the two worlds—Web and Windows—will remain neatly separated for most of the foreseeable future.  At the same time, though, the advent of WPF and Silverlight generates many more possibilities of interaction between Web and Windows that were just impossible or impractical before.  Once the next Silverlight is available you can develop for the Web with much of the same ease you experience today for the desktop. You could even get to the point of using the same WPF document to power the Web and Windows front-end of a multi-tier system. Well, not for free, but is definitely a scenario that the use of proper design patterns (i.e., the Model-View-Presenter pattern) may enable. At that point, I believe that you just have two options--deluxe experience with a 100% Silverlight solution or normally rich Web experience with a combination of AJAX and Silverlight in the same ASP.NET page. With Silverlight used in this case as a rendering engine for special data.

To be more direct with the question: For Silverlight and WPF to dethrone ASP.NET and AJAX all developers on all platforms must agree to use it. Technologically speaking, nothing prevents this from happening. In practice, though, I wouldn’t bet on it. But I see a lot of interaction taking place between Silverlight and ASP.NET AJAX applications.

I do think the same. I'm not suggesting WPF and Silverlight will replace ASP.net entirely, but I do believe that in the NEAR future, when the demand for RIA's (rich interactive applications) will rise, those companies that are ready for this, will profit from this.

Do note that I'm not promoting bad architecture in my opinion here, quite the opposite in fact. BUT I reckon that it should be in combination with a well designed user interface, using the newest applicable technologies. I'm trying to convince people to start thinking this way... Let's hope for the best.

Yesterday, another CTP of Blend 2, THE tool for create Silverlight and Windows Presentation Foundation applications, was released. This time, it's the September Preview.
Here's a list of what was added/changed:

• VS2008 beta 2 full support
• Creation of Controls from existing objects - reuse them all.
• Some enhancements with Split View - now you can see Design and Code both as well as you can do it in Visual Studio
• Storyboard picker - the old Storyboard panel has been thrown and replaced with brand new storyboard picker. Now you can duplicate, reverse or delete existing storyboard or easy modify its properties.
• Aside with new storyboard picker, now you have properties panel both for all sotryboard or single frame.
• New functionality - 3D Vertex animation
• Long awaited Breadcrumb bar
• Subsetting and embedding fonts within your application (EULA awarded)
• New build options - how you can create custom builds for better integration with Visual Studio
• New abilities of object manipulation - uniformly resize, scale, rotate multiple objects, resizing handlers at artboard. Easy object duplication by dragging with Ctrl-P pressed.

You can download a free copy here.

When I came home today from an entire day of meetings, something was waiting at home to cheer me up ;-) . My neighbor brought in a package that was dropped by the mailman at their address, because I wasn't home.

I opened it up, and... it was the new book of Charles Petzold (writer of "Applications = Code + Markup", the first book on WPF that was published last year), 3D Programming For Windows. It's completely focused on WPF programming, and from what I already saw, can serve as a sequel to his first book.

Here's a short description of the book's contents:

Get the practical introduction to programming 3D graphics using the Windows Presentation Foundation – straight from programming legend Charles Petzold. The Windows Presentation Foundation is a key component of .NET Framework 3.0, which is a part of Windows Vista™ and available for Windows XP. With the Windows Presentation Foundation, 3D images can be displayed regardless of the video-display hardware on the user’s machine. This practical guide is the ideal supplement to Applications = Code + Markup: A Guide to the Microsoft Windows Presentation Foundation.

If you want, you can order it at (international) Amazon or (Belgium) at HCW.

I received it from him as a gift, so Charles, thanks!! I'll start reading very very soon.

I'll be doing a session on Silverlight next month, on September 20th for Visug, the Belgian Visual Studio User Group. In this session, I'll give an overview of XAML too, so that if you've got no knowledge, you'll still be able to follow the entire session. This event will take place in the Ordina (my company) buildings in Schelle.

I will announce the complete overview in a few days, as I'll be working on my session in the coming week (I have a week off, but I'll be working anyhow ;-) ).

If you want to register for this free training, please go to www.visug.be and click on the event! So, what are you waiting for?!?!

Did you know Blender already? If not, it's a free program to develop 3D stuff. It's pretty powerfull, certainly for being free.
Very recently, a new reason to start using it emerged: you can use it to create 3D graphics AND export them to XAML. This way, you can use them in your WPF projects.

To accomplish the export, you have to download a plugin that can be found here. To get Blender, go here.

MSDN released a new and amazing hands-on lab on WPF. This tutorial will show you how to create a UI just like Outlook 2007 using WPF.
The result looks like this:

You can download the PDF and the solution here.

I came across this post which has code for a perfect XAML shield.

As WPF is becoming more and more used, the list of available tools and controls is growing fast.

Therefore, it seemed a good idea to list all the tools that I use or know but don't use yet, and share that list with you!

Professional tools

Visual Studio 2005
There's no doubt that Visual Studio 2005 is the best environment for developing WPF applications. So, if you have access to it (via MSDN for example), I certainly recommend using it.
However, out of the box, it has no knowledge of WPF projects, so you'll have to install some additional software.
First, you should install the Windows SDK (free), then you should add the Visual Studio 2005 extensions for .net 3.0 framework (they also include templates for WCF). These extensions install the templates for development of WPF projects, and also add Intellisense for XAML code (on a sidenote, when writing XAML code, the Intellisense is not always correct in flagging errors, due to the fact that the extensions are still in CTP phase!)

Also, you now get a designer for WPF applications, which is code-named Cider. The complete version will be included in the Orcas release.

Visual Studio Orcas
There's life after Visual Studio 2005! And it is known as Orcas. Visual Studio Orcas, the successor of 2005, will probably be released in Q4 2007, but you can download the CTP since a few months.
Just recently, the March 2007 CTP was released, which is considered a milestone on the road to the complete product.

 
So, what will Orcas bring to the world of WPF? It will include full support for designing WPF windows and web applications, with the completed version of Cider.
For now, it's possible to start using Orcas. You can download the CTP here (large download, beware!)

Expression Suite
The Expression suite is a range of new products from Microsoft. The collection includes Blend, Web, Design and Media. Web is more or less the (very much improved) successor of FrontPage.

Blend is the tool that is the most interesting for WPF developers/designers. It allows you to open a WPF project, design it in a very advanced environment using a wide range of tools (much like Photoshop, but for designing user interfaces). After you're finished, you can open the project in Visual Studio again.
At this time, Blend is in RC, but since it's a public download, you can start using it right now. I hope I'll find some time to do a tutorial on Blend soon.

Design, a professional illustration and graphic design tool, is still in beta 2, but also available for download already. Design fully supports export to XAML, which makes it easy to incorporate your graphics with your other XAML code.
On a sidenote, Web has been released and you can download a trial here.

Controls

Infragistics NetAdvantage 2007 for WPF
Infragistics recently released Beta 1 of their first WPF controls. The suite, which can be downloaded here for free, includes the xamDataGrid and xamDataPresenter controls (pronounced "zamDataGrid" and "zamDataPresenter").


Some controls, like the xamCarouselListBox seem very promising and seem to make it very easy to add advanced features to your applications.
 

ActiPro Ribbon
Last week, I got a mail from ActiPro, to introduce me to their ActiPro Ribbon. The control features Office 2007-like user interface for the Windows Presentation Foundation (WPF) and meets all of the core Microsoft licensing requirements for implementation of a ribbon user interface. I must say, it looks very nice. You can download a demo here.

 
XCeed WPF DataGrid
I found this control via a banner on Scott Hanselman's site... These guys simply give away FOR FREE the entire control, which is a fully featured WPF datagrid. It's risky to say but I think this replaces the missing datagrid in WPF.

When you register, the license is royalty free and perpetual. So, no excuse for not having this control in your toolbox.
Here you can check out some demo's and get the control.

Tools

XamlPad
XamlPad (xamlpad.exe) is a basic visual editor for XAML. If you installed the SDK, it's probably already on your PC, since it's part of the default install.
XamlPad is quite basic, and some say not the most user friendly. Therefore, I recommend using one of the two following tools in this list for basic XAML.

XamlPadX
XamlPadX(Extended) is a somehow extended version of XamlPad and has some handy features. Some of its most important features (from the site):

• A xaml writer which parses the object back into xaml and vice versa.
• Simple command interpreter with limited intellisense (please look at help window for limitations).
• Viewer of default styles
• Automatically closing of tags
• Line-numbering
• Possibility to save in different locations
• Indentation feature (!)

You can download the lastest version here.

Kazaml
Another editor, which is now in alpha 2 phase, and is thus not yet complete. You can download it here and more info can be found here.

Adobe Fireworks XAML exporter
This free extension from Infragistics makes it possible to convert anything that's currently selected to XAML. You can download it here.

Performance Profiling tools
WPFPerf is a set of tools that can help you find performance issues in WPF. It included Perforator, Event Trace, Trace Viewer, Visual Profiler and Working Set Analyzer. There's a very in-depth article on MSDN that you can read here.

LocBAML
LocBAML is actually a sample included in the SDK. After you compile your XAML into an assembly, it can extract the strings and place them into a *.csv file. This file can then be translated, and the file can then be given again to LocBAML, which will create culture-specific resource DLLs. Handy for when you're translating your WPF application.

Reflector
Since Reflector updated to version 5, it supports the .net 3.0 framework, and thus WPF files can be extracted from assemblies.


I hope you find in this list some tools that can help you explore the world of WPF.

If you know another tool not listed here, or if you have developed a control/tool you'd like to see in this list, please leave a comment or send me a mail.

While I was reading today on WPF, I came across a property that can come in very handy when designing an interface using a GridView (which is the default when you start a WPF project in Visual Studio by the way).

When setting the ShowGridLines property on a GridView to True, in design view, the cells of of grid are highlighted with a blue and yellow dashed line. This line is of course not useful for production environment, but can come in handy when debugging/designing!

You can see a sample on the image below.

Some time ago, we did a .net 3.0 event at Ordina. We did some demo's on WPF and WCF.
However, there was one thing in our demo we couldn't figure out ourselves: how does the spelling check on a textbox in WPF work in the following code:

Appearantly, it works using the dictionary provided by Microsoft Office, and is thus multilingual. So, it's not a feature of .net 3.0!
On the down side, in the current version, it's not possible to add custom dictionaries. That might change in a future version.

As opposed to what was said earlier, Expression Suite will be included in MSDN Premium subscriptions!! That's simply great news, isn't it?! Somasegar did the announcement today on his blog, based on the feedback they received.

Based on this feedback, I am pleased to say that we will be making Expression Web available starting today to all MSDN Premium subscribers.  We will also make Expression Blend available to MSDN Premium subscribers shortly after the Expression Studio release later in Q2 2007.   Expression Blend and Expression Web are intended to help creative professionals collaborate with developers to create rich user experiences for the Web, Windows Vista applications and beyond, which means we need to make sure both tools are readily available to our developer community.

More here.

Lately, I've come across some interesting WPF resources and labs. In this post, I'll share them with you.

If you're into WPF, you probably already saw the North Face demo, one of the applications that MS used to demonstrate WPF and it's capabilities. You can now read the entire case study here.

Over at Channel9, a Wiki was created to gather all resources on WPF. On this page, you can find a tremendous amount of information and resources when you're learning WPF. Go here for the Wiki.

Karsten Januszewski posted a new lab on WPF 3D here.

Hope this helps you more in learning WPF!

Yesterday, at the Microsoft DevDays 2007 in Gent, Belgium, I talked with Jeff Prosise on the future of WPF/E. He was not able to give away much details of the platform, since a lot will be announced at the Mix 07 convention in Las Vegas next month.
What he did say, was that Microsoft will almost certainly announce a new name for the platform!

Why don't we help Microsoft a little?! Have a good idea on the name of this possible Flash killer? Post them here, and maybe somebody at Microsoft will pick it up...

I just got home of DevDays 2007 (and now already I'm typing a report...), and man, it was a fun ride! If you weren't there, you did miss out on  great sessions and great fun (and great little pies... still don't know what was in them, but they tasted great). In my DevDays report, I want to highlight some of my personal 'fav-moments', some nice little tools I learned about and show some of my pics I took (maybe you're on them somewhere...).

(I wasn't at the pre-conference, so no report on March 27th...)

Day 1
6.00 am. Very early... Must get up to avoid traffic jams.
7.30 am. Breakfast at ICC Gent, avoided all traffic jams (jeej).

The day began like usual with an opening keynote, given this year by David Chappell. He went over what he thought would be the most important Microsoft-related innovations for 2007. These included the .net 3.0 framework, Forefront, Security Center and Longhorn Server.
 
After that, I went to the Blend demo, given by Carrie Longson. She showed some XAML effects created easily using Expression Blend. After that, she showed some impressive applications created with WPF. One of these was an application created by Microsoft UK for the Londen Underground (the tube). It was able to give an overview of the trains, where they were, all rendered in real time. It was even possible to rotate the viewport, completely in 3D. The application, while very impressive, took only 3 weeks to create with WPF.

Jeff Prosise is the speaker I saw the most sessions of (you'll find him again later in this article). The first one on Asynchronous ASP.net was impressive. He showed how to (and how not to) program threaded ASP.net. Doing this correctly can create a vast scalability for your web application. I hope to find some time to blog on some of his thoughts on this subject (hold your breath).

Up next was the first of 2 sessions of Raj Pai. This first one on Linq (.net Language Intergrated Query framework) explained in depth the possibilities of this extension of C# that will be included in C# 3.0. While the syntax on some moments still feels weird (it's odd to see Select and From in your C# code sometimes, even if you've been playing with it for some time), the session was very clear.

Like I said, Jeff Prosise would come back in this article. The next session I attended, Optimizing and Extending ASP.net Ajax, was very helpful for me. I've doing quite a lot of Ajax in the last months, but 1 thing I didn't use a lot yet, is the Ajax Client Script Library (the javascript). This library is not documented very well at this moment, so it's sometimes hard to figure out what you can do with it, and even harder how to do it. Luckily, this session cleared some clouds in my brain, so I think I'm on my way with it now!

The last session of the day, Hardcore debugging of .net applications given by "Mr Type Fast" Ingo Rammer was easily the one where I learned the most. I didn't know what to expect from it, but the demo's of this session literally blew me away.
He started by showing how to use WinDbg (WinDebug). While this is not a .net debugger, it can be used (loading in some DLLs) to debug running (production) .net applications. I actually never knew this was possible. This program is not the most user friendly, but it can be a real time saver. It does however use a lot of commands, and so I hope this session will certainly be included with the DVD.
He went on showing some other interesting tools. ADPlus is another tool (command line) that can be used to create a memory dump on any PC, that can afterwards be analyzed using WinDbg. Using these 2 can give you insight on why an application crashes or hangs.
The last shown tool was HawkEye. The free version can be used to inspect any .net forms application: you can see all properties of any control (name, color...) on a forms application.

After that, Visug, the Belgian Visug Studio User Group (of which I'm the webmaster), organised a bowling in Gent. We started playing at 9 pm, but due to a blackout in a large part of Gent, we were forced to stop playing around 10 pm.

1 am: in bed ;-)

       

Day 2

6.00 am... you know the story...

The day started with the second session of Raj Pai, that closely intergrated with the session of day 1. In this session, he explained the new features of C# 3.0 (of which I'll be blogging in the coming weeks): extension methods, automatic properties, how LINQ works internally...

I was lucky enough to be able to attend 2 "sidemeetings" with 2 speakers, namely Raj Pai and Jeff Prosise.
At 11am, I met in person with Raj on the top floor, and together with some collegues of Ordina, we got to ask him questions on LINQ and C# 3.0 .
He explained in detail what went on behind the scenes when you run a LINQ statement. Seeing this more or less eased me! On my question on how you could debug a LINQ statement, he advised me to break the statement into pieces, and add a ToList() to each part. That way, you can easily see what each part of the statement actually returns.

Another question we asked was the following: how do you see LINQ in a DAL? Sadly, on this topic, they're actually still working themselves, and he promised that some white papers will be available soon.

I also asked his vision on the "over-use" of extension methods in C# 3.0. Using these methods, you can for example write your own System.String.In() method. Personally, I think this will make code review very hard. Raj agreed with me, and said there will be some patterns and practices available later on when to use these methods.

Due to this private session, I was unable to attend the session given by my collegue Kurt Claeys. I did hear nothing but positive comments afterwards, so Kurt: congrats!

The next session I attended was again one given by Jeff Prosise, this time on WPF/E.
This session was closely followed by my second private session, this time with Jeff. During this session, we talked on the future of the 3 web technologies Microsoft is currently using/developing: ASP.net 2.0, WPF/E and ASP.net Ajax. He thinks that all these will intergrate more in the future, certainly WPF/E and ASP.net Ajax.

He said that what we have seen so far of WPF/E is only a fraction of what it will really become. He believes that on some aspects, the final version will be better that it's competitor, Adobe Flash. He seemed very excited on some features that will be announced at Mix '07, including the final name. This session was not only fun, it gave a great insight in what web technology is evolving too.

In the last session of the day, Ingo Rammer explained some more of on profiling .net applications using CLR profiler and SQL profiler.

After this session, I went home, tired, but happy!
Great job guys!

The Ordina booth
My company Ordina was Platinum Sponsor of this event, and so we had a very large booth. On the following pics, you can see more of this.

 

All my DevDays 2007 pics can be found here: http://www.flickr.com/photos/gillcleeren/sets/72157600035030532/

What I brought home...
Het Computerwinkeltje, Belgium's largest computer book store, was also here, and they organised some book signing sessions. I just bought the new book on Powershell, Manning's Windows Powershell In Action , writte by Bruce Payette. I got my copy signed!

I also brought home the new book from Apress on LINQ.

As Vista's launch is almost upon us, WPF and with it .net 3.0 are becoming more and more used.
Just a couple of days ago, Yahoo (still my favorite start page) has announced that they'll be launching an entirely new version of their web messenger, written in .net and WPF.

Yesterday was a very busy day over at my company: we did a .net 3.0 event, with sessions on Windows Presentation Foundation, Windows Communication Foundation and Windows Workflow Foundation.

In the first session, I did, together with Sven Cipido, a complete live demo, with no slides... It was an experiment, and, hearing from the attendants afterwards, it was received very very well :-) . That means that in the future, I'll be doing more presentations in this way: less slides (or none at all) and a live demonstration.

The second session, done by Kurt Claeys, was also of a very high standard. Kurt also had too little time to show all his demonstrations.

While we are preparing a post on the corporate blog, http://blog.n-technologies.be, you can already download my demo's below.

The .NET Framework 3.0 has officially been released!  You can download the .NET Framework 3.0 components here:

• .NET Framework 3.0 Runtime Components
• Windows SDK for Vista and the .NET Framework 3.0 
• Visual Studio 2005 Extensions for .NET Framework 3.0 (Windows Workflow Foundation)
• Visual Studio 2005 Extensions for .NET Framework 3.0 (WCF & WPF), November 2006 CTP

If you use Vista, they are installed by default.

Th  If you have a previous CTP installed, please be sure to review the uninstall instructions. 

With Windows Presentation Foundation coming closer to its release date with Vista almost being upon us, more and more people are taking a look at programming in WPF… Lately, people searching on Google for WPF-related information is soaring. How do you know that, you might ask? Well, in my logs, I notice a steep increase in people landing on my blog who searched for information on WPF. That’s a good thing!! ?

However, what I do notice, is that there is still some confusion on some topics.  In this article, I want to help clear out the difference between the different application types in WPF/Vista. Since this is a major change with previous application models, lots of people, including me when I first heard about it, seem confused.

So, let’s get to it!

WPF has 2 main applications models: standalone and browser. On the other hand, it also has 2 types of navigation: menu-driven, which is what we’re all used to in traditional Windows applications and link-driven, which is the default for web applications. The first thing to note is that in WPF, both types of navigation can be used in either of the application models. Neat, isn’t it?
That basically means that you can create a web application as if it were a windows application, containing a menu to navigate around. Or, create a standalone desktop application that feels like a web application, with all buttons replaced by links.
No longer are you bound to one application model with is “natural” navigation model!

Standalone applications

When you want to create a “traditional” Windows application, you should choose to create “Windows Application (WPF)”.

The Windows Form now became a Window, each of these is declared as Window1.xaml. Notice that the build action for a Window file is automatically set to Page. What this means, is that the markup is turned into a special type of resource that can be identified uniquely by a Uniform Resource Identifier (URI). This way, WPF can load the window using a URI, as is done set the starting point in your App.xaml.

<Application x:Class="WindowsApplication2.App"
    xmlns=" http://schemas.microsoft.com/winfx/2006/xaml/presentation "
    xmlns:x=" http://schemas.microsoft.com/winfx/2006/xaml "
    StartupUri="Window1.xaml"
    >

This way, your application knows which window it has to load up first. This window is loaded modeless, meaning that it has no problems with you clicking anywhere else in the application.

Page’d applications

Should you want to create an application that mimics the web experience but still run as a standalone application, you should start by adding a Page(WPF).

Just like in the Window, you can add controls and content to the page. However, when you change the startupuri in the App.xaml to your newly added page, some things will change.

A window can host itself, like a form did in traditional Windows Forms programming. A HTML/ASPX page requires a browser. Now, we created a “standalone” application with the starting point set to a page. Kinda weird, right?

Well, the Application class in WPF is smart enough to detect if your startupuri is set to a page. It will then create a window to host your application.

Now, where does this “hosting window” come from?
When the startupuri is set to a XAML page or HTML page, Application  creates an instance of NavigationWindow to host them. This class derives from Window but extends it to make it look like a mini-browser window, providing navigation buttons at the top.

When content changes or when you click a link to navigate to another page, the previous content is added to the history. The management of the history itself is managed too by the NavigationWindow.

XAML Browser applications

The final type of application is the XAML browser application. While the previous type of application basically is a web application, being hosted in its own mini-browser, you can’t really take advantage of all the features modern browser have today. If that’s what you need, you should create a XAML browser application or XBAP.

To create one, you should choose new “XAML Browser Application (WPF)”. After that, you can copy all the code you created for that WPF standalone application to one or more pages, and your application is ready for the web!

One more thing you can do with XBAPs is publish them on a web- or intranet server. This is done using ClickOnce, which creates the executable along with 2 manifest files. One of these 2 has the extension XBAP, and that’s were the user navigates too. It then “downloads” the application to the local computer.

Because of the security risk, XBAPs are not installed and run in a security sandbox: some operations like writing to the registry are not allowed. Basically, XBAPs can only do things that are allowed for apps launched from the Internet zone, a restricted set of operations.

Conclusion
As you can see, the ways an application is build are different from what you are used to in traditional programming. I hope this guide is clear enough to help you choose the correct type when building a WPF application for Vista.
 

Today, I was installing the VPC (Virtual PC image) that Microsoft provides for all early adopters on future technologies, including .net 3.0. I intend to use this VPC for my presentation later this month.

This image-file includes a whole lot of CTP/preview versions, as can be seen here.

However, when opening the file, I received the following notice: E:\VPC\TimeBombedBase\Base01.vhd cannot be found... Appearantly, this is the parent image, of which the CTP is a differencing disk.

On the setup instructions page, MS appearantly forgot to mention that this 4GB download also requires you to obtain the parent VPC image, a 1.1GB download...
This file can be found here: http://download.microsoft.com/download/5/4/9/5499b008-8ae7-46f0-89ae-aeeb18df67ae/VSCTPBase.exe 

Should you want to play around with .net 3.0/LINQ... and don't feel like installing all these on a VPC yourself, you can grab the download here: http://www.microsoft.com/downloads/details.aspx?FamilyID=82243606-d16d-445c-8949-9ee8c10cda2e&DisplayLang=en  

In a few weeks, I'll be doing a session on Windows Presentation Foundation, or WPF at Ordina, my company.

The info:
.NET Framework 3.0 heeft de RC1-status bereikt. Hoewel de naamgeving anders doet vermoeden is versie 3 geen upgrade van versie 2, maar meer een uitbreiding hierop. .NET Framework 3.0 bevat .NET Framework 2.0 plus vier nieuwe libraries.
De nieuwe toevoegingen aan .NET Framework 3.0 krijgen de namen Windows Communications Foundation , Windows Presentation Foundation , Windows Workflow Foundation en de Windows CardSpace Identity Library.

My article on WPF (Windows Presentation Foundation) triggers and styles is online on the MSDN website! You can read it here!

From MSDN:
In this article, Gill Cleeren focuses on the aspect of styles and triggers in Windows Presenation Foundation. Styles make it possible to create applications with a uniform look and with a high level of maintainability. Triggers allow WPF styles to change one or more properties in response of a user interaction. In this document, we will use both these technologies to create a richer user experience.

This is my first article on MSDN (more will come, now that I'm into it ;-) )

Here's a screenshot of the MSDN Belux site (Click for larger version)



Thanks to the MSDN Belux team, Wim Verhaegen and Tom Mertens.

Another new release of the .net framework 3.0 has been released! This time, it's the September CTP.

The Microsoft .NET Framework 3.0 (formerly known as WinFX), is the new managed code programming model for Windows. It combines the power of the .NET Framework 2.0 with new technologies for building applications that have visually compelling user experiences, seamless communication across technology boundaries, and the ability to support a wide range of business processes.
These new technologies are Windows Presentation Foundation, Windows Communication Foundation, Windows Workflow Foundation, and Windows CardSpace (formerly code named "Infocard"). Microsoft plans to ship .NET Framework 3.0 as part of the Windows Vista operating system. In addition, Microsoft is making these technologies available on Windows XP and Windows Server 2003.
The following Community Technology Preview of .NET Framework 3.0 enables you to continue experimenting with early builds of these technologies, get acquainted with the development experience, and provide feedback to Microsoft. For more information on these technologies, click here.

Installation
To start the installation process, you will need to run the download file; this will initiate the installation of the .NET Framework 3.0 September CTP; If you have troubles with the download manager, you can download the entire package for x86 or for x64 which are both .EXE files.

Enjoy!

A list of some new WPF resources:

• Online hosted version of the Cube animation: http://wpf.netfx3.com/direct/cubeapp/CubeApp.xbap
• New York Times: offline reader: http://www.nytimes.com/mem/reader_regi.html?_r=1
• WPF feature montage: http://wpf.netfx3.com/files/folders/code_snippets/entry3752.aspx
• XAML cruncher: http://www.charlespetzold.com/wpf/XamlCruncher/XamlCruncher.application 
• 3D XAML: http://www.charlespetzold.com/blog/2006/09/120140.html

More to come...

Just a cool link to a cool screencast: http://mattgriffith.net/PermaLink.aspx?guid=a1cb7215-2719-4c38-8ce3-ba7408aa69aa .

In this short screencast I show how you can use IronPython and Snoop together to explore the Windows Presentation Foundation (WPF).

IronPython is a wonderful dynamic language with full access to the .NET Framework . Snoop is a great WPF debugging tool . Together they can help you climb the steep WPF learning curve.

A nice way to pass your lazy zundayzzz ;-)

And if you're not satisfied with that, here's an interesting article on Settings in C#: http://msdn.microsoft.com/vcsharp/default.aspx?pull=/library/en-us/dnvs05/html/SettingsCS_RL.asp 

Is today "Release Day" or something? So many new releases...

Let's begin with IronPython, which reached status 1.0:

IronPython 1.0 has been released to the .NET community and is available on CodePlex.  IronPython is an implementation of the Python dynamic programming language.  IronPython is built on top of the .NET Framework and is interoperable with other .NET languages.  Binaries, source code, and tutorials are available at CodePlex.

Click here to download IronPython at CodePlex.

Another release is Expression Web Beta 1:

We are pleased to present the Beta 1 release of Expression Web (formerly Expression Web Designer).

Expression Web is a professional design tool that helps you create and work with:

• Standards-based Web sites
• Sophisticated CSS-based layouts
• Extensive CSS formatting and management
• Rich data presentation
• Powerful ASP.NET 2.0-based technology

To download, go here .

Still going strong ;-) Next is WCF, which reached RC1 also.

The release candidate 1 for the .NET Framework 3.0 is now available!  You can download the components for the RC1 here:

• .NET Framework 3.0 Runtime Components RC1
• Windows SDK for Vista RC1 and the .NET Framework 3.0 RC1
• Visual Studio 2005 Extensions for Windows Workflow Foundation (WF RC5)

More info on RC1 .


The Interactive Designer got updated, and now the September CTP is available:
Microsoft® Expression® Interactive Designer September 2006 Community Technology Preview (CTP) is a professional design tool used to create engaging, rich user interfaces for desktop and Web applications.

To download, go here.

To finish, this one isn't actually released as of yet, but it's an interesting project being researched at MS:

Microsoft researchers are experimenting with an automatic code zapper for the company's Internet Explorer Web browser.

Researchers at the Redmond, Wash., company have completed work on a prototype framework called BrowserShield that promises to allow IE to intercept and remove, on the fly, malicious code hidden on Web pages, instead showing users safe equivalents of those pages.

The BrowserShield project—the brainchild of Helen Wang, a project leader in Microsoft Research's Systems & Networking Research Group, and an outgrowth of the company's Shield initiative to block network worms—could one day even become Microsoft's answer to zero-day browser exploits such as the WMF (Windows Metafile) attack that spread like wildfire in December 2005.
More here.

That's all folks ;-)

My new bible has arrived :-)

My article on WPF reflections can also be read on CodeProject. Since it was put there, it received almost 2000 reads and a rating of 4 out of 5!

Putting nice articles on CodeProject enhances your visibility, so if you're a blogger and write technical articles, it's a nice place to put them!

Here is the link :-)

Today, I came across a nice article on validation and validation controls in WPF. Certainly worth the read if you're into WPF!

And here is another interesting WPF link: content in WPF.

In this tutorial, I'm going to explain several 2D effects that can be performed on images, using only XAML code. By the end of this tutorial, you'll know:

• how to create image refections
• how to skew images
• how to drop shadows

So let's get to it!

Create an empty WinFX application. We'll use the Window1.xaml.
Make the background of the image somewhat darker, so we can better see the effects we'll create further on. For this, simply use the Window.Background property. Also, set the Height to 600 and Width to 800.

<Window x:Class="Reflection.Window1"
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   Title="Reflection" Height="600" Width="800" 
   Background="#CCCCCC"
>

Add the image to your project
Select an image to include in your project. I'll do this tutorial with the image included in my project, but you can of course use any image you want. The image has to be included in your project. Once included, go to the properties window, and with the image selected in the solution explorer, set the "Build Action" to "Content" and "Copy to output directory" to "Copy always". This ensures that the image will be available when running the project.

Let's XAML
Finally, we're ready to do some XAML'ing (don't know if that is already a word, but I vote it should become one though!).
Since we will not be needing any advanced layout of the window, we'll use a simple StackPanel. By default, a stackpanel places all content it receives in 1 invisible vertical column. That's enough for this sample.

So, delete the <Grid> and </Grid> and replace them with <StackPanel> and </StackPanel>.

For the image effects, we'll need ... an image. Add an simple image element to begin with. Also, give it a name, we'll be needing this name later on. Use the following code:

<Image Source="image.jpg" Width="200" Height="300" x:Name="myImage"></Image>

We'll now start adding the reflection effect. For reflections, the VisualBrush is very handy.
What is the VisualBrush? It's a brush, like DrawingBrush, but it can paint with the contents of any other visual element that derives from Visual. Since Visual is the base class of all UI elements in WPF, you can paint with almost any markup in a VisualBrush.
Before we can reflect our image, we must add an element in which we can make the reflection appear. You can do this with a Rectangle, a Border...
For now, I'll use the Border. Add the Border element to the same StackPanel where you put the image. Since it's a StackPanel, the border is put below the Image (you can visualize this by setting the Background to some color).

<Border Width="210" Height="300"></Border>

Now, we'll use the recently introduced VisualBrush to fill the background of the Border with the contents of the image (this is why we needed to name the image!).
Add a VisualBrush to the Border like so:

<Border.Background>
   <VisualBrush Visual="{Binding ElementName=myImage}">
   </VisualBrush>
</Border.Background>

You should now see something like this:

Of course, for a reflection, we need a mirror effect. This can be achieved by adding a ScaleTransform on the VisualBrush. By providing a value of -1, the image will be flipped around the Y-axis.

<VisualBrush.Transform>
   <ScaleTransform ScaleX="1" ScaleY="-1" CenterX="200" CenterY="150"></ScaleTransform>
</VisualBrush.Transform>

Now, to complete the reflection-part of this tutorial, we'll add an OpacityMask to the Border. With this in place, we can make the reflected image fade out into the backgroud, creating a nice effect.

<Border.OpacityMask>
   <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
      <GradientStop Offset="0" Color="Black"></GradientStop>
      <GradientStop Offset="0.6" Color="Transparent"></GradientStop>
   </LinearGradientBrush>
</Border.OpacityMask>

This again uses a LinearGradientBrush, with the color being Transparant from 0.6 on. This means that at 60% of the reflected image, nothing can be seen anymore.

We'll also add a border around the original image in this code. Add the following code around your image element:

<Border BorderBrush="White" BorderThickness="5" HorizontalAlignment="Center" VerticalAlignment="Center">
...
</Border>

Your code should now look like the following:

<StackPanel>
   <Border BorderBrush="White" BorderThickness="5" HorizontalAlignment="Center" VerticalAlignment="Center">
      <Image Source="image.jpg" Width="200" Height="300" Stretch="Fill" x:Name="myImage"></Image>
   </Border>
   <Border Width="210" Height="300">
      <Border.Background>
         <VisualBrush Visual="{Binding ElementName=myImage}">
            <VisualBrush.Transform>
               <ScaleTransform ScaleX="1" ScaleY="-1" CenterX="200" CenterY="150"></ScaleTransform>
            </VisualBrush.Transform>
         </VisualBrush>
      </Border.Background>
      <Border.OpacityMask>
         <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
            <GradientStop Offset="0" Color="Black"></GradientStop>
            <GradientStop Offset="0.6" Color="Transparent"></GradientStop>
         </LinearGradientBrush>
      </Border.OpacityMask>
   </Border>
</StackPanel>

And the result should resemble this:



Skew and Shadows
In the latest part of this tutorial, I'm going to add a shadow to the original image, and skew both the images, to create a 3D effect.
First, the shadow. Shadows are created using a BitmapEffect. A bitmap effect takes visual content as input and produces a new surface by applying one or more image filters, such as a blur or a drop shadow. Currently, there are, among other, the DropShadowEffect, the BlurBitmapEffect and the EmbossBitmapEffect. More might be added later. We'll focus on the DropShadowEffect for now. Information on the other effects can be found in the Windows SDK.

Add the following code to the Border where the original images resides:

<Border.BitmapEffect>
   <BitmapEffectGroup>
      <DropShadowBitmapEffect Color="Black" Direction="20" ShadowDepth="25" Softness="1" 
         Opacity="0.5"/>
   </BitmapEffectGroup>
</Border.BitmapEffect>

This adds the dropshadow to the white border containing the image. These properties are self-explaining, so I'm not going any deeper into this.

Now, to finish, we have to skew both the image and the reflection to create the effect of depth. For this, we'll again use a transformation, this time a RenderTransform. The Angle-properties provided indicate the angle for the rotation.
The following code has to be added to the original image.

<Border.RenderTransform>
   <SkewTransform CenterX="0" CenterY="0" AngleX="0" AngleY="10" />
</Border.RenderTransform>

The reflection needs a re-centering, so we provide a value for the CenterX and CenterY properties.

The result you get should like the following:



I hope this WPF example can help you in creating great layouts with this fantastic new language!

The complete solution can be downloaded below.

ImageEffects.zip (120.66 KB)

Note that you need Visual Studio 2005/Visual C# Express with .net 3.0 installed. This code is tested with the June CTP.

I'm through with learning WPF (Windows Presentation Foundation), so now I'll have more time to write some samples for my blog, so everybode can start learning a little on WPF (that double-U-P-F ;-) ).

Today, I'm going to show you a small sample, in which I use a gradient and a storyboard to create a sort of a flashing circle. This could be used to draw the user's attention to something in the UI.

Here is the sample code:

<Page xmlns=" http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x= http://schemas.microsoft.com/winfx/2006/xaml
WindowTitle="www.snowball.be - WPF Examples" Background="White">
<DockPanel>
   <Ellipse Width="200" Height="200" Name="MyEllipse">
      <Ellipse.Fill>
         <RadialGradientBrush >
            <GradientStop Offset="0" Color="#CCCCCCCC" />
            <GradientStop Offset="0.5" Color="white" />
            <GradientStop Offset="1" Color="black"/>
         </RadialGradientBrush >
      </Ellipse.Fill>
   </Ellipse>
<DockPanel.Triggers>
   <EventTrigger RoutedEvent="Page.Loaded">
      <BeginStoryboard Name="MyBeginStoryBoard">
         <Storyboard Name="MyStoryBoard">
            <DoubleAnimation Storyboard.TargetName="MyEllipse" Storyboard.TargetProperty="(Ellipse.Height)" 
               From="0" To="200" AutoReverse="true"
               RepeatBehavior="0:0:10" BeginTime="0:0:0" />
            <DoubleAnimation Storyboard.TargetName="MyEllipse" Storyboard.TargetProperty="(Ellipse.Width)" 
               From="0" To="200" AutoReverse="true"
               RepeatBehavior="0:0:10" BeginTime="0:0:0" />
         </Storyboard>
      </BeginStoryboard>
   </EventTrigger>
</DockPanel.Triggers>
</DockPanel>
</Page>

First, I create an circle, which is actually an ellipse with identical width and height (one could also use the RadiusX and RadiusY properties, the result would be the same).

<Ellipse Width="200" Height="200" Name="MyEllipse">

Then, we use a Brush, in this case, the RadialGradientBrush, to create a gradient fill in the ellipse. No longer are the "GradientStops" or the "GradientStopsCollection" tags neccessary (they were in previous CTP's, but now they can be omitted).
To specify the colors, we use several GradientStop elements. The offset specifies where the color should "start". This is a relative value, and thus can't be more than 1. In this case, I specify 3 colors.

<GradientStop Offset="0" Color="#CCCCCCCC" />
<GradientStop Offset="0.5" Color="white" />
<GradientStop Offset="1" Color="black"/>

Now, to create the flashing effect, we have to use an animation. To start the animation, we use a trigger, in this case, an event trigger, which is routed to the Loaded event. This results in the trigger firing when the page loads.

<EventTrigger RoutedEvent="Page.Loaded">

For the animation itself, we use the storyboard. In this storyboard, which is like the name says, a series of steps that will be executed. You can compare it to a band of drawings that form a comic.
The storyboard thus consists of several animations. In this case, I use a DoubleAnimation, because the property I'm going to change, is of value Double: I'm going to alter the Height and Width property of the Ellipse. These are indeed Double values.

In the first animation, I specify that I want to animate the ellipse I created earlier, by setting the TargetName, and the property I want to change is the Height. In the From and the To properties, I specify what the values for the Height should be. In this case, I want the ellipse to pop up out of nothing, so I set the From to 0 and the To to 200.

The RepeatBehavior property specifies how long this animation should repeat, in this case, I set it to 10 seconds. Note that several animations can have different RepeatBehaviors: one can go one longer than the other. The BeginTime simply specifies when the animation should start: you can build in a delay.
Finally, the AutoReverse property indicates that WPF should reverse the animation after completed.

The second animation does essentially the same, but for the width.
Both these animations can't be grouped into one, which is a pity.

The result looks like this:

Just like me, my collegue Gabriel dislikes the renaming of WinFX to .net 3.0. On his blog, he points to an online petition to convince Microsoft to go back to WinFX, instead of .net 3.0.

So, if you share the same opinion, don't hesitate to sign the petition too!

As previously announced here, on September 25th, Microsoft is organizing an event on .net 3.0 in Kinepolis Brussels. David Boschmans announced the complete agenda on his site today.
Today, the line-up and sessions are announced. A new item is that we, the visitors, can now vote which sessions we want to see.

So, everybody, go vote AND PLEASE don't vote for the introductions!!

Vote here.
General information on the event can be found here.

MSDN Event: .NET Framework 3.0 Development

Learn about .NET Framework 3.0, the upcoming managed-code programming model which builds on and extends the .NET Framework.

The new version of the Framework offers you both practical solutions to today's software challenges and new opportunities to create software and services not possible now.

It enables you, as a developer or designer, to quickly create new applications and experiences that are more reliable and secure, visually stunning, smarter about information management, better connected, and more collaborative.

Hurry up, it's free training on the next-generation!! Subscribe here

People have been asking me questions about WPF, mostly how to get started.
Since WPF is still somewhat obscure, in this article I’m going to try to make things a little more clear to get you on your way using WPF.

As you might or might not know, WPF is part of .net 3.0, formerly known as WinFX. Other components included in .net 3.0 are WCF (Windows Communication Foundation), WF (Windows Workflow Foundation) and CardSpace (formerly InfoCard).

For starters, you need an operating system supporting WPF. This can be:
-Windows XP SP2
-Windows 2003
-Windows Vista

I do recommend running .net 3.0 in a virtual pc environment! Since a lot of CTP’s, beta’s and RC’s are coming our way, it’s easier to just create a VPC with Windows XP or 2003 , and install .net 3.0! Since Virtual PC is free anyhow, I don’t see a reason why not doing it this way!
Uninstalling beta software can be a real pain, so why compromise your precious production environment!?
(For Virtual PC go here)

On both XP and 2003, you need to install the runtime, to be able to run WPF applications. This can be a web-install (of around 2.5 MB, and then the rest is downloaded) or you might as well download the whole package.

Now, there are some issues with the latest CTP of July… This latest release does not come with the Visual Studio 2005 extensions, required to build your WPF applications in VS.
Therefore, if you want to start developing (or better, start playing around…), I suggest you stick to the June CTP, which has full support for all the tools.

So, if you want to develop within Visual Studio, follow the next steps. If not, skip this section.
The June CTP runtime can be downloaded here.

To start developing, you might want to install the SDK. It’s a big download of around 1.1GB. It comes with lots of samples and tools, like XAMLPad. The SDK can be downloaded here.

The SDK is however not required when you intend to develop in Visual Studio! For VS, Microsoft has released some extensions and templates, which will make your WPF-life a lot easier! If you don’t have Visual Studio, you can use one of the free Express editions.
For the download, go here.

We’re almost done!
Microsoft is also preparing a set of designer tools for WPF, the Expression suite.
The Interactive Designer outputs XAML code, which can be used to enhance the layout of your applications, without even knowing XAML!
For the Interactive Designer, go here.
The Graphic Designer allows you to create images and export these as XAML code to be included in your WPF projects.
This can be downloaded here.

That’s it! Now, you are ready to start!

If you want the latest release, and don’t care for the Visual Studio Extensions, go for the July CTP, which was released July 18th.

The runtime can be downloaded here.
And the SDK is found right here.

I did find some work around to get this latest CTP working with Orcas, but since I didn’t try it myself, I cannot guarantee that it will work.
The “fix” goes as follows:

Instal Orcas in VS using the misexec override: msiexec /i vsextwfx.msi WRC_INSTALLED_OVERRIDE=1

The override bypasses the installation version checking so you can install the extensions.

After this you have July CTP installed and Orcas from the previous version. This works just fine.

To solve your problem with the Orcas designer trying to open:

Right click on a .xaml file in your solution and choose "open with...". Choose "xml Editor" and click on "Set as default". Now all .xaml files will open with the xml editor instead of trying to open the unfinished Orcas designer.

In a next article, I’ll post some interesting resources to get you building WPF applications in no time!

WPF not only stands for new fantastic tools for layout. There are also some very interesting new ways to implement databinding in your applications.
In this article, I’m going to show how you can easily build an RSS reader using the new databinding features in WPF.

How databinding works in WPF
In order not to go too fast, first, let me explain some basic concepts of databinding in WPF.

To keep data used in UI in sync with data in the datasource (for example a database), we can of course use properties. There is nothing wrong if you keep doing this under WPF.
However, WPF provides very handy binding features, that will make your life a lot easier!

We could bind the value of a textbox with the following code:
<TextBox Text="{Binding Path=Age}">
</TextBox>
Databinding under WPF uses a Binding object. The above code declares a textbox in XAML, and assigns the text-property the value of a property named Age of an object that it is bound to. This is done using the Path property. The Path property refers to the property of the object we are binding too.

To know to which object we are binding, we have the DataContext property. In WPF, every FrameworkElement and also every FrameworkContentElement has a DataContext property. It is of type object, so we can bind to whatever we like.
The binding does however have some interesting behaviour: if no DataContext is specified on the object itself (like with our textbox), it goes up the tree in which the controls are nested. So if we add our textbox in a Grid, it will look if this Grid has a DataContext. If not, it goes up higher…
This is of course very useful if we have more than one object (say 5 textboxes) binding to the same object.

Let me show you how to declare an object to which we’ll bind in XAML code (this uses the new syntax, so to run this, you have to upgrade to beta 2 or higher!)

<Window x:Class="Snowball.Window2"
    xmlns=" http://schemas.microsoft.com/winfx/2006/xaml/presentation "
    xmlns:x=" http://schemas.microsoft.com/winfx/2006/xaml "
    xmlns:local="clr-namespace:Snowball"
    Title="Snowball" Height="300" Width="300"
    >
  <Window.Resources>
    <local:Person x:Key="Gill" Name="Gill Cleeren" Age="27"/>
  </Window.Resources>
    <Grid DataContext="{StaticResource Gill}">
      
      <TextBox Text="{Binding Path=Name}">
      </TextBox>
    </Grid>
</Window>

And in the code-behind:
namespace Snowball
{
    public class Person
    {
        private string name;

        public string Name
        {
            get { return name; }
            set { name = value; }
        }
        private string age;

        public string Age
        {
            get { return age; }
            set { age = value; }
        }

        public Person()
        { }
    }
}

What I have done here, is creating a Person object in XAML. For this to work, you have to provide a default constructor.
First, we have to wire the CLR namespace to be known in XAML: xmlns:local="clr-namespace:Snowball".
Now, we can use the tag “local” to refer to the namespace in which the Person class resides.
Using the following line, we instantiate a Person using XAML:
<local:Person x:Key="Gill" Name="Gill Cleeren" Age="27"/>

The result is a textbox showing my name:

Note that if you try this in Visual Studio at the time of writing, you get an error viewing the design view. Don’t worry, when running, it all works fine.

Binding XML data to a list
Most of the time, we bind data to a list: a dropdown, a grid… In this part, I’m going to bind an RSS feed from my website www.snowball.be to a list.
To do this, we’ll need an XmlDataProvider.

Data can be accessed by using a Provider. Currently, 2 providers exist: the XmlDataProvider and the ObjectDataProvider.
An XmlDataProvider object must be declared within the resources, for example the resources of the grid:

<Grid.Resources>
        <XmlDataProvider x:Key="SnowballRSS" Source=" http://www.snowball.be/SyndicationService.asmx/GetRss " />
</Grid.Resources>

The x:Key assigns a name, which we can use in our code-behind.

We can now use this object as a datasource for a listbox, like this:

<ListBox ItemsSource="{Binding Source={StaticResource SnowballRSS}, XPath=//rss//channel//item }">
</ListBox.ItemTemplate>

We provide a value for the ItemSource, being an instance of Binding. For this Binding instance, we provide the Source property. Since we’re dealing with a resource that is defined in the XAML itself, we again use StaticResource and as value, the name of the dataprovider. A second attribute is the XPath expression, to locate the value we want to show in the listbox.

This is the result:

What happens, is that the entire XML tag is being read into a listitem. This is not desired, so we have to provide some kind of formatting, to tell WPF exactly what we want to show in the items.
This can be accomplished using a datatemplate.

We provide an instance of DataTemplate to be used as value for the ItemTemplate property of the listbox. In this datatemplate, we can specify what to show as listitem.
In the following code, I’m telling to make each listitem consist of a TextBlock. The text to be shown is taken from the surrounding Listbox (remember searching for the data up in the controltree?). In the data it finds, which is an XML tag with subnodes, we can to take the title as the value for the item.

<ListBox.ItemTemplate>
   <DataTemplate>
      <TextBlock Text="{Binding XPath=title}"></TextBlock>
   </DataTemplate>
</ListBox.ItemTemplate>

When we now run this, we get the following:

Much better, isn’t it?!

In the next part, we’re going to make the application a little bit more complete, providing a click event for the listbox, and making sure that some fields are filled in, again using databinding.

Adding the detailsform
We’ll now change the program somewhat to make it display the details of the item selected in the listbox.

We’ll add a Grid to make it easy to display 3 rows and 2 columns with textblocks, labels and textboxes.
This can be done with the following code:

<Grid>
   <Grid.RowDefinitions>
      <RowDefinition Height="30"></RowDefinition>
      <RowDefinition Height="30"></RowDefinition>
      <RowDefinition Height="*"></RowDefinition>
   </Grid.RowDefinitions>
   <Grid.ColumnDefinitions>
      <ColumnDefinition Width="0.2*"></ColumnDefinition>
      <ColumnDefinition Width="0.8*"></ColumnDefinition>
   </Grid.ColumnDefinitions>
   <TextBlock Grid.Row="0" Grid.Column="0">Title</TextBlock>
   <Label Grid.Row="0" Grid.Column="1"></Label>
   <TextBlock Grid.Row="1" Grid.Column="0">Link:</TextBlock>
   <Label Grid.Row="1" Grid.Column="1" ></Label>
   <TextBlock Grid.Row="2" Grid.Column="0">Article</TextBlock>
   <TextBox Grid.Row="2" Grid.Column="1"></TextBox>
</Grid>

After adding the Grid, we’ll also have to change the rest of the markup a little. Take a look at the sample code provided with this article to see the rest of the layout.

We now want the detail-fields display more info on the selected item in the Listbox.  Therefore, the Grid containing these fields should have its DataContext set to the item selected in the list. We do this with the following code:

<Grid DataContext="{Binding ElementName=RSSList, Path=SelectedItem}" >

The element is the name of the listbox, the path is once again the property within the source to which we’ll be binding the grid (and thus the detail fields).

Now, every time we select an item in the listbox, the grid has its datacontext set to this selected item. The fields can now get details as follows:

…
<Label Grid.Row="0" Grid.Column="1" Content="{Binding XPath=title}"></Label>
…
<Label Grid.Row="1" Grid.Column="1" Content="{Binding XPath=link}">
            </Label>
…
<TextBox Grid.Row="2" Grid.Column="1" Text="{Binding XPath=description}"></TextBox>

The result should resemble the following:

Congratulations, you built your first databound application, using WPF databinding and a simple datatemplate!

In my next (large) article, we’ll be looking at the styling tools provided by WPF to make this application look TONS better!

Something that got me puzzled today was the Button.Content property. Let me first explain the WPF Content Model.

At the very base, we have controls and containers, or as I found somewhere, “bits of content and behavior” and “containers of bits of content and behavior”. However, there are 2 special things about the content containment.

For example, a simple button. You do not have to put a string as the content of a Button. It’s then again not prohibited either, as can be seen in the following code.

  <Button HorizontalAlignment="Left"
          Width="100"
          Height=”50” >Hello</Button>

Now comes the nice part: in WPF, you can use any element as content for a button. For example, an image. Or to make it all special, why not add video to a button?

      <Button Width="100" Height="50">
        <Image Source=" http://www.google.com/images/logo_sm.gif"></Image>
      </Button>

This works, because in the end, everything is derived from ContentControl, just like many other controls, for example Label, Checkbox and even Window itself. A ContentControl, like the Button, gets its contents via the Content property. So, the following code is actually the same as the before-last example.

      <Button Width="100" Height="50" Content="Hello">

What you end up with, is a control with the behavior of the actual control, but it can display whatever you want, without needing to build special derived classes like an ImageButtonClass.

Content properties
The content properties where today’s problem.

In earlier CTP, you could write :
      <Button Name="MyButton" >
        <Button.Content>
          …
        </Button.Content>
      </Button>

As soon as I tried this, a syntax error came on my screen, saying that this property was not allowed.
After some searching, I got it working by simply omitting the content-tag, like this.

<Button Name="MyButton" >
        …
</Button>

Now that we can add content to the control, we also need to be able to build them in a nice layout.  Currently, there are 4 layoutpanels: DockPanel, StackPanel, Grid and Canvas.

In the following code, I’m making use of the Grid Panel.

<Grid>
      <Grid.RowDefinitions>
        <RowDefinition></RowDefinition>
        <RowDefinition></RowDefinition>
        <RowDefinition></RowDefinition>
      </Grid.RowDefinitions>
      <Grid.ColumnDefinitions>
        <ColumnDefinition></ColumnDefinition>
        <ColumnDefinition></ColumnDefinition>
        <ColumnDefinition></ColumnDefinition>
      </Grid.ColumnDefinitions>
      <Button Grid.Row="0" Grid.Column="0">Button1</Button>
      <Button Grid.Row="0" Grid.Column="1">Button2</Button>
      <Button Grid.Row="0" Grid.Column="2">Button3</Button>
      <Button Grid.Row="1" Grid.Column="0">Button4</Button>
      <Button Grid.Row="1" Grid.Column="1">Button5</Button>
      <Button Grid.Row="1" Grid.Column="2">Button6</Button>
      <Button Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="3">Button1</Button>
    </Grid>

And here, I make use of the Grid to make an ImageButton.

  <Button Name="MyButton" Margin="97,95.5,95,121.5" >
    <Grid>
      <Grid.RowDefinitions>
        <RowDefinition></RowDefinition>
        <RowDefinition></RowDefinition>
      </Grid.RowDefinitions>
      <Image Source="http://www.google.com/images/logo_sm.gif" Grid.Row="0"></Image>
      <TextBlock Grid.Row="1" HorizontalAlignment="Center" >Go to Google</TextBlock>
    </Grid>
  </Button>

Something else that got me scratching my head today was the following error: Error in markup file 'Window1.xaml' : Exception has been thrown by the target of an invocation.
I got this error when I write:

 <Image Source="coffeebean.bmp" Grid.Row="0"></Image>

One could think that the imagefile is corrupt, or simply not in the correct place… Well, that for sure isn’t the problem. Still haven’t figured this one out...

That’s about it for today. Hope you, like me, learned your first WPF/XAML steps. At this point, the examples are still very basic, but that will for sure change!