Siticone Logo
Siticone UI
DOCS
v2025.12.15
Docs Analog Gauge

Siticone Analog Gauge

The SiticoneAnalogGauge is a skeuomorphic, highly detailed circular instrument designed to replicate the look and feel of physical gauges. It features realistic elements such as bezels, glass reflections, needle oscillation, and shadows, along with a powerful theming engine supporting styles like Automotive, Aviation, and Vintage.

Values & Scale

Properties defining the measurement range, current reading, and units.

Property Type Description & Usage Example
CurrentReading double gauge.CurrentReading = 80; The current value displayed by the needle. Setting this triggers a smooth animation to the new value (if smoothing is enabled).
MinimumValue double gauge.MinimumValue = 0; The starting value of the scale.
MaximumValue double gauge.MaximumValue = 220; The ending value of the scale.
DecimalPlaces int gauge.DecimalPlaces = 1; Number of decimal places to show in the center value display.
MeasurementUnit string gauge.MeasurementUnit = "PSI"; Text label appended to the value or displayed on the face (e.g., "km/h", "RPM").

Appearance & Themes

Controls for the visual style, including built-in themes and glass effects.

Property Type Description & Usage Example
DialTheme AnalogDialTheme gauge.DialTheme = AnalogDialTheme.Vintage; Applies a complete visual style. Options: Automotive, Aviation, Marine, Industrial, Vintage, Racing, Modern, Steampunk, etc.
DialFaceColor Color gauge.DialFaceColor = Color.Black; Background color of the gauge dial.
ShowBezel bool gauge.ShowBezel = true; Displays the outer ring (bezel) of the gauge.
BezelColor Color gauge.BezelColor = Color.Silver; Color of the bezel ring.
ShowGlassEffect bool gauge.ShowGlassEffect = true; Adds a glossy reflection overlay to simulate a glass cover.
ShowShadow bool gauge.ShowShadow = true; Adds a drop shadow behind the gauge for depth.

Needle Configuration

Customize the pointer, including style, oscillation (jitter), and center cap.

Property Type Description & Usage Example
NeedleStyle AnalogNeedleStyle gauge.NeedleStyle = AnalogNeedleStyle.Classic; Shape of the needle. Options: Classic, Modern, Triangular, Arrow, Thin, Bold.
NeedleColor Color gauge.NeedleColor = Color.Red; Color of the needle.
EnableNeedleOscillation bool gauge.EnableNeedleOscillation = true; Adds a subtle, realistic jitter to the needle, simulating mechanical vibration or sensor noise.
ShowCenterCap bool gauge.ShowCenterCap = true; Displays the cap at the pivot point of the needle.
CenterCapStyle AnalogPointerCap gauge.CenterCapStyle = AnalogPointerCap.Round; Shape of the center cap. Options: Round, Square, Diamond, Cross.

Ticks & Redline

Fine-tune the dial scale marks, numbering, and safety zones.

Property Type Description & Usage Example
MajorTickCount int gauge.MajorTickCount = 9; Number of main division marks on the dial.
MinorTicksPerMajor int gauge.MinorTicksPerMajor = 4; Number of smaller ticks between main marks.
TickMarkStyle AnalogTickStyle gauge.TickMarkStyle = AnalogTickStyle.Line; Shape of the tick marks. Options: Line, Rectangle, Circle, Diamond.
ShowRedlineZone bool gauge.ShowRedlineZone = true; Enables a colored arc indicating a danger or warning zone.
RedlineStart double gauge.RedlineStart = 180; The value where the redline zone begins.
RedlineColor Color gauge.RedlineColor = Color.Red; Color of the redline zone.

Text & Fonts

Property Type Description & Usage Example
DialTitle string gauge.DialTitle = "TACH"; Main title text displayed on the dial face.
ShowValueDisplay bool gauge.ShowValueDisplay = true; Shows the precise numeric value in a digital box on the dial.
DialFont Font gauge.DialFont = new Font("Arial", 10); Font used for the scale numbers.
LabelTextColor Color gauge.LabelTextColor = Color.White; Color of the text labels and numbers.

Animation & Performance

Control motion smoothing and rendering quality.

