Creación de una plantilla de código personalizado con la infraestructura de interfaz de usuario web

Puede crear una plantilla de código personalizado utilizando el Generador de plantillas de código.

Acerca de esta tarea

Para crear una plantilla de código personalizado a partir de una plantilla predeterminada o una plantilla personalizada, haga lo siguiente.

Procedimiento

  1. Abra el Generador de plantillas de código.
  2. En la sección de plantillas disponibles, pulse con el botón derecho en una plantilla en una de las listas siguientes:
    • Plantillas personalizadas
    • Plantillas predeterminadas
  3. Elija la opción crear a partir de seleccionado .

    Se abre una plantilla nueva en la ventana Crear plantilla nueva. Este ventana contiene variables que se pueden utilizar en la plantilla de código para reducir el número de campos obligatorios en el Generador de plantillas de código.

    La sección de variables de pantalla existentes muestra las variables predeterminadas, que no se pueden modificar (nombres y valores). La sección de variables definidas por el usuario muestra las variables que ha creado y que puede modificar (nombres, tipo y valores).

    En la sección de variables definidas por el usuario, puede añadir las propiedades a los pares de nombre/valor que forman parte de la plantilla predeterminada. Pulse el botón Añadir para añadir una variable definida por el usuario, que toma el valor predeterminado de tipo string. Puede cambiar el tipo a una expresión (expr).

    El ejemplo anterior muestra una variable definida por el usuario (projname) de tipo expr y el valor className (className es una variable de pantalla). La aplicación utiliza la expresión projName=className, en lugar de projName=”className” (si el tipo es string).

    Para eliminar las variables, pulse con el botón derecho del ratón en una fila de la variable y seleccione la opción suprimir.

  4. En la sección Detalles de plantilla se define la información siguiente:
    • Nombre de plantilla: Identificador exclusivo de una plantilla que también sirve como nombre de archivo json.
    • Nombre de variable: Nombre mediante el cual se hace referencia a este parámetro en la plantilla.
    • Etiqueta de variable: Texto que se muestra antes del campo de entrada de esta variable en la ventana Generador de plantillas de código.
    • Tipo de variable: serie o expresión (expr).
    • Valor: serie, variable o expresión que se puede evaluar para devolver un valor. Este valor serviría, después, como valor predeterminado y se podría utilizar para rellenar el valor en el campo de entrada de esta variable en la ventana Generador de plantillas de código. De forma predeterminada, este campo se deja vacío.

    Para añadir variables, pulse el botón Añadir nuevo. Se muestra una nueva fila de variable.

    Para eliminar las variables, pulse con el botón derecho del ratón en una fila de la variable y seleccione la opción suprimir.

    La parte inferior de la sección de detalles de plantilla muestra la plantilla Ext JS XTemplate que se utiliza para generar el código.

  5. Guarde la nueva plantilla pulsando el botón Guardar . La nueva plantilla se guarda como archivo json (utiliza el nombre de plantilla) en el directorio siguiente:

    <directorio de proyecto del usuario> /designer-metadata/templates

    Si no desea guardar la plantilla, pulse el botón Cancelar.

    Después de pulsar el botón Guardar, se cierra la ventana Crear plantilla nueva y se muestra la ventana Generador de plantillas de código. Ahora puede utilizar la nueva plantilla para actualizar el código para un componente de la pantalla.