Tutorial20 - TeeChart for Windows Phone 7

From Steema Software Reference Wiki
Jump to: navigation, search

File:Tchwp.jpg


TeeChart for Windows Phone 7

Working with TeeChart for Windows Phone 7 is going to be familiar to anybody with experience of both the TeeChart API and Silverlight. However, there are some issues specific to the platform which we will cover here.

Installing the Visual Studio 2010 plugin

At the time of writing, all the tools necessary for development on the Windows Phone 7 platform can be downloaded from "App Hub" (http://create.msdn.com). From the link on the front page, all the necessary free tools can be downloaded. Please note that these tools will only work on Windows 7 or above. The TeeChart .NET for Windows Phone assembly also depends on the Silverlight for Windows Phone Toolkit, which at the time of writing can be downloaded from Codeplex (http://silverlight.codeplex.com/). Assemblies from this Toolkit are also referenced in the TeeChart .NET Windows Phone 7 example.


Running the Windows Phone 7 example

The installer for TeeChart for .NET for Visual Studio 2010 will automatically install an example project for Windows Phone 7 when run on Windows 7. This example can be found in the Example folder under the folder DemoProjectWindowsPhone. The project can be opened in Visual Studio 2010 with the Windows Phone 7 plugin and the Silverlight for Windows Phone Toolkit installed and run either in a Windows Phone 7 device or in the emulator.


API changes specific to TeeChart .NET for Windows Phone 7

Steema.TeeChart.Silverlight.Drawing.Aspect.RenderSeriesAsImage

The RenderSeriesAsImage boolean property gets or sets whether TeeChart renders the Series and its points within a bitmap image or not. When TeeChart does render the Series as a bitmap image, pinching and dragging the chart is quicker for high numbers of points with the cost of reduced pixel resolution when the Series is zoomed to a large scale.

Steema.TeeChart.Silverlight.Drawing.Aspect.GestureOptions 

The GestureOptions property gets or sets an enum (Gestures) which controls to which gesture movements the TeeChart .NET for Windows Phone 7 responds. So we can set this property to Gestures.None, in which case the control will not respond to either pinch or drag gestures, to Gestures.PinchOnly, Gestures.DragOnly or Gestures.PinchAndDrag.

Steema.TeeChart.Silverlight.Drawing.Aspect.GestureStyle

The GestureStyles property gets or sets an enum (GestureStyles) which controls how TeeChart .NET for Windows Phone 7 responds to pinch and drag gestures. So we can set this property to GestureStyles.InChart, in which case the TeeChart series and axes will respond independently to pinch and drag gestures, or to GestureStyles.FullChart in which case the entirety of TeeChart responds to them.

Important differences between TeeChart .NET for Windows Phone 7 and other TeeChart versions

While every effort has been made to maintain a high level of performance in terms of zoom (pinch) and scroll (drag) and to maintain the intuitiveness of the TeeChart API across all platforms, in the case of TeeChart for Windows Phone 7 several compromises have had to be made.

As far as we know, everything that can be done with TeeChart on other platforms can also be done on Windows Phone 7 with either pinch and drag deactivated (GestureOptions = Gestures.None) or by using the FullChart pinch and drag (GestureStyle = GestureStyles.FullChart). With the InChart pinch and drag activated (GestureStyle = GestureStyles.InChart and GestureOptions != Gestures.None) there are going to be instances in which some techniques of working with TeeChart are valid in all platforms other than Windows Phone 7. As an example of this, consider the case of wanting to draw some text onto the chart which follows a series point as it is zoomed and scrolled. In Windows Forms, we would achieve this using the following code:


   Points points;
private void InitializeChart()
{
tChart1.Aspect.View3D = false;
tChart1.AfterDraw += new PaintChartEventHandler(tChart1_AfterDraw);
tChart1.Series.Add(point = new Points());
point.FillSampleValues();
}
void tChart1_AfterDraw(object sender, Graphics3D g)
{
int x = point.CalcXPosValue(point[3].X);
int y = point.CalcYPosValue(point[3].Y);
g.Font.Color = Color.Red;
g.Font.Size = 16;
g.TextOut(x, y, "MyText");
}


The equivalent code in Windows Phone 7 is this:


   Points point;
private void InitializeChart()
{
tChart1.Aspect.View3D = false;
tChart1.AfterDraw += new PaintChartEventHandler(tChart1_AfterDraw);
tChart1.Series.Add(point = new Points());
point.FillSampleValues();
}
void tChart1_AfterDraw(object sender, Graphics3D g)
{
double x = point.CalcXPosValue(point[3].X);
double y = point.CalcYPosValue(point[3].Y);
g.Font.Color = Colors.Red;
g.Font.Size = 16;
g.TextOut(x, y, "MyText");
}


However, these two code snippets do not produce the same results on screen. To achieve the same effect, we will have to modify the Windows Phone 7 snippet thus:


   Points point;
private void InitializeChart()
{
tChart1.Aspect.View3D = false;
//tChart1.AfterDraw += new PaintChartEventHandler(tChart1_AfterDraw);
tChart1.Series.Add(point = new Points());
point.AfterDrawValues += new PaintChartEventHandler(point_AfterDrawValues);
point.FillSampleValues();
}
void point_AfterDrawValues(object sender, Graphics3D g)
{
double x = point.CalcXPosValue(point[3].X);
double y = point.CalcYPosValue(point[3].Y);
g.Font.Color = Colors.Red;
g.Font.Size = 16;
g.TextOut(x, y, "MyText");
}


The reason for this is that under these circumstances, TeeChart for Windows Phone 7 is rendering different Chart elements to multiple canvases, when normally it renders all Chart elements to one canvas. So to enable the text to move with the elements on the series canvas, an event has to be chosen which draws on this same canvas, in this case the Series' AfterDrawValues event. The Chart's AfterDraw event draws to a different canvas in this scenario.