Cuadros de mando

<< Clic para mostrar Tabla de Contenidos >>

Navegación:  Automatización de Procesos con poco código > Studio Cloud -ambiente de autoría > Bizagi Apps > App Designer > Editor del App Designer > Controles > Experiencia >

Cuadros de mando

Introducción

En el editor del App Designer, el control Cuadros de mando permite a los usuarios mostrar contenido estático (es decir, información fija) dentro de tarjetas, ya sea como puntuación o como valor.

 

Agregando el control a su página

Para agregar el control de Cuadros de mando a su app, abra el menú Controles (ubicado en la esquina superior izquierda de la pantalla) haciendo clic en él. Luego, busque el control Experiencia y haga clic en el ícono de flecha para abrir una lista desplegable que le permite visualizar las diferentes opciones así como el control de Cuadros de mando.

 

Scorecard01

Una vez haya hecho esto, el control aparece en su página de la siguiente manera:

 

Scorecard02

 

Administrando el contenido del control

Con el control ya agregado en su app, puede administrar el contenido que se mostrará en él. Para hacer esto, desplace el cursor sobre el control para mostrar las opciones de configuración. Seleccione la opción Administrar Contenido para agregar datos al control.

 

Scorecard03

 

Observe que el control de Cuadros de mando tiene dos campos editables para mostrar contenido dentro de la tarjeta:

1.Valor: el texto que defina en este campo corresponde precisamente a la puntuación o el valor que desea mostrar en la tarjeta, y siempre se muestra en la parte superior de la tarjeta. Por ejemplo, si especifica un año, puede escribir su valor en números (es decir, 2022).

2.Descripción: en este campo debe dar una breve explicación de la puntuación o valor que se muestra en el campo Valor. La descripción que proporcione en este campo siempre se muestra en la parte inferior de la tarjeta. Retomando el ejemplo, puede especificar que el valor de 2022 corresponde al año actual.

 

Si define los campos del control de Cuadros de mando como en el ejemplo dado, el control se ve así:

 

Scorecard04

 

Scorecard05

 

note_pin

Aunque el control de Cuadros de mando está diseñado principalmente para mostrar contenido estático, es posible vincular datos dinámicos a los campos de control cuando la página en la que está trabajando es una página de Detalle.

 

Definiendo la configuración del control

También puede cambiar la apariencia del control ajustando su configuración. Para hacer esto, desplace el cursor sobre el control para mostrar las opciones de configuración y seleccione la opción Configuración.

 

Scorecard06

 

En concreto, puede modificar dos configuraciones de control:

1.Estilo:

oAlinear: en este ajuste, puede ubicar el texto del control de Cuadro de mando hacia la Izquierda, Centro o Derecha.

oAncho del control (%): defina el ancho en proporción al área total del control.

oFamilia tipográfica: defina la fuente para el texto del control. Por defecto la fuente es Poppings Regular

 

2.Colores: modifique los colores de la tarjeta para el Color de fuente del valor, Color de fuente de la descripción, Color de fondo y Color de borde.

 

Con el color deseado ya seleccionado, también es posible agregarlo a su libería de colores personal (Mi librería de colores). Para hacer esto, haga clic en la etiqueta Agregar debajo del cuadrado de color seleccionado y verifique que el color se haya agregado a la librería. Tenga en cuenta que puede agregar hasta ocho colores a Mi librería de colores.

 

Scorecard07

Adicionalmente, cuatro cuadros con colores predefinidos son mostrados al lado del cuadro del color personalizado (el primer cuadrado).

 

note_pin

Tenga en cuenta el botón Reiniciar en la parte inferior del panel de configuración, ya que este botón le permite restaurar la configuración predeterminada del control.

 

Al modificar la configuración del cuadro de mando del ejemplo, puede crear un diseño que se vea así:

 

Scorecard08


Last Updated 6/6/2023 3:36:49 PM