Un medidor recto para un valor, horizontal o vertical, con bandas de color opcionales.
Por qué ayuda
- Medidor recto
- Bandas de color
- Compacto
Dónde encaja
- Progreso
- Niveles
- Cuotas
Ejemplo
<Stack Wrap="true" Align="end" Spacing="6">
<div style="width:22rem">
<LinearGauge Label="Storage used" Value="72" Unit="%" Bands="_bands" />
<LinearGauge Label="Battery" Value="35" Unit="%" />
</div>
<div style="width:6rem">
<LinearGauge Label="Temperature" Vertical="true" Min="-20" Max="60" Value="24" Unit=" °C" />
</div>
</Stack>
@code {
private readonly GaugeBand[] _bands =
[
new(0, 60, Severity.Success),
new(60, 85, Severity.Warning),
new(85, 100, Severity.Error)
];
}Un breve fragmento. Añade @using RayCraft.Blazor.Components a tu página y usa un modo de renderizado interactivo.
Forma parte de RayCraft Complete.