Control de Botones¶

Controles de botones le permiten colocar un control en un panel que aparece como un botón y ofrece opciones de configuración para controlar la ubicación de la ubicación, el comportamiento al hacer clic (si lo desea), el color, la etiqueta y más.

Si se desea control adicional sobre la apariencia de un botón, Vinyl lo admite a través de Estilos.

Cómo Configurar un Control de Botón¶

1. Desde la vista de la aplicación, vaya a Action Drawer > Live Designer
2. Si el Botón debe asociarse con una Columna subyacente, seleccione el valor
3. Establezca el Tipo de control en Botón
4. Asigne un Nombre. Este valor aparecerá en el propio botón.

5. Seleccione el valor de Subtipo de control para definir si el botón debe tener una apariencia Primaria o Secundaria.

   1. Primario = aparece como botón principal en el panel
   2. Secundario = aparece como un botón secundario en el panel, más claro que un botón principal

6. Haga clic en Siguiente

7. Si el botón debe Ejecutar un evento al hacer clic, seleccione el evento apropiado
8. Si el botón debe Enlazar a la página al hacer clic, seleccione la página adecuada
9. Haga clic en Siguiente
10. Revise las actualizaciones que realizará Vinyl al agregar el control Botón y haga clic en Finalizar

11. Si desea una Ubicación diferente para la ubicación del Botón, seleccione el valor apropiado

    1. Cuerpo = comportamiento predeterminado que normalmente se muestra en línea en el Panel
    2. Encabezado = se muestra en la región del encabezado del Panel, por defecto en la región derecha del panel
    3. Panel (Menú) = se muestra en un menú anidado que se muestra en el Panel, región superior derecha del Panel
    4. Barra de herramientas = se muestra en la región de la barra de herramientas del Panel, de manera predeterminada a la derecha de cualquier botón de Método de actualización existente (por ejemplo, Crear, Auditoría)

12. Revise las opciones disponibles y realice más actualizaciones de configuración.

13. Haga clic en Guardar

Cómo Diseñar un Botón¶

Los estilos se pueden utilizar para personalizar aún más un control de botón. Utilice los estilos disponibles para cambiar cosas como el tamaño, el color y el peso de la fuente del botón. Puede personalizar un estilo si necesita mayor granularidad.

1. Navegue a la página de la aplicación con el control Botón.
2. Vaya a Cajón de acciones > Live Designer
3. Seleccione el control Botón en la vista de página.
4. Desde la región de edición, vaya a Más... > Estilos
5. Haga clic en + Estilo
6. Seleccione Botones de Categorías de estilo
7. Localice el Estilo deseado y haga clic en el botón + Agregar correspondiente. Por ejemplo: Vinyl - Botón tipo grande
8. Salga de las pantallas de Estilos y edición, actualice el navegador y confirme las actualizaciones.

Opciones de Ubicación del Botón¶

Los controles de botones se pueden configurar para que se coloquen en 4 áreas diferentes de un panel usando el campo Ubicación. La ubicación se define mediante la opción Ubicación seleccionada en el modo de edición de control. Las áreas en las que se pueden colocar botones en los paneles incluyen:

1. Cuerpo = comportamiento predeterminado que normalmente se muestra en línea en el Panel
2. Encabezado = se muestra en la región del encabezado del Panel; el valor predeterminado es la región derecha del panel
3. Panel (Menú) = se muestra en un menú anidado que se muestra en el Panel, región superior derecha del Panel
4. Barra de herramientas = se muestra en la región de la barra de herramientas del Panel, de manera predeterminada a la derecha de cualquier botón de Método de actualización existente (por ejemplo, Crear, Auditoría)

Ilustración de diferentes ubicaciones de botones disponibles en Vinyl