Siticone Logo
Siticone UI
DOCS
v2025.12.15
Docs Neon Velocity Gauge

Siticone Neon Velocity Gauge

The SiticoneNeonVelocityGauge is a high-performance, visually striking gauge designed for automotive and sci-fi interfaces. It features a radiant neon aesthetic, integrated critical/warning zones, and smooth, physics-based needle animation.

Velocity & Range

Properties controlling the measurement data and scaling.

Property Type Description & Usage Example
Velocity float gauge.Velocity = 120; The current speed value. Setting this initiates animation.
MinimumVelocity float gauge.MinimumVelocity = 0; The lowest value on the scale.
MaximumVelocity float gauge.MaximumVelocity = 240; The highest value on the scale.

Warning & Critical Zones

Define safety thresholds that trigger visual changes in the gauge.

Property Type Description & Usage Example
WarningThreshold float gauge.WarningThreshold = 180; Value where the gauge enters the "Warning" state (Amber).
CriticalThreshold float gauge.CriticalThreshold = 220; Value where the gauge enters the "Critical" state (Red).
ShowWarningZones bool gauge.ShowWarningZones = true; Visually renders the colored arc segments for warning/critical zones.

Themes & Colors

Apply built-in neon themes or customize individual colors.

Property Type Description & Usage Example
CurrentTheme VelocityTheme gauge.CurrentTheme = SiticoneVelocityGaugeTheme.NeonBlue; Presets: NeonBlue, ElectricOrange, CyberGreen, PlasmaRed.
PrimaryNeonColor Color gauge.PrimaryNeonColor = Color.Cyan; The main glow color for the safe zone.
SecondaryNeonColor Color gauge.SecondaryNeonColor = Color.Yellow; The glow color for the warning zone.
CriticalNeonColor Color gauge.CriticalNeonColor = Color.Red; The glow color for the critical zone.
BaseBackgroundColor Color gauge.BaseBackgroundColor = Color.Black; The dark background color behind the gauge.

Neon Effects

Control the intensity and animation of the glow effects.

Property Type Description & Usage Example
EnableGlowEffect bool gauge.EnableGlowEffect = true; Enables the soft bloom around the scale and needle.
GlowIntensity int gauge.GlowIntensity = 50; Strength of the neon bloom (0-100).
EnablePulseEffect bool gauge.EnablePulseEffect = true; Causes the gauge to gently pulsate, adding life to the UI.
EnableSmoothAnimation bool gauge.EnableSmoothAnimation = true; Enables interpolated needle movement.

Text & Scale

Settings for the digital readout and scale labels.

Property Type Description & Usage Example
ShowCentralDisplay bool gauge.ShowCentralDisplay = true; Shows the digital speed value in the center.
UnitLabel string gauge.UnitLabel = "km/h"; Text displayed below the digital value.
DisplayScaleLabels bool gauge.DisplayScaleLabels = true; Shows numeric labels (0, 20, 40...) around the arc.

Public Methods

SetVelocity(float, bool)
// Sets the velocity, optionally bypassing animation.
gauge.SetVelocity(150, true);
IncrementVelocity(float, bool)
// Adds to the current velocity.
gauge.IncrementVelocity(10, true);
ResetVelocity(bool)
// Resets the gauge to MinimumVelocity.
gauge.ResetVelocity(true);

Events

Events Wiring
// 1. VelocityChanged Event
gauge.VelocityChanged += (s, e) => 
{
                Console.WriteLine($"Speed: {e.CurrentVelocity}");
};

// 2. EnteredCriticalZone Event
gauge.EnteredCriticalZone += (s, e) => 
{
                MessageBox.Show("Critical Speed Reached!");
};

Designer & Smart Tags

Visual Studio design-time support.

Feature Description
Quick Themes Speedometer: Blue neon style.
Tachometer: Orange style with redline.
Temperature: Green style.
Actions Reset Velocity: Sets velocity to minimum.

Detailed Usage Examples

Example 1: Racing Tachometer

Configures the gauge as an RPM meter with an orange theme and warning zones.

C# - Tachometer
private void SetupTachometer()
{
    gauge.CurrentTheme = SiticoneVelocityGaugeTheme.ElectricOrange;
    gauge.MaximumVelocity = 8000;
    gauge.UnitLabel = "RPM";
    
                // Zones
    gauge.WarningThreshold = 6000;
    gauge.CriticalThreshold = 7000;
    gauge.ShowWarningZones = true;
    
                // Visuals
    gauge.EnablePulseEffect = true;
    gauge.NeedleThickness = 4;
}

Example 2: Sci-Fi Energy Monitor

Uses the "Plasma Red" theme to create a futuristic energy level indicator.

C# - Energy Gauge
private void SetupEnergyMonitor()
{
    gauge.CurrentTheme = SiticoneVelocityGaugeTheme.PlasmaRed;
    gauge.UnitLabel = "GW";
    gauge.MaximumVelocity = 100;
    
                // Remove needle for a digital look
    gauge.ShowNeedle = false;
    gauge.EnableGlowEffect = true;
    gauge.GlowIntensity = 60;
}