Popover

Ein schwebendes Panel für zusätzliche Details, griffbereit: von einem Aktivator geöffnet, mit Escape oder Klick außerhalb geschlossen.

Warum es hilft

• Griffbereit
• Escape und Klick außerhalb
• Bleibt im Anzeigebereich

Wo es passt

• Details
• Filter
• Hilfe

Beispiel

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

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.

Alle Steuerelemente · Dokumentation