Xamarin.iOS Documentation | ComponentOne
Controls / Gauge / Quick Start: Add and Configure Gauge
In This Topic
    Quick Start: Add and Configure Gauge
    In This Topic

    This section describes how to add a C1Gauge controls to your iOS app and set its value.

    Add C1Gauge control in StoryBoard

    1. In the Solution Explorer, click MainStoryboard to open the storyboard editor.
    2. Under the Document Outline, expand View Controller and click View.
    3. In the Toolbox under Custom Components tab, drag a C1LinearGuage, C1RadialGauge, or C1BulletGraph onto the View Controller.

    Initialize C1Gauge control in code

    To initialize C1Gauge control, open the ViewController file from the Solution Explorer and replace its content with the code below. This overrides the ViewDidLoad method of the View controller in order to initialize a C1LinearGauge, C1BulletGraph, and C1RadialGauge.

    C#
    Copy Code
    private const double DefaultValue = 25;
    private const double DefaultMin = 0;
    private const double DefaultMax = 100;
    
    C1LinearGauge linearGauge;
    C1RadialGauge radialGauge;
    C1BulletGraph bulletGraph;
    
    public override void ViewDidLoad()
        {
                base.ViewDidLoad();
                this.EdgesForExtendedLayout = UIRectEdge.None;
                linearGauge = new C1LinearGauge();
                radialGauge = new C1RadialGauge();
                bulletGraph = new C1BulletGraph();
    
                linearGauge.Value = DefaultValue;
                linearGauge.Min = bulletGraph.Min = radialGauge.Min = DefaultMin;
                linearGauge.Max = bulletGraph.Max = radialGauge.Max = DefaultMax;
                linearGauge.Value = bulletGraph.Value = radialGauge.Value = DefaultValue;
                bulletGraph.Bad = 20;
                bulletGraph.Good = 75;
                bulletGraph.Target = 70;
                this.View.BackgroundColor = linearGauge.BackgroundColor = bulletGraph.BackgroundColor = radialGauge.BackgroundColor = UIColor.White;
                this.Add(linearGauge);
                this.Add(radialGauge);
                this.Add(bulletGraph);
            }
    
            public override void ViewDidLayoutSubviews()
            {
                base.ViewDidLayoutSubviews();
                linearGauge.Frame = new CGRect(this.View.Frame.X, this.View.Frame.Y,
                             this.View.Frame.Width, this.View.Frame.Height/6);
    
                bulletGraph.Frame = new CGRect(this.View.Frame.X, this.View.Frame.Height / 3,
                             this.View.Frame.Width, this.View.Frame.Height / 6);
    
                radialGauge.Frame = new CGRect(this.View.Frame.X, this.View.Frame.Height * 2 / 3, this.View.Frame.Width, this.View.Frame.Height/3);
    
            }