Ordnen Sie Beschriftungen und Felder in einem responsiven Zwölf-Spalten-Raster mit betitelten Abschnitten an, damit Formulare auf jedem Bildschirm ordentlich aussehen.
Warum es hilft
- Responsives Raster
- Betitelte Abschnitte
- Beschriftungen mit Feldern verknüpft
Wo es passt
- Einstellungs- und Profilseiten
- Admin-Formulare
- Dialoge
Beispiel
<FormLayout LabelPosition="FormLabelPosition.Start" Spacing="3">
<FormLayoutItem Label="Name" HelperText="As on your ID.">
<TextField @bind-Value="_name" />
</FormLayoutItem>
<FormLayoutItem Label="Email">
<TextField @bind-Value="_email" Type="email" />
</FormLayoutItem>
<FormLayoutItem Label="Notes">
<TextField @bind-Value="_notes" Lines="3" />
</FormLayoutItem>
<FormLayoutItem Label="Subscribe">
<Switch @bind-Value="_subscribe" Label="Send me the newsletter" />
</FormLayoutItem>
</FormLayout>
@code {
private string? _name;
private string? _email;
private string? _notes;
private bool _subscribe = true;
}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.