IOSTutorial8

From Steema Software Reference Wiki
Jump to: navigation, search

Net iphone.png

Contents page
Previous | Next

Tutorial8 - iOS Applications


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

Installing the MonoDevelop IDE and MonoTouch

At the time of writing, taking into account that we can can only create our iPad and iPhone applications from a MAC, all the tools and APIs necessary for development on the iOS platform are :
Xcode 4 http://developer.apple.com/xcode/
Mono framework http://www.go-mono.com/mono-downloads/download.html
MonoDevelop IDE http://monodevelop.com/
MonoTouch http://ios.xamarin.com/  

The following link will take you to an explanation of the steps necessary to correctly install the components listed above:
http://docs.xamarin.com/ios/getting_started/installation

Running the iPhone example


The installer for TeeChart NET for iOS will automatically install some example projects for Apple iPhone and iPad when run on MAC. This examples can be found in the Examples folder under the installation folder . The project can be opened in MonoDevelop with the MonoTouch for iOS license installed and run either in a iPhone/iPad device or in the emulator.

API changes specific to TeeChart .NET for iOS

Steema.TeeChart.TChart as UIView

The TChart component inherits from the UIView class, which allows us to add one or various TChart components within one View, and therefore use all the functionality of just one View

Steema.TeeChart.Drawing.Aspect.ZoomScrollStyles
The ZoomScrollStyles property gets or sets an enum (ZoomScrollStyles) which controls to which gesture movements the TeeChart .NET for IOS responds. So we can set this property to ZoomScrollStyles.Manual, in which case the control will not respond to either iOS generic pinch or drag gestures, to ZoomScrollStylesAuto that will make to change the behavior.

Steema.TeeChart.Drawing.Aspect.ZoomStyles

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

Important differences between TeeChart .NET for iOS 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 iOS 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 iOS with either pinch and drag deactivated (ZoomScrollStyles=Manual) or by using the FullChart pinch and drag (ZoomStyles= FullChart). With the InChart pinch and drag activated (ZoomStyles= InChart and ZoomScrollStyles != Gestures.Manual) there are going to be instances in which some techniques of working with TeeChart are valid in all platforms other than iOS. 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.  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 MonoDevelop with MonoTouch 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 iOS code 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 NET for iOS 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.



PREVIOUS

NEXT


© 1998-2017 Steema Software SL. All rights reserved.