Popover

Een zwevend paneel voor extra details, bij de hand: geopend door een activator, gesloten met Esc of een klik erbuiten.

Waarom het helpt

• Bij de hand
• Esc en klik erbuiten
• Blijft binnen het venster

Waar het past

• Details
• Filters
• Hulp

Voorbeeld

<Popover @bind-Open="_open">
    <Activator><Button Variant="Variant.Outlined">Settings</Button></Activator>
    <ChildContent>
        <Stack Direction="StackDirection.Column">
            <Switch @bind-Value="_notify" Label="Notifications" />
            <Button Size="Size.Small" OnClick="() => _open = false">Done</Button>
        </Stack>
    </ChildContent>
</Popover>

@code {
    private bool _open;
    private bool _notify = true;
}

Een kort fragment. Voeg @using RayCraft.Blazor.Components toe aan je pagina en gebruik een interactieve rendermodus.

Inbegrepen in RayCraft Free. Werkende voorbeelden staan in de GitHub-repository (MIT); het bevat voorbeeld- en democode, niet de code van de bibliotheek.

Alle besturingselementen · Documentatie