Saltar al contenido

El Menú Admite Objetos de Datos

Como novedad en Vinyl 2.7, los menús ahora admiten la capacidad de ser controlados por un objeto de datos. Esta nueva característica brinda a los Menús mucha más funcionalidad, incluida la posibilidad de admitir:

  • Etiquetas dinámicas, que permiten cosas como "Bienvenido {{Username}}"
  • Enlaces dinámicos, incluidos criterios vinculantes en esos enlaces.
  • Imágenes dinámicas como perfiles de usuario.
  • Temas condicionales
  • Reglas de visibilidad que podrían controlar la visibilidad de los elementos del menú.

Control de menú

Cómo Configurar un Menú Existente con un Objeto de Datos

  1. Desde la capa de aplicación, vaya a Cajón de acciones > Diseñar un menú
  2. Localice el menú existente en el panel Menú y haga clic en el icono emergente correspondiente.
  3. Haga clic en el botón Editar
  4. Seleccione el objeto de datos que desea utilizar como valor de Regla de origen.
  5. Haga clic en Guardar

Cómo Configurar un Nuevo Menú con un Objeto de Datos

  1. Desde la capa de aplicación, vaya a Cajón de acciones > Diseñar un menú
  2. Haga clic en Crear en el panel Menús.
  3. Asigne un Nombre para el menú. Por ejemplo: Menú de Ventas Norte
  4. Haga clic en el ícono Temas de elementos de menú para configurar cualquier información de tema para el menú.
  5. Seleccione el objeto de datos apropiado en el menú Regla de origen.
  6. Haga clic en Guardar

Después de configurar la información anterior, si está utilizando un menú nuevo y no el menú del sitio, también deberá configurar esta información en el diseño de la aplicación:

  1. Navegue hasta Vinyl IDE > Crea tu aplicación
  2. Haga clic en el icono de engranaje Abrir registro para la aplicación desde el panel de Aplicaciones.
  3. Haga clic en el ícono de edición de lápiz para Menú en el panel Regiones.
  4. Seleccione el nuevo menú como Control predeterminado
  5. Haga clic en Continuar

Cómo Insertar una Imagen en el Menú

Puede haber casos de uso en los que desee mostrar una imagen dentro de un menú. Con esta nueva característica, puede mostrar una imagen dentro de la región del Menú, y esa imagen puede basarse en la información almacenada en el objeto de datos al que conecta el Menú. Este ejemplo supone que ya tiene un objeto de datos con una columna que captura la información del UUID de la imagen.

Nota

Las imágenes se pueden almacenar en el objeto de datos como UUID, cadena base64 o tipo de columna binaria con la imagen misma allí.

Imagen del menú

Para Localizar un UUID de Imagen Almacenada Local

  1. Navegue hasta Vinyl IDE > Diseña tu apariencia
  2. Ubique la Colección donde cargó la imagen para almacenarla localmente.
  3. Profundice en Imágenes de esa colección identificada
  4. Haga doble clic en la imagen para la que desea obtener el valor UUID.
  5. Seleccione la parte del valor URL relativa que aparece a continuación /image/. Por ejemplo: 50e85d87-e283-4953-983f-0bc3e18b3a7e
  6. Copie el valor a su portapapeles.
  7. El valor UUID es lo que desea almacenar en una columna en el objeto de datos o regla a la que se hace referencia desde el menú.

Para Agregar una Imagen a un Menú Desde un Objeto de Datos

  1. Desde la capa de aplicación, vaya a Cajón de acciones > Diseñar un menú
  2. Localice el Menú para agregar la imagen.
  3. Haga clic en Crear en Elementos del menú.
  4. Seleccione Imagen como tipo de control.
  5. Asigne un Nombre
  6. Haga clic para seleccionar la Alineación que está buscando. Por ejemplo: derecha
  7. En Otros tipos de control, establezca la columna Fuente en la columna que contiene la URL de la imagen. Por ejemplo: avatar
  8. Vuelva a la capa de interfaz de usuario de la aplicación, actualice su navegador web y verifique los resultados.

Información Adicional

Si desea agregar una imagen de logotipo personalizada a una aplicación, consulte Cómo agregar un logotipo a una aplicación