Ein segmentiertes Steuerelement für eine oder mehrere Auswahlen. Nutzen Sie es für Ansichtsumschalter und andere sich ausschließende Optionen.
Warum es hilft
- Eine oder viele Auswahlen
- Kompakt und vertraut
- Barrierefreie Rollen
Wo es passt
- Listen- oder Rasteransicht
- Textausrichtung
- Zeiträume
Beispiel
<ToggleGroup TValue="string" Label="Alignment (one)" Items="_alignments" @bind-Value="_alignment" />
<ToggleGroup TValue="string" Label="Formatting (several)" Items="_styles" Multiple="true" @bind-Values="_selected" Size="Size.Small" />
<span>@_alignment; @string.Join(", ", _selected)</span>
@code {
private readonly string[] _alignments = ["Left", "Center", "Right"];
private readonly string[] _styles = ["Bold", "Italic", "Underline"];
private string _alignment = "Left";
private IReadOnlyCollection<string> _selected = new List<string> { "Bold" };
}Ein kurzes Fragment. Fügen Sie @using RayCraft.Blazor.Components zu Ihrer Seite hinzu und nutzen Sie einen interaktiven Render-Modus.
In RayCraft Free enthalten. Funktionierende Beispiele finden Sie im GitHub-Repository (MIT); es enthält Beispiel- und Democode, nicht den Code der Bibliothek.