Bullet Graph for WPF, Silverlight, WinRT and Windows Phone

2013-05-27T13:00:00.000-07:00

Overview

This article describes the development of custom bullet graph control in the following Cross Platforms

WPF for Desktop Applications
Silverlight for Web Applications
WinRT for Touch and Desktop Apps
WIndows Phone for Mobile Applications

Bullet Graph

A bullet graph is a variation of Bar Chart developed by Stephen Few in 2005. The bullet graph is mainly used in the Business Dashboard Design. The design specifications for Bullet Graph can be found at "Stephen Few - Bullet Graph Design Specifications".The specification is below.

How to Download BulletGraph Control

I implemented and published the bullet graph control in the Nuget Server.

First of all download the bullet graph control for your specified platform from the following links

After installing the package, the following are the steps to create bullet graph in XAML

For WPF Bullet Graph, import the following namespace

Collapse | Copy Code

 xmlns:sparrow="http://sparrowtoolkit.codeplex.com/wpf"

For SIlverlight Bullet Graph, import the following namespace

Collapse | Copy Code

 xmlns:sparrow="http://sparrowtoolkit.codeplex.com/wpf"

For WinRT Bullet Graph, import the following namespace

Collapse | Copy Code

 xmlns:sparrow="using:Sparrow.BulletGraph"

For Windows Phone 7.1 Bullet Graph, import the following namespace

Collapse | Copy Code

 xmlns:sparrow="clr-namespace:Sparrow.BulletGraph;assembly=Sparrow.BulletGraph.WP7.45"

For Windows Phone 8 Bullet Graph, import the following namespace

Collapse | Copy Code

 xmlns:sparrow="clr-namespace:Sparrow.BulletGraph;assembly=Sparrow.BulletGraph.WP8.45"

Then Create the Bullet graph Control in the XAML

Collapse | Copy Code

  <sparrow:BulletGraph Minimum="0" Interval="500" MinorTickStep="3" PerformanceMeasure="1700" ComparativeMeasureSpacing="0.3"   ComparativeMeasure="2100"   Maximum="2500"  Height="45" VerticalAlignment="Center">
                        <sparrow:QualitativeRange Maximum="2000" Fill="#D8D8D8"/>
                        <sparrow:QualitativeRange Maximum="1400" Fill="#7F7F7F"/>
                        <sparrow:QualitativeRange Maximum="2500" Fill="#EBEBEB"/>
  </sparrow:BulletGraph>

The final result are below

Bullet Graph control in WinRT

BulletGraph Control in Windows Phone

BulletGraph Control in WPF

BulletGraph Control in Silverlight

Styling and Customization

Collapse | Copy Code

  <sparrow:BulletGraph Orientation="Vertical" ScalePosition="Opposed" Minimum="0" Interval="500" MinorTickStep="3" PerformanceMeasure="1700" ComparativeMeasureSpacing="0.3"   ComparativeMeasure="2100"   Maximum="2500"  Width="60" VerticalAlignment="Center">
                <sparrow:QualitativeRange Maximum="2000" Fill="#FF35A02E"/>
                <sparrow:QualitativeRange Maximum="1400" Fill="#FFFFFF01"/>
                <sparrow:QualitativeRange Maximum="2500" Fill="#FFFE0000"/>
 </sparrow:BulletGraph>

Conclusion

With this article i have demonstrated the way to implement the cross platform based bullet graph custom control via this you can use bullet graph for Business Dashboard design or Data Visualization purpose.

Designer Debugging in WinRT

2013-05-09T10:48:00.000-07:00

The following are the steps to debug the visual studio designer for WinRT Projects

1.Open the WinRT Project that designer needs to debug

2.Note the (XDesProc process id from the TaskManager as shown in the below image)

3.Open the Same Solution in Another Window

4.Note the New XDesProc process id from the taskmanager this is designer's process needs to debug

5.Go to Debug->Attach To Process in Visual Studio 2012 from the FirstSolution

6.Select the new XDesProc process from the Window

7.Before clicking the Attach important to Change the Attach To ->Managed 4.0,4.5 from the Select Button

8.Boom your BreakPoints in the FirstSolution got Hitted

Ha Ha.... Now you can play with the designer...:)

vinoth kumar

Bullet Graph for WPF, Silverlight, WinRT and Windows Phone

Bullet Graph for WPF, Silverlight, WinRT and Windows Phone

Overview

Bullet Graph

Styling and Customization

Conclusion

I have won the free RadControls for Windows 8 licenses in Telerik's challenge

I have won the free RadControls for Windows 8 licenses in Telerik's challenge

Source:http://www.silverlightshow.net/news/Winners-of-2-free-RadControls-for-Windows-8-licenses-in-Telerik-s-challenge.aspx

Designer Debugging in WinRT