Adding the IGGaugeView to a UIView
Send Feedback

Glossary Item Box

Topic Overview

Purpose

This topic provides basic information about creating an instance of the IGGaugeView™ and displaying a gauge to help you get up and running with this control.

Required background

The following table lists the prerequisite topic required to understanding this topic.

Topic

Purpose

Adding the Chart Framework File

This topic explains how to add the chart framework file to a project.


In this topic


Code Examples

Code examples summary

The following table lists the code example included in this topic.

Example

Description

Displaying a gauge with IGGaugeView

The starting point for using the IGGaugeView is first to instantiate it and then add it to your view. The code in this example overrides the viewDidLoad method on a UIViewController to create the instance of the IGGaugeView.



Displaying a gauge with IGGaugeView – Code Example

Description

The IGGaugeView’s power resides in its ability to display clean high performance circular gauges in the user interface using a minimal amount of code representing a range of values. In this code example, you will:

  • Create an instance of the IGGaugeView
  • Assign a value to the IGGaugeView
  • Display and View the gauge

Preview

The following screen shot illustrates the IGGaugeView rendering of the result’s preview.

Code

Once initialized, the IGGaugeView sets both the scaleStartAngle and scaleEndAngle properties to determine the position and scale for rendering the gauge. With the rendering position angles set, the next step assigns a value to the value property for rendering the needle’s position.

In C#:

IGGaugeView gaugeView = new IGGaugeView();
gaugeView.Frame = new RectangleF(0, 0, this.View.Frame.Size.Width, this.View.Frame.Size.Height);
gaugeView.AutoresizingMask = UIViewAutoresizing.FlexibleHeight|UIViewAutoresizing.FlexibleWidth;
gaugeView.Theme = new IGGaugeThemeLight();
gaugeView.ScaleStartAngle = 180;
gaugeView.ScaleEndAngle = 0;
gaugeView.BackingShape = IGGaugeBackingShape.IGGaugeBackingShapeFitted;
gaugeView.BackingBrush = new IGBrush(UIColor.Black);
gaugeView.NeedleBrush = new IGBrush(UIColor.Orange);
gaugeView.Font = UIFont.FromName("Futura-CondensedExtraBold", 18.0f);
gaugeView.Value = 33;

In Objective-C:

    IGGaugeView *gaugeView = [[IGGaugeView alloc] init];
    gaugeView.frame = CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height);
    gaugeView.autoresizingMask = UIViewAutoresizingFlexibleHeight|UIViewAutoresizingFlexibleWidth;
    gaugeView.theme = [[IGGaugeThemeLight alloc] init];
    gaugeView.scaleStartAngle = 180;
    gaugeView.scaleEndAngle = 0;
    gaugeView.backingShape = IGGaugeBackingShapeFitted;
    gaugeView.backingBrush = [[IGBrush alloc] initWithColor:[UIColor blackColor]];
    gaugeView.needleBrush = [[IGBrush alloc] initWithColor:[UIColor orangeColor]];
    gaugeView.font = [UIFont fontWithName:@"Futura-CondensedExtraBold" size:18.0];
    gaugeView.value = 33;

The IGGaugeView is now configured and ready to add to the UIViewController as a subview.

In C#:

this.View.AddSubview(gaugeView);

In Objective-C:

    [self.view addSubview:gaugeView];

Code: Complete Listing

In C#:

public override void ViewDidLoad ()
{
      base.ViewDidLoad ();
      IGGaugeView gaugeView = new IGGaugeView();
      gaugeView.Frame = new RectangleF(0, 0, this.View.Frame.Size.Width, this.View.Frame.Size.Height);
      gaugeView.AutoresizingMask = UIViewAutoresizing.FlexibleHeight|UIViewAutoresizing.FlexibleWidth;
      gaugeView.Theme = new IGGaugeThemeLight();
      gaugeView.ScaleStartAngle = 180;
      gaugeView.ScaleEndAngle = 0;
      gaugeView.BackingShape = IGGaugeBackingShape.IGGaugeBackingShapeFitted;
      gaugeView.BackingBrush = new IGBrush(UIColor.Black);
      gaugeView.NeedleBrush = new IGBrush(UIColor.Orange);
      gaugeView.Font = UIFont.FromName("Futura-CondensedExtraBold", 18.0f);
      gaugeView.Value = 33;
      this.View.AddSubview(gaugeView);
}

In Objective-C:

- (void)viewDidLoad
{
    [super viewDidLoad];
    IGGaugeView *gaugeView = [[IGGaugeView alloc] init];
    gaugeView.frame = CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height);
    gaugeView.autoresizingMask = UIViewAutoresizingFlexibleHeight|UIViewAutoresizingFlexibleWidth;
    gaugeView.theme = [[IGGaugeThemeLight alloc] init];
    gaugeView.scaleStartAngle = 180;
    gaugeView.scaleEndAngle = 0;
    gaugeView.backingShape = IGGaugeBackingShapeFitted;
    gaugeView.backingBrush = [[IGBrush alloc] initWithColor:[UIColor blackColor]];
    gaugeView.needleBrush = [[IGBrush alloc] initWithColor:[UIColor orangeColor]];
    gaugeView.font = [UIFont fontWithName:@"Futura-CondensedExtraBold" size:18.0];
    gaugeView.value = 33;
    [self.view addSubview:gaugeView];
}

Related Content

Topics

The following topic provides additional information related to this topic.

Topic

Purpose

This section serves as an introduction to the IGGaugeView control’s key features and functions.