Ejemplos

Use este widget para apoyar los requisitos de diseño de la aplicación como por ejemplo los siguientes:

• Dispone de una capa de entidades que contiene URL a sitios web y desea utilizar un botón como vínculo para abrir el sitio web asociado con una entidad seleccionada.
• Su aplicación tiene varias páginas y un menú en la página de inicio para acceder a cada página. También dispone de varias secciones a las que desea que los usuarios accedan rápidamente. Puede crear botones que devuelvan a un usuario a la página de inicio o que avance a secciones o páginas relevantes desde cualquier sitio de la aplicación.

Notas de uso

Cuando agrega un widget Botón a la página, aparece la ventana Estilo rápido junto al widget donde puede seleccionar entre diseños predefinidos que se coordinan con el tema de su aplicación. (Para volver a acceder a esta ventana posteriormente, haga clic en el botón Estilo rápido en la barra de herramientas del widget). También puede configurar su propio diseño de botones eligiendo colores y fuentes para los estados regular y pasar por encima en la configuración avanzada.

Si conecta el botón a una fuente de datos, como por ejemplo una capa de entidades, los datos de las entidades pueden utilizarse para rellenar el texto del botón o URL del vínculo.

Ajustes

El widget Botón incluye estos ajustes:

• Conectar a los datos: conecte opcionalmente el botón a los datos para que pueda establecer un vínculo dinámico, como por ejemplo el uso de una URL desde atributos de entidad.
  • Seleccionar datos: seleccione capas de entidades como una fuente de datos.
• Definir vínculo: agregue un vínculo al botón para que abra una dirección web, una vista de sección, una ventana o una página en su aplicación. Si vincula a una dirección web, escriba una URL (que empiece por https://). Si conecta el botón con una fuente de datos, elija una fuente dinámica para la URL utilizando un Atributo o una Expresión. Puede elegir si el vínculo se abre en la misma ventana que la aplicación, en la ventana superior o en una nueva ventana.
  • Información sobre herramientas: proporcione texto emergente para describir el recurso que abre el botón.
  • Texto: proporcione el texto que va a aparecer en el botón. Si conecta el botón a datos, puede usar texto dinámico en función de la fuente de datos seleccionando Atributo, Estadística o Expresión.
  • Icono: agregue un icono al botón y elija situarlo en la parte izquierda o derecha del texto del botón. Puede elegir iconos de las galerías General y Flechas, o agregar su propio icono desde un archivo.

    Nota:

    Puede cargar los siguientes formatos de imagen: PNG, GIF, JPG, JPEG y BMP.

• Avanzado: invalide la fuente y colores heredados del tema de la aplicación para dar estilo a los dos estados del botón: Regular es el estado del botón sin interacción con el usuario y Mantener el puntero es el estado del botón iniciado por el usuario cuando señala o hace clic en el botón.
  • Texto: cambie el tamaño de fuente (en píxeles) y color, y proporcione estilo al texto del botón usando formato de negrita, itálica, tachado y subrayado.
  • Fondo: elija un color o imagen de relleno para establecer el fondo del botón. Si elige una imagen, puede colocarla en el botón usando Ajustar, Rellenar, Centro, Tesela o Extender. Si elige Ajustar, el botón muestra el color de relleno de fondo alrededor de la imagen.
  • Borde: elija un color de borde, estilo (como por ejemplo guiones o puntos) y el ancho en píxeles.
  • Esquina: cambie el tamaño del radio (por píxeles o porcentaje) para dar forma a las esquinas del botón. Bloquee los ajustes para sincronizar el radio de las cuatro esquinas.
  • Sombra: agregue un efecto de sombra alrededor del botón usando los siguientes ajustes:
    • Desplazamiento X: establezca la distancia horizontal de la sombra. Un valor negativo coloca la sombra en la parte izquierda del botón y un valor positivo la coloca en la parte derecha.
    • Desplazamiento Y: establezca la distancia vertical de la sombra. Un valor negativo coloca la sombra encima del botón y un valor positivo la coloca debajo.
    • Radio de desenfoque: aplique un efecto de desenfoque en la sombra.
    • Radio de propagación: ajuste el tamaño de la sombra.
    • Color: seleccione un color de sombra.