Configuring Ranges
Send Feedback

Glossary Item Box

Topic Overview

Purpose

This topic provides a conceptual overview of ranges with the IGBulletGraphView™ control and demonstrates how to configure them using a code example.

In this topic


Introduction

Ranges summary

A range highlights a set of continuous values bound by a specified minimum and maximum Value on a scale. To add a range to the IGBulletGraphView, create an IGLinearGaugeRange object and assign values to the following properties:

  • brush
  • startValue
  • endValue

With the brush, start, and end values defined, the linear gauge range needs a width of the area to fill. The IGLinearGaugeRange has four properties.

  • innerStartExtent - The start position of the inner part of the range measured from the center of the gauge. The value of this property should be between 0 and 1.
  • innerEndExtent - The end position of the inner part of the range measured from the center of the gauge. The value of this property should be between 0 and 1.
  • outerStartExtent - The start position of the outer part of the range measured from the center of the gauge. The value of this property should be between 0 and 1.
  • outerEndExtend - The end position of the outer part of the range measured from the center of the gauge. The value of this property should be between 0 and 1.

Use the IGBulletGraphView control’s addRange: method to add the IGLinearGaugeRange.


Configuring Ranges – Code Example

Description

The code below creates an instance of the IGBulletGraphView with a value of 75, a target value of 82, and adds a range to the IGBulletGraphView represented by the color green.

Prerequisites

This code example requires the inclusion of the Chart framework; details about how to add this framework are available in the Adding the Chart Framework File topic.

Preview

The following image previews the IGBulletGraphView as rendered using the following code snippet.

Code

In Objective-C:

CGRect bulletGraphRect = self.view.bounds;
bulletGraphRect.size.height = 250;
bulletGraphRect.origin.y = (self.view.bounds.size.height / 2) - 125;
IGBulletGraphView *bulletGraph = [[IGBulletGraphView alloc] initWithFrame:bulletGraphRect];
bulletGraph.autoresizingMask = UIViewAutoresizingFlexibleHeight|UIViewAutoresizingFlexibleWidth|UIViewAutoresizingFlexibleTopMargin|UIViewAutoresizingFlexibleBottomMargin;
bulletGraph.minorTickBrush = bulletGraph.tickBrush = bulletGraph.fontBrush = [[IGBrush alloc] initWithR:0.33 andG:0.33 andB:0.33 andA:1];
bulletGraph.targetValueBrush = [[IGBrush alloc] initWithR:0.15 andG:0.15 andB:0.15 andA:1];
bulletGraph.targetValueBreadth = 10;
bulletGraph.targetValue = 82;
bulletGraph.valueBrush = [[IGBrush alloc] initWithColor:[UIColor grayColor]];
bulletGraph.valueOutline = [[IGBrush alloc] initWithColor:[UIColor darkGrayColor]];
bulletGraph.value = 75;
[self.view addSubview:bulletGraph];
IGLinearGaugeRange *range1 = [[IGLinearGaugeRange alloc] init];
range1.brush = [[IGBrush alloc] initWithR:0.15 andG:0.5 andB:0.15 andA:1.0];
range1.startValue = 0;
range1.endValue = 100;
range1.outerStartExtent = 0.2;
range1.outerEndExtent = 0.4;
[bulletGraph addRange:range1];

In C#:

RectangleF bulletGraphRect = this.View.Bounds;
bulletGraphRect.Height = 250;
bulletGraphRect.Y = (this.View.Bounds.Height / 2) - 125;
IGBulletGraphView bulletGraph = new IGBulletGraphView ();
bulletGraph.Frame = bulletGraphRect;
bulletGraph.AutoresizingMask = UIViewAutoresizing.FlexibleHeight | UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleTopMargin | UIViewAutoresizing.FlexibleBottomMargin;
bulletGraph.MinorTickBrush = bulletGraph.TickBrush = bulletGraph.FontBrush = new IGBrush (0.33f, 0.33f, 0.33f, 1.0f);
bulletGraph.TargetValueBrush = new IGBrush (0.15f, 0.15f, 0.15f, 1.0f);
bulletGraph.TargetValueBreadth = 10;
bulletGraph.TargetValue = 82;
bulletGraph.ValueBrush = new IGBrush (UIColor.Gray);
bulletGraph.ValueOutline = new IGBrush (UIColor.DarkGray);
bulletGraph.Value = 75;
this.View.Add (bulletGraph);
IGLinearGaugeRange range1 = new IGLinearGaugeRange();
range1.Brush = new IGBrush(0.15f, 0.5f, 0.15f, 1.0f);
range1.StartValue = 0;
range1.EndValue = 100;
range1.OuterStartExtent = 0.2f;
range1.OuterEndExtent = 0.4f;
bulletGraph.AddRange(range1);

Related Content

Topics

The following topic provides additional information related to this topic.

Topic

Purpose

The topics in this group cover enabling, configuring, and using the IGBulletGraphView control’s supported features.