Property Type Description & Usage Example
EnableSmoothing bool gauge.EnableSmoothing = true; Enables smooth interpolation when the value changes.
SmoothingSpeed int gauge.SmoothingSpeed = 15; Speed of the needle movement animation (1-100).
UltraFastPerformance bool gauge.UltraFastPerformance = true; Disables shadows, gradients, and needle oscillation for maximum rendering performance (useful for high-speed data).

Public Methods

SetReading(double, bool)
// Sets the current reading, optionally animating the needle to the new position.
// Parameters: Value, Animate
analogGauge1.SetReading(120, true);
CalibrateGauge(double, double)
// Resets the minimum and maximum values of the gauge range.
// If the current reading is out of bounds, it is clamped to the new range.
analogGauge1.CalibrateGauge(0, 300);
IsInRedlineZone()
// Returns true if the current reading is within the configured redline zone.
if (analogGauge1.IsInRedlineZone())
{
                Console.WriteLine("Warning: Redline Reached!");
}

Events

Events Wiring
// 1. ReadingChanged Event
// Fires whenever the CurrentReading property changes.
analogGauge1.ReadingChanged += (s, e) => 
{
                Console.WriteLine($"Value: {e.NewReading}");
};

// 2. AnimationComplete Event
// Fires when the needle stops moving (reaches the target value).
analogGauge1.AnimationComplete += (s, e) => 
{
                // Animation finished logic
};

Designer & Smart Tags

The control includes a comprehensive Smart Tag menu for easy setup.

Feature Description
Theme Presets Instantly apply complex visual styles:
  • Automotive: Classic car dashboard look.
  • Aviation: High-contrast flight instrument style.
  • Vintage: Beige face with antique aesthetics.
  • Racing: Carbon-fiber style dark theme with red accents.
  • Steampunk: Brass/Copper tones with ornate details.
Quick Actions Test Redline Zone: Moves the needle to the redline for visual verification.
Calibrate Gauge: Resets Min/Max to defaults.
Reset Gauge: Returns needle to minimum.

Detailed Usage Examples

Example 1: Automotive Speedometer

Creates a classic car speedometer with a redline zone and needle oscillation for realism.

C# - Speedometer
private void SetupSpeedometer()
{
    speedGauge.DialTheme = AnalogDialTheme.Automotive;
    speedGauge.DialTitle = "SPEED";
    speedGauge.MeasurementUnit = "km/h";
    speedGauge.MaximumValue = 240;
    
                // Needle realism
    speedGauge.EnableNeedleOscillation = true;
    speedGauge.NeedleStyle = AnalogNeedleStyle.Classic;
    
                // Redline
    speedGauge.ShowRedlineZone = true;
    speedGauge.RedlineStart = 200;
    speedGauge.RedlineColor = Color.Red;
}

Example 2: Industrial Pressure Gauge

A rugged, high-contrast gauge for industrial monitoring using the Industrial theme.

C# - Pressure Gauge
private void SetupPressureGauge()
{
    pressureGauge.DialTheme = AnalogDialTheme.Industrial;
    pressureGauge.DialTitle = "PRESSURE";
    pressureGauge.MeasurementUnit = "PSI";
    pressureGauge.MaximumValue = 100;
    
                // Visuals
    pressureGauge.NeedleStyle = AnalogNeedleStyle.Bold;
    pressureGauge.NeedleColor = Color.Orange;
    pressureGauge.ShowShadow = false;
    
                // Logic
    pressureGauge.ReadingChanged += (s, e) => 
    {
                if (pressureGauge.IsInRedlineZone())
                TriggerAlarm();
    };
}

Example 3: Retro Voltmeter

Uses the Vintage theme to simulate an antique electrical measurement instrument.

C# - Vintage Voltmeter
private void SetupVoltmeter()
{
    voltmeter.DialTheme = AnalogDialTheme.Vintage;
    voltmeter.DialTitle = "VOLTS";
    voltmeter.MeasurementUnit = "V";
    
                // Scale
    voltmeter.MinimumValue = 0;
    voltmeter.MaximumValue = 15;
    voltmeter.MajorTickCount = 4; // 0, 5, 10, 15
    
                // Needle
    voltmeter.NeedleStyle = AnalogNeedleStyle.Thin;
    voltmeter.NeedleColor = Color.Black;
    
                // Disable digital display for retro feel
    voltmeter.ShowValueDisplay = false;
}