🚨 LED

The LED widget is a simple, high-visibility status indicator designed to mimic physical hardware LEDs. It is the most efficient way to show binary states (On/Off) or varying intensity levels (Brightness) without using complex image assets.

---

⚙️ Properties (Props)

The LED configuration is defined by the LedWidget interface. It manages a singular focal point of color and luminosity.

Property	Type	Description
Color	string	The primary color of the LED when active (e.g., #00FF00).
Brightness	number	The intensity of the light from 0 (Off) to 255 (Full).
X / Y	number	The coordinate position on the canvas.

---

💡 Luminous Logic

The LED widget automatically handles the "glow" effect based on the assigned brightness and color.

• State Off: When brightness is 0, the LED appears as a dull, dark version of its base color.
• State On: At 255, the LED appears vibrant with a subtle outer glow to simulate light emission.
• Variable Intensity: Intermediate values (e.g., 128) can be used to indicate "standby" modes or varying system health levels.

---

🎨 Styling

In the Inspector Panel, you can refine the physical look:

• Main: Adjust the border width and corner radius to create circular, square, or rectangular LEDs.
• Glow Width: Increase this value to create a more diffuse lighting effect on the surrounding UI.
• Shadow: Add a subtle inner shadow to give the LED a "sunken" or "flush" physical appearance.

---

⚡ Runtime API (Lua)

LEDs are perfect for real-time status polling in the Logic and Events system.

-- Toggle the LED on and off
led_status:set_brightness(255) -- Full On
led_status:set_brightness(0)   -- Full Off

-- Change the LED color based on system health
if battery_low then
    led_power:set_style_bg_color(0xFF0000) -- Red
    led_power:on() -- Helper to set brightness to 255
else
    led_power:set_style_bg_color(0x00FF00) -- Green
end

-- Create a blinking effect
led_alert:toggle()

---

PERFORMANCE

LEDs are purely vector-based. They are significantly more memory-efficient than using two separate Static Images to represent "On" and "Off" states, especially when you need multiple colors.

---

🚀 Next Steps

• Switch — Use this if the user needs to interactively toggle the state.
• Bar — Use this for multi-segmented status indicators.
• Logic and Events — Learn how to map hardware GPIO pins to LED brightness.