Descripción general del panel de expansión Blazor
La Ignite UI for Blazor es un componente de acordeón liviano que se puede representar en dos estados: contraído o expandido. El panel de expansión se puede alternar mediante un clic del mouse o interacciones con el teclado.
Blazor Expansion Panel Example
Usage
La forma más sencilla de empezar a utilizar IgbExpansionPanel
es la siguiente:
Binding to events
El componente Panel de expansión genera los siguientes eventos:
El siguiente ejemplo demuestra cómo podemos agregar algo de lógica a nuestro componente para que muestre/oculte el subtitle
según el estado actual del panel.
Component Customization
El control IgbExpansionPanel
permite agregar todo tipo de contenido dentro de su cuerpo. ¡Puede representar entradas, gráficos e incluso otros paneles de expansión!
El IgbExpansionPanel
permite una fácil personalización del encabezado a través de las ranuras de título, subtítulo e indicador expuestas.
La configuración de la posición del indicador de expansión se puede realizar a través de la IndicatorPosition
propiedad del Panel de expansión. Las opciones posibles son inicio, fin o ninguna.
El siguiente ejemplo de código demuestra cómo configurar el botón del componente para que vaya al lado derecho.
Keyboard Navigation
La Ignite UI for Blazor cumple con los estándares de accesibilidad W3C y es cómoda de usar.
Combinaciones de teclas
- Alt + ↓: expande el panel enfocado
- Alt + ↑: contrae el panel enfocado
- Espacio / Entrar: alterna el estado de expansión del panel enfocado
Styling
El componente Ignite UI for Blazor Expansion Panel expone varias partes CSS (header
, indicator
, title
, subtitle
y content
) para brindarle control total sobre su estilo.