Configuring Gauge Interactions
Send Feedback

Glossary Item Box

Topic Overview

Purpose

This topic provides an introductory overview of interacting with the IGLinearGaugeView™ control and demonstrates how to configure it using a code example.

In this topic


Introduction

Interactions summary

The IGLinearGaugeView provides two methods for touch interactions used in combination with the gesture recognizers.

  • needleAtPoint: - Returns whether the needle exists at a specified point
  • valueForPoint: - Returns a value for any given point on the gauge view

The code snippet below contains the UITapGestureReconizer selector method, demonstrating the use of the valueForPoint method when a user taps on the IGLinearGaugeView area.

In C#:

void Tap(UITapGestureRecognizer gesture)
{
      PointF pointForView = gesture.LocationInView(_gauge);
      float val = _gauge.ValueForPoint(pointForView);
      if (val >= _gauge.MinimumValue) _gauge.Value = val;
}

In Objective-C:

-(void)tap:(UITapGestureRecognizer*)gesture
{
    CGPoint pointForView = [gesture locationInView:_gauge];
    CGFloat val = [_gauge valueForPoint:pointForView];
    if(val >= _gauge.minimumValue)
        _gauge.value = val;
}

Configuring IGLinearGaugeView Interactions – Code Example

Description

The code below creates an instance of the IGLinearGaugeView with a default range of 0 to 100, adds a pan gesture recognizer allowing the gauge needle to move dynamically as the user drags their finger around the control and finally adds a gesture recognizer to the IGLinearGaugeView allowing users to drag the needle to a new location.

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.

Code

In C#:

IGLinearGaugeView _gauge;
bool _isDragging;
public LinearGaugeInteractions_CSViewController ()
{
}
public override void ViewDidLoad ()
{
      base.ViewDidLoad ();
      
      RectangleF gaugeRect = this.View.Bounds;
      gaugeRect.Height = 250;
      gaugeRect.Y = (this.View.Bounds.Height / 2) - 125;
      _gauge = new IGLinearGaugeView();
      _gauge.Frame = gaugeRect;
      _gauge.AutoresizingMask = UIViewAutoresizing.FlexibleHeight | UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleTopMargin | UIViewAutoresizing.FlexibleBottomMargin;
      _gauge.TransitionDuration = 0.25f;
      _gauge.Value = 82;
      this.View.AddSubview(_gauge);
      UIPanGestureRecognizer panGesure = new UIPanGestureRecognizer(Pan);
      _gauge.AddGestureRecognizer(panGesure);
      UITapGestureRecognizer tapGesture = new UITapGestureRecognizer(Tap);
      _gauge.AddGestureRecognizer(tapGesture);
}
void Pan(UIPanGestureRecognizer gesture)
{
      PointF pointForView = gesture.LocationInView(_gauge);
      if (gesture.State == UIGestureRecognizerState.Began) {
            _isDragging = _gauge.NeedleAtPoint(pointForView);
            _gauge.TransitionDuration = 0;
            return;
      }
      else if (gesture.State == UIGestureRecognizerState.Ended) {
            _gauge.TransitionDuration = 0.25f;
      }
      if (_isDragging) {
            double val = _gauge.ValueForPoint(pointForView);
            if (val >= _gauge.MinimumValue) _gauge.Value = val;
            else if (_gauge.Value >= ((_gauge.MinimumValue + _gauge.MaximumValue) / 2)) _gauge.Value = _gauge.MaximumValue;
            else _gauge.Value = _gauge.MinimumValue;
      }
}
void Tap(UITapGestureRecognizer gesture)
{
      PointF pointForView = gesture.LocationInView(_gauge);
      double val = _gauge.ValueForPoint(pointForView);
      if (val >= _gauge.MinimumValue) _gauge.Value = val;
}

In Objective-C:

@interface igViewController ()
{
    IGLinearGaugeView *_gauge;
    BOOL _isDragging;
}
@end
@implementation igViewController
- (void)viewDidLoad
{
    [super viewDidLoad];
    CGRect gaugeRect = self.view.bounds;
    gaugeRect.size.height = 250;
    gaugeRect.origin.y = (self.view.bounds.size.height / 2) - 125;
    self.view.backgroundColor = [UIColor blackColor];
    _gauge = [[IGLinearGaugeView alloc]initWithFrame:gaugeRect];
    _gauge.autoresizingMask = UIViewAutoresizingFlexibleHeight|UIViewAutoresizingFlexibleWidth|UIViewAutoresizingFlexibleTopMargin|UIViewAutoresizingFlexibleBottomMargin;
    _gauge.transitionDuration = 0.25;
    _gauge.value = 82;
    [self.view addSubview:_gauge];
    UIPanGestureRecognizer* panGesure = [[UIPanGestureRecognizer alloc]initWithTarget:self action:@selector(pan:)];
    [_gauge addGestureRecognizer:panGesure];
    UITapGestureRecognizer* tapGesture = [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(tap:)];
    [_gauge addGestureRecognizer:tapGesture];
}
-(void)pan:(UIPanGestureRecognizer*)gesture
{
    CGPoint pointForView = [gesture locationInView:_gauge];
    if(gesture.state == UIGestureRecognizerStateBegan)
    {
        // Check to see if the needle is at the specified point.
        _isDragging = [_gauge needleAtPoint:pointForView];
        _gauge.transitionDuration = 0;
        return;
    }
    else if(gesture.state == UIGestureRecognizerStateEnded)
    {
        _gauge.transitionDuration = 0.25;
    }
    if(_isDragging)
    {
        // Find a value on the gauge at a specific point.
        double val = [_gauge valueForPoint:pointForView];
        if(val >= _gauge.minimumValue)
            _gauge.value = val;
        else if(_gauge.value >= ((_gauge.minimumValue + _gauge.maximumValue)/2))
            _gauge.value = _gauge.maximumValue;
        else
            _gauge.value = _gauge.minimumValue;
    }
}
-(void)tap:(UITapGestureRecognizer*)gesture
{
    CGPoint pointForView = [gesture locationInView:_gauge];
    double val = [_gauge valueForPoint:pointForView];
    if(val >= _gauge.minimumValue)
        _gauge.value = val;
}
@end

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 IGLinearGaugeView control’s supported features.