A few weeks back I posted a WPF-based chart in my blog. Currently in one of my projects I need to deploy charts that support displaying multiple data series side-by-side and showing the value tick on the top similar as Google Finance charts does. So based on my previous WPF chart, I developed this “another chart” that can support multiple series. Here I also used the performance optimization with streamGeometry to enhance the chart memory consumption and response speed. I have to admit this chart is heavily inspired by the features in the Google Finance charts.

You can take a look at the final chart in action:

[Updated 8/4/2008]

The download link has been updated. CLick the following link to download the source code:

Several weeks ago I posteda sample progress bar using rectangle overlay to achieve gradient looking and text overlay. But that control was C# code-driven to update the UI. Here I’ve improved it to utilize ValueConverters and Data Binding, so you can update its source data and the UI can automatically updates.

The XAML part of the ProgressBar control is listed as following. I am using two-column grid to simulate the progress bar container:

Then you can define your custom ValueConverter to convert percentage progress values to grid column widths. The following shows the ValueConverter for the ProgressBar Column Width property inside the parent grid:

You can create other types of ValueConverter to suit your needs.

Once you are done , then in your code you can easily adjust your progress data without manually coding against the Progress Bar UI anymore:

This has advantages in situations where you need to implement data-driven applications without in-depth knowledge of the visualization layer.

The finished UI will look like this:

[Update 8/27/2007]

After some study of the ControlTemplate in WPF, especially those special meaning PART elements in a control template, I realized this could be implemented with a ControlTemplate with all XAML approach.

The key to the control template is to use the PART_Track and PART_Indicator element to contain the rectangle areas.

Have you run into situations where you need your data-bound textbox update the underlying data automatically while you are typing? So when you hit the ‘Enter’ key, your keyboard event handler can examine the entered data right away?

The key is to use the “PropertyChanged” binding behavior. For a more complete review of UpdateSourceTrigger, you can take a look at its MSDN document. Now I wish the Visual Studio 2008 XAML editor can do IntelliSense of this while I am manually entering the data binding codes. It can at least save me 5 min research time 🙂

The Ciderdesigner in Visual Studio 2008 still has a very long way to go to match what Windows Forms designer offers now in Visual Studio 2005.

In my first part of performance tuning techniques, I’ve reviewed some general approaches. Now I want to show you how to fine tune your ListView for sorting and displaying HUGE amount of rows. In this demo, I will show you that by using a custom sorter and virtualizingstackpanel, your sorting speed is about 100 times faster!

VirtualizingStackPanel.IsVirtualizing=”True”

First you need to specify the above property to true in your ListView, (this is the default value for ListView in WPF).

Then next, you need to use custom sorter, instead of SortDescriptions as described in my earlier blog. The key is using the CustomSort property of ListCollectionView:ListCollectionView view = (ListCollectionView)CollectionViewSource.GetDefaultView(myListView.ItemsSource);

Then in your ColumnHeader click event handler, you add something like the following:

view.CustomSort = sorter;
myListView.Items.Refresh();

Where sorter is a custom class you implement the IComparer interface.

Here is the demo of this custom (much faster!) sort program to sort 200,000 rows in a virtualized ListView in WPF:

In the demo, you see the custom sort takes about only 1.6 – 2 seconds to sort. I tried this 200,000 rows with SortDescriptions, and it takes about 3 minutes (~ 167 – 180 seconds) to sort this many rows. This is tested on both the .Net Framework 3.0 and the just released .Net Framework 3.5 Beta 2. Now you can enjoy a much more scalable ListView in WPF. 🙂

[Update 8/1/2007]

I’ve uploaded the project source code to demonstrate this sorting technique. You can get it here. You’ll need Visual Studio 2008 Beta 2 to open the solution file (or project file).

[Update 8/3/2007]

A modified version of the sample to support sorting multiple columns is posted here. You’ll need Visual Studio 2008 Beta 2 to open the solution file (or project file).

oWPF builds on the new add-in model in .NET Framework 3.5 Beta 2 to allow developers to create visual add-ins, where add-ins provide UIs that are displayed by the host application. You’ll find the add-in types in the System.AddIn namespace in System.AddIn.dll, System.AddIn.Contract.dll, and System.Windows.Presentation.dll.

oXBAPs can now run in FireFox.

oCookies can be shared between XBAPs and Web applications from the same site of origin.

oImprovements have been made to BindingListCollectionView to provide better support for binding to a collection that is of type BindingList and for LINQ.

oThe behavior of data bindings with a CollectionView over an IEnumerable has been improved to provide better performance and better support for binding to results that are produced by LINQ.

3D

UIElement concepts such as input, focus, and eventing have been brought to 3D. (new classes: System.Windows.UIElement3D which is abstract, and ContainerUIElement3D and ModelUIElement3D in the System.Windows.Media.Media3D namespace)

The annotations framework now exposes the capabilities for matching annotations with the corresponding annotated objects. (new interface IAnchorInfo and new class TextAnchor in the System.Windows.Annotations namespace)

I am hitting more issues with anti-alias in WPF. While it is frustrated to see there is no anti-alias support for 3D in WPF on Windows XP, it is even stranger to see that the text rendering in WPF has always-on anti-alias without giving developer the option to turn it off! Take a quick look at this threadon MSDN Forum, you will surprisingly find out how many people are frustrated with the same issue — poor design or poor implementation of WPF.

In a short word, WPF should give developers the option to turn on/off anti-alias feature in text rendering, and in 3D. Without such options, WPF suffers a major design flaw and poor quality comparing to Adobe Flash/Flex platform. I don’t see any blurry text out of Flash, while I see plenty of such on WPF. Why this “superior” and “future of UI development” technology from Microsoft renders text so poorly? Come on, we are in 2007 already and our computers are far more capable than just rendering clear text. My Windows Forms 2.0 text rendering is much clearer than WPF! The following illustrated the subtle differences between these three text rendering results:

XAML-based Text Rendering:

Adobe Flex2-based Text Rendering:

Windows Forms 2.0-based Text Rendering:

You can see both Windows Forms and Flex render textual information in a much readable way. And there is no way in WPF to turn this strange “anti-alias” off in text rendering. If you happen to know the tricks to make the look of small fonts in WPF looks better, I’d highly appreciate!

[Update 8/18/2007]

See this blog post on Text Anti-alias rendering in WPF. I found it useful when you want to fine tune your text appearing in XAML apps.