Infragistics logo
메뉴
.NET and JavaScript UI Controls
Version

Creating a Digital WebGauge Using Code

This tutorial walks you through the process of creating a Digital gauge using code. At the end of this walkthrough, you will have created a Digital gauge that represents a digital radio.

To create a Digital gauge using code:

  1. Before you start writing any code, you should place using/Imports directives in your code-behind so you don’t need to always type out a member’s fully qualified name.

In Visual Basic:

Imports Infragistics.UltraGauge.Resources

In C#:

using Infragistics.UltraGauge.Resources;

  1. Create an instance of a Digital gauge and the brush element instances.

In Visual Basic:

Dim ultraGauge1 As New Infragistics.WebUI.UltraWebGauge.UltraGauge()
Dim myDigitalGauge As New SegmentedDigitalGauge()
Dim mySolidFillBrushElement As New SolidFillBrushElement()
Dim mySolidFillBrushElement1 As New SolidFillBrushElement()

In C#:

Infragistics.Web.UltraWebGauge.UltraGauge ultraGauge1 =
  new Infragistics.WebUI.UltraWebGauge.UltraGauge();
SegmentedDigitalGauge myDigitalGauge = new SegmentedDigitalGauge();
SolidFillBrushElement mySolidFillBrushElement = new SolidFillBrushElement();
SolidFillBrushElement mySolidFillBrushElement1 = new SolidFillBrushElement();

  1. Set the background color to Black.

In Visual Basic:

mySolidFillBrushElement.Color = System.Drawing.Color.Black
myDigitalGauge.BrushElement = mySolidFillBrushElement

In C#:

mySolidFillBrushElement.Color = System.Drawing.Color.Black;
myDigitalGauge.BrushElement = mySolidFillBrushElement;

  1. Set the number of digits.

In Visual Basic:

myDigitalGauge.Digits = 8

In C#:

myDigitalGauge.Digits = 8;

  1. Set the font color to Red.

In Visual Basic:

mySolidFillBrushElement1.Color = System.Drawing.Color.Red
myDigitalGauge.FontBrushElement = mySolidFillBrushElement1

In C#:

mySolidFillBrushElement1.Color = System.Drawing.Color.Red;
myDigitalGauge.FontBrushElement = mySolidFillBrushElement1;

  1. Set the mode to 14-segment and the digit text to FM : 96.4.

In Visual Basic:

myDigitalGauge.Mode = SegmentMode.FourteenSegment
myDigitalGauge.Text = "FM : 96.4"

In C#:

myDigitalGauge.Mode = SegmentMode.FourteenSegment;
myDigitalGauge.Text = "FM : 96.4";

  1. Add the Digital gauge to the Gauges collection. Set the following properties for your gauge:

    • Width = 200

    • Height = 200

In Visual Basic:

ultraGauge1.Gauges.Add(myDigitalGauge)
ultraGauge1.Width = Unit.Pixel(200)
ultraGauge1.Height = Unit.Pixel(200)
Me.Controls.Add(ultraGauge1)

In C#:

ultraGauge1.Gauges.Add(myDigitalGauge);
ultraGauge1.Width = Unit.Pixel(200);
ultraGauge1.Height = Unit.Pixel(200);
this.Controls.Add(ultraGauge1);

  1. Save and your web page.

Shows the Digital gauge that is produced using the code above.