FormLayout

Organize rótulos e campos em uma grade responsiva de doze colunas com seções tituladas, para que os formulários fiquem ordenados em qualquer tela.

Por que ajuda

• Grade responsiva
• Seções tituladas
• Rótulos ligados aos campos

Onde se encaixa

• Páginas de configurações e perfil
• Formulários administrativos
• Diálogos

Exemplo

<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;
}

Um pequeno trecho. Adicione @using RayCraft.Blazor.Components à sua página e use um modo de renderização interativo.

Incluído no RayCraft Free. Há exemplos funcionais no repositório do GitHub (MIT); ele contém código de exemplo e demonstração, não o código da biblioteca.

Todos os controles · Documentação