Grupo de botones
Utilice el componente de grupo de botones para combinar los activadores de algunas funciones relacionadas en un elemento de interfaz. El grupo de botones es visualmente idéntico a la Ignite UI for Angular
Button Group Demo
Layout
El grupo de botones admite dos direcciones de diseño: horizontal, donde los elementos se distribuyen de izquierda a derecha, y vertical, donde su orden es de arriba a abajo.
Buttons Amount
En Figma, el grupo de botones utiliza un diseño automático que le permite ajustarse en consecuencia cuando elige la cantidad exacta de botones que necesita y oculta los anidados adicionales en el panel de capas. En Sketch, el grupo de botones utiliza un diseño inteligente similar a Figma y puedes ocultar los botones innecesarios configurándolos en ~Sin símbolo desde el panel de anulaciones. En Adobe XD puedes lograr lo mismo eliminando las capas innecesarias con botones, lo que ajustará automáticamente el diseño.
Button Layout Template
Cada botón del grupo de botones es un botón plano y permite el mismo grado de plantilla.
Estilismo
El grupo de botones viene con flexibilidad de estilo a través de las diversas opciones para el borde y el color de fondo, así como los colores de contorno, fondo, texto y íconos de los botones individuales.
Usage
Utilice siempre botones con un estilo coherente y evite combinar botones de texto con botones de iconos dentro del mismo grupo de botones. Dimensione el grupo de botones según su contenido para evitar dejar demasiado espacio vacío en los botones. Utilice el grupo de botones solo para mostrar acciones simples y relacionadas, ya que no es adecuado ni siquiera para una navegación simple. Si miras más allá de estas acciones, las pestañas son mucho más apropiadas.
Hacer | No |
---|---|
Additional Resources
Temas relacionados:
Nuestra comunidad es activa y siempre da la bienvenida a nuevas ideas.