AYUDA EN LÍNEA
 WINDEVWEBDEV Y WINDEV MOBILE

Este contenido se ha traducido automáticamente.  Haga clic aquí  para ver la versión en inglés.
Ayuda / Desarrollar una aplicación o un sitio web / Plantillas y temas
  • Los diferentes pasos
  • Etapa 1: Creación de un proyecto plantilla
  • Presentación
  • Creación de un proyecto plantilla
  • Etapa 2: Creación de una ventana con los estilos de los controles
  • Presentación
  • Creación de una ventana con los estilos de los controles
  • Etapa 3: Creando una ventana de referencia plantilla
  • Presentación
  • Creando una ventana de referencia en su proyecto plantilla
  • Añadir elementos a la ventana de referencia
  • Etapa 4: Creando una ventana de plantilla
  • Presentación
  • Creando una ventana plantilla para las ventanas "en blanco".
  • Creación de una ventana plantilla para las ventanas RAD (RAD guardado para compatibilidad con versiones anteriores)
  • Adición de botones adicionales (RAD conservado para compatibilidad con versiones anteriores)
  • Ancho inicial de la ventana (RAD conservado para compatibilidad con versiones anteriores)
  • Etapa 5: Creación final de plantilla
  • Presentación
  • Creación de una plantilla
  • Crear una vista previa de plantilla
WINDEV
WindowsLinuxUniversal Windows 10 AppJavaReportes y ConsultasCódigo de Usuario (UMC)
WEBDEV
WindowsLinuxPHPWEBDEV - Código Navegador
WINDEV Mobile
AndroidWidget Android iPhone/iPadIOS WidgetApple WatchMac CatalystUniversal Windows 10 App
Otros
Procedimientos almacenados
Los diferentes pasos
La creación de una ventana plantilla se puede descomponer en varios pasos:
Observaciones:
  • Uno de los métodos para crear una plantilla de ventana se presenta a continuación. Se recomienda el método que se presenta a continuación, pero no es obligatorio.
  • El icono indica un consejo. Las instrucciones descritas en estos consejos no son obligatorias, pero le ayudarán a crear la ventana plantilla.
  • To modificar un plantilla existente, simplemente modificar el archivo plantilla (archivo .STY) en el directorio donde se generó el plantilla. Este archivo puede abrirse en el editor y guardarse.
  • También tiene la posibilidad de crear una plantilla a partir de una plantilla existente.. Para obtener más información, consulte Creación de una plantilla a partir de una plantilla existente.
Etapa 1: Creación de un proyecto plantilla

Presentación

En la mayoría de los casos, un plantilla incluye varias ventanas (entre 1 y 12). Para simplificar la creación y la modificación de sus plantillas tema, le recomendamos que utilice un proyecto para cada plantilla.
Este proyecto agrupará las diferentes ventanas correspondientes a un plantilla.
El proyecto plantilla se agrupará:
  • una ventana que contiene los estilos de los controles.
  • una ventana utilizada como "ventana de referencia" para que la ventana plantilla pueda crear.
  • una ventana plantilla para cada tipo de ventana.
Observación: Si se usan plantillas de tema para personalizar sus informes, sus plantillas de reporte tema pueden ser creadas en este proyecto. Para obtener más información, consulte Creación de una plantilla de reporte.

Creación de un proyecto plantilla

Para crear un proyecto plantilla: En WINDEV/WINDEV Mobile, cree un nuevo proyecto:
  • Haga clic en en los botones de acceso rápido.
  • La ventana para crear nuevos elementos se abre: haga clic en "Proyecto".
El proyecto debe cumplir con las dos siguientes condiciones:
  • el proyecto debe ser relacionado a ningún análisis.
  • el proyecto no debe utilizar ningún plantilla.
Para identificar fácilmente sus proyectos de plantilla, se recomienda utilizar la siguiente notación: "SkinTemplate_<NameOfSkinTemplate>". Por ejemplo, si la plantilla se llama Caribe, el proyecto se llamará "SkinTemplate_Caribbean".
Etapa 2: Creación de una ventana con los estilos de los controles

Presentación

La creación de un plantilla consiste en definir las características de las ventanas (imagen de fondo, tipo de borde,...) así como las características de los controles (fuente utilizada, dimensiones,...).
Para definir las características de los controles de un plantilla, cree una ventana que contenga los estilos utilizados por los diferentes tipos de controles.. La hoja de estilo de la plantilla se creará desde esta ventana.
Observaciones:
Sólo tienes que definir los estilos de los tipos de controles que se utilizarán en tu aplicación. Por ejemplo, si sus aplicaciones no utilizan ningún control Control de número, no es necesario definir un estilo para este tipo de control.. El estilo por defecto se definirá en el archivo plantilla (extensión".STY").
Se pueden definir varios estilos para el mismo tipo de control.
Trabajando con la SCM: no olvide extraer su hoja de estilo (archivo".STY") antes de crear la ventana que contiene los estilos de los controles.

Creación de una ventana con los estilos de los controles

Para crear una ventana que contenga los estilos de los controles:
  1. Crear una ventana en blanco:
    • Haga clic en en los botones de acceso rápido.
    • La ventana para crear nuevos elementos se abre: haga clic en "Ventana", y luego en "Ventana". El asistente de creación de ventanas se abre automáticamente.
    • En la asistente, haga clic en "Blank" y valide.
  2. Insertar un tipo de control. Un "Control de edición", por ejemplo.
  3. Modifique el aspecto de este control en la pestaña "Estilo" de la ventana de descripción ("Descripción" de el menú contextual). Modificar el color del área de entrada, por ejemplo.
  4. Especifique el nombre del control en la pestaña "General" de la ventana de descripción ("Descripción" de el menú contextual).
    Para identificar fácilmente el estilo del control actual, se recomienda utilizar la siguiente notación: "<NameOfSkinTemplate>_<ControlType>". Por ejemplo, "Caribbean_StandardEditControl".
  5. Si es necesario, modifique las otras características de este control en la ventana de descripción (dimensiones y alineación, por ejemplo.
  6. Repita las operaciones 2 a 5 para todos los tipos de controles utilizados en su plantilla.
  7. Guarda la ventana ( ).
Para identificar rápidamente esta ventana, se recomienda utilizar la siguiente anotación: <NameOfSkinTemplate>_Control". Por ejemplo, "Caribbean_Control".
Observación: Para personalizar:
  • los botones estándar para los botones "Open", "OK" o "Print", por ejemplo: crear un botón cuyas dimensiones son 80 x 24.
    Para identificar fácilmente los botones estándar, se recomienda utilizar la siguiente notación: "<NameOfSkinTemplate>_BtnStandard". Por ejemplo, "Caribbean_BtnStandard".
  • los botones de navegación se utiliza para navegar por los diferentes registros mostrados en la ventana: crear cuatro botones cuyas dimensiones son 20 x 24.
    Para identificar fácilmente los botones de navegación, se recomienda utilizar la siguiente notación: "<NameOfSkinTemplate>_Btn<ButtonFunction>". Por ejemplo, "Caribbean_BtnFirst", "Caribbean_BtnPrevious", "Caribbean_BtnNext" y "Caribbean_BtnLast".
Etapa 3: Creando una ventana de referencia plantilla

Presentación

Todas las ventanas que se encuentren en la misma plantilla utilizarán características comunes (imagen de fondo, dimensión, tipo de borde, etc.). Para evitar tener que definir estas características en cada nueva ventana de plantilla, recomendamos crear una ventana base de plantilla.
Esta ventana se utilizará como "ventana de referencia": las plantillas tema de la ventana se crearán desde esta ventana.

Creando una ventana de referencia en su proyecto plantilla

Para crear una ventana de referencia en su proyecto plantilla:
  1. Crear una ventana en blanco:
    • Haga clic en en los botones de acceso rápido.
    • La ventana para crear nuevos elementos se abre: haga clic en "Ventana", y luego en "Ventana". El asistente de creación de ventanas se abre automáticamente.
    • En la asistente, haga clic en "Blank" y valide.
  2. En la descripción de la ventana ("Descripción" de el menú contextual), especifique:
    • el título de la ventana en la pestaña "General.
      Para identificar fácilmente la plantilla utilizada, le recomendamos que utilice la siguiente notación: "<NameOfSkinTemplate>". Por ejemplo, "Caribe".
    • las características de la ventana en la pestaña "UI"..
      Todas las características pueden ser configuradas para una ventana de plantilla.
      Le recomendamos que especifique los siguientes valores para el tamaño de la ventana:
      • "Opciones "Anchura mínima" y "Altura mínima: Inicial
      • "Opciones "Anchura máxima" y "Altura máxima: <Predeterminado>
    • la imagen de fondo (si es necesario) y sus características (posición, simetría,...) en la pestaña "Imagen.
      Si la ventana puede ser redimensionada, recomendamos que use la Escala de 9 sectores. La Escala de 9 sectores se utiliza para optimizar todas las posibilidades de maximizar la imagen de fondo.
      Le recomendamos que use la siguiente notación para esta imagen: "<NombreDeLaPlantilla>_Fondo.<Extensión>". Por ejemplo, "Caribbean_Background.BMP".
    • el estilo (color de fondo, tipo de borde,...) en la pestaña "Estilo".
  3. Guarda la ventana ( ).
Para identificar esta ventana más fácilmente, se recomienda utilizar la siguiente anotación: "<NameOfSkinTemplate>_Reference". Por ejemplo, "Caribbean_Reference".

Añadir elementos a la ventana de referencia

Se pueden añadir controles a la ventana de referencia (principalmente controles estáticos y controles de imagen). Por ejemplo, el nombre y el logotipo de una empresa se pueden mostrar en las ventanas..
Estos controles se denominan "Imágenes de disposición".. Estos controles pertenecen a la interfaz de las ventanas.
Algunos consejos para simplificar el uso de las "Imágenes de diseño":
  • anclar estos controles si la ventana es redimensionable. Por lo tanto, se optimizarán todas las posibilidades de maximizar estos controles.
  • si estos controles son controles de imagen, desmarque "Con gestión de clic del ratón" en la pestaña "Detalles" de la descripción del control.. Por lo tanto, estos controles de imagen no reaccionarán al ratón.
Si se utilizan menús en sus aplicaciones, tiene la posibilidad de describir y añadir un menú principal en la ventana de referencia ("Insertar .. Añadir el menú principal").
Usando archivos de imagen: Si las imágenes se utilizan en su ventana de referencia (imágenes utilizadas en las "imágenes de diseño", por ejemplo), le aconsejamos que lo haga:
  • utilice la siguiente notación: "<NameOfSkinTemplate>_<ImageName>.<Extension>. Por ejemplo, "Caribbean_Beach.BMP".
  • agrupar estos archivos en el directorio "Element_<NameOfSkinTemplate>" (por ejemplo, "Element_Carribean"), en el directorio del proyecto plantilla.
Etapa 4: Creando una ventana de plantilla

Presentación

Para utilizar el plantilla en las ventanas de su aplicación, se debe crear una ventana plantilla. Por defecto, se requiere una ventana única: la ventana"En blanco".
Observación: Se requieren varias ventanas tema-modelo si sus proyectos utilizan ventanas creadas con una versión RAD guardada para compatibilidad con versiones anteriores (ventanas generadas con la versión 12 anterior; o ventanas generadas en la versión 12 con el patrón "11-compatible RAD"). Cada ventana de plantilla corresponderá a un tipo de ventana RAD.

Creando una ventana plantilla para las ventanas "en blanco".

Para crear una ventana plantilla para las ventanas "en blanco"...:
  1. Abrir la ventana de referencia de la plantilla. Si ha utilizado las notaciones recomendadas, esta ventana se llama "<NameOfSkinTemplate>_Reference".
  2. Guardar la ventana con un nombre diferente: en la pestaña "Inicio", en el grupo "General", despliegue "Guardar" y seleccione "Guardar como". Esta nueva ventana contiene automáticamente todas las características de la ventana de modelo.
    Para identificar fácilmente esta ventana de la plantilla, se recomienda utilizar la siguiente notación: "BlankWindow".
  3. En la pestaña "Vista", en el grupo "Opciones", haga clic en "Modo plantilla" (Alt + G). Se muestra la ventana para editar una plantilla.
  4. Seleccione la ventana en blanco (D)" modelo y valide su elección.
    Observación: Se proponen tres plantillas para cada tipo de ventana. La letra que se encuentra después del tipo de ventana indica la posición de los botones en la ventana:
    • D: Los botones se encuentran en la sección derecha de la ventana.
    • G: Botones que se encuentran en la sección izquierda de la ventana.
    • B: Botones que se encuentran en la sección inferior de la ventana.
      Se aconseja seleccionar un nombre de modelo seguido de la letra "D".
  5. Si el tipo de ventana no debe contener ningún menú principal, borre el menú principal de la ventana.: en la pestaña "Ventana", en el grupo "Barras y menús", despliegue "Menú principal" y seleccione "Eliminar menú principal".
  6. Guarda la ventana ( ).

Creación de una ventana plantilla para las ventanas RAD (RAD guardado para compatibilidad con versiones anteriores)

Para crear una ventana plantilla para las ventanas RAD (RAD guardado para compatibilidad con versiones anteriores):
  1. Defina la ventana para crear. Los diferentes tipos de ventanas RAD son los siguientes:
    • Ventana de menú
    • Ventana de forma: simple, con navegación, con relacionado tabla, con relación tabla, con archivo relacionado
    • Ventana de la mesa: simple, con forma detallada, con relacionado tabla, de relación
    • Ventana Vision Plus
  2. Abrir la ventana de referencia de la plantilla. Si ha utilizado las notaciones recomendadas, esta ventana se llama "<NameOfSkinTemplate>_Reference".
  3. Guardar la ventana con un nombre diferente: en la pestaña "Inicio", en el grupo "General", despliegue "Guardar" y seleccione "Guardar como". Esta nueva ventana contiene automáticamente todas las características de la ventana de modelo.
    Para identificar fácilmente las diferentes ventanas de la plantilla, se recomienda utilizar un nombre de ventana correspondiente a la ventana RAD asociada. Por ejemplo: "Form_tabla_relacionada" para una ventana de formulario con una tabla relacionada.
  4. En la pestaña "Vista", en el grupo "Opciones", haga clic en "Modo plantilla" (Alt + G). Se muestra la ventana para editar una plantilla.
  5. Seleccione el patrón RAD asociado a la ventana de plantilla actualmente creada (nombre de la modelo seguido de la letra 'D') y valide su elección. Varias áreas aparecen en la ventana de plantilla. Estas áreas se utilizan para mostrar los diferentes controles (tablas, botones, botones, botones de navegación, etc.) generados por RAD para el tipo de ventana RAD que se seleccionó de antemano..
    Observación: Se proponen tres plantillas para cada tipo de ventana. La letra que se encuentra después del tipo de ventana indica la posición de los botones en la ventana:
    • D: Los botones se encuentran en la sección derecha de la ventana.
    • G: Botones que se encuentran en la sección izquierda de la ventana.
    • B: Botones que se encuentran en la sección inferior de la ventana.
      Se aconseja seleccionar un nombre de modelo seguido de la letra "D".
  6. Usar (si es necesario) los marcadores de posicionamiento para posicionar las áreas de plantilla: en la pestaña "Vista", en el grupo "Ayuda edición", seleccione la opción "Reglas" (Ctrl + R). Para obtener más información, consulte reglas de alineación.
  7. Definir el anclaje de las áreas de la plantilla en la ventana de descripción de la plantilla: en la pestaña "Modificación", en el grupo "Ayuda edición", haga clic en "Descripción". El anclaje de una zona de plantilla se define en relación con la ventana.
  8. Si el tipo de la ventana RAD no debe contener ningún menú principal, borre el menú principal de la ventana.: en la pestaña "Ventana", en el grupo "Barras y menús", despliegue "Menú principal" y seleccione "Eliminar menú principal".
  9. Si la ventana corresponde a la ventana de menú generada por el RAD, marque "MDI padre" en la pestaña "Detalles" de la descripción de la ventana..
  10. Guarda la ventana ( ).
Observación: Estas operaciones deben realizarse para todas las ventanas RAD utilizadas en sus aplicaciones.

Adición de botones adicionales (RAD conservado para compatibilidad con versiones anteriores)

Al crear una ventana RAD, WINDEV crea automáticamente todos los botones necesarios para utilizar la ventana. Estos botones adoptan el estilo de botón por defecto (definido en la ventana de descripción del control).
Para usar un estilo de botón diferente, agregue un botón y defina su estilo en la ventana de plantilla. Por ejemplo, en una ventana de plantilla dada, usted tiene la habilidad de usar botones de navegación diferentes a los definidos por defecto.
Si se añaden botones adicionales en una ventana de plantilla, estos botones serán utilizados automáticamente por WINDEV al crear la ventana RAD.
Para añadir un botón adicional:
  1. Cambiar la ventana al modo de edición: en la pestaña "Vista", en el grupo "Opciones", haga clic en "Modo plantilla" (Alt + G).
  2. Añada un botón a la ventana.
  3. Defina las características de este botón en su ventana de descripción ("Descripción" de el menú contextual).
  4. Cambie la ventana al modo plantilla: en la pestaña "Vista", en el grupo "Opciones", haga clic en "Modo plantilla" (Alt + G).
  5. Mostrar la ventana de descripción de la plantilla: en la pestaña "Modificación", en el grupo "Ayuda edición", haga clic en "Descripción". Seleccione la pestaña "Controles".
  6. Seleccione el botón añadido.
  7. Definir el tipo, el anclaje y la zona de plantilla asociada a este botón.
    Observación: Un control asociado a una zona de plantilla está anclado en relación con esta zona (y no con la ventana).
  8. Validar la descripción de la plantilla.

Ancho inicial de la ventana (RAD conservado para compatibilidad con versiones anteriores)

El ancho inicial de la ventana debe ser lo suficientemente grande para mostrar todos los botones asociados a cada área de botones.. Al crear una ventana RAD, los botones se mostrarán verticalmente si no se pueden mostrar horizontalmente.
Etapa 5: Creación final de plantilla

Presentación

Para utilizar un plantilla personalizado en sus aplicaciones, debe crear el plantilla final.. Para ello, debe exportar a un plantilla:
  1. la ventana que contiene los estilos de los controles,
  2. luego todas las ventanas de plantilla que fueron creadas de antemano.
Atención: El orden de exportación de las ventanas es importante.
Para simplificar el uso de un plantilla personalizado, le aconsejamos que cree vistas previas. Estas vistas previas se utilizarán al aplicar una plantilla a una ventana o a un proyecto.
Cada tipo de ventana está asociado a una vista previa. Recomendamos que cree una vista previa de la ventana para cada tipo de ventana utilizada.
Observación: La creación de una vista previa de la ventana es un paso opcional. En este caso, no se muestra ninguna vista previa de plantilla en el área "Preview".

Creación de una plantilla

Para crear una plantilla:
  1. Abra la ventana que contiene los estilos de los controles. Si ha utilizado las notaciones recomendadas, esta ventana se llama "<NameOfSkinTemplate>_Control".
  2. En la pestaña "Inicio", en el grupo "General", despliegue "Guardar" y seleccione "Exportar .. A una plantilla".
  3. Introduzca el nombre de la plantilla ("Caribe" por ejemplo) y valide la entrada.
    Al exportar la ventana que contiene los estilos de los controles:
    • el directorio "<NameOfSkinTemplate>" se crea en el directorio "Personal\SkinTemplate" de WINDEV.
    • se crea una hoja de estilo plantilla ("<NameOfSkinTemplate>.STY") en el directorio "<NameOfSkinTemplate>".
    • se crea una hoja de estilo que puede ser usada en tiempo de ejecución ("<NameOfSkinTemplate>.WDY") en el directorio "<NameOfSkinTemplate>".. Esta hoja de estilo se instalará automáticamente junto con su proyecto. Esta hoja de estilo es necesaria para aplicar dinámicamente una plantilla a una ventana (CambiarPlantillaSkin).
  4. Las operaciones 1 a 3 deben realizarse para todas las ventanas de plantilla seleccionando el plantilla que fue introducido previamente.
    Al exportar las ventanas de plantilla, los siguientes elementos se copiarán en el directorio "Personal\SkinTemplate\<NameOfSkinTemplate>":
    • la ventana exportada como "<NameOfSkinTemplate><Window#>.WDW",
      donde <Window#> corresponde al número de identificación de la ventana asociada.
      Tipo de ventanaIdentificación #
      Ventana en blanco00
      Ventana de menú01
      Ventana de formulario simple10
      Formulario con ventana de navegación02
      Formulario con la ventana relacionado tabla06
      Forma con relación ventana tabla07
      Formulario con ventana de formulario relacionado11
      Ventana simple de tabla03
      Tabla con ventana de formulario detallada05
      Tabla con ventana relacionado tabla09
      Ventana Relación tabla08
      Ventana Vision Plus04
    • los archivos utilizados en la ventana exportada (imagen de fondo, por ejemplo).
  5. La plantilla personalizada ahora puede ser utilizada. Para obtener más información, consulte Uso de una plantilla en sus aplicaciones.
Observación: para que WINDEV pueda utilizar la plantilla, WINDEV debe reiniciarse.

Crear una vista previa de plantilla

Para crear una vista previa de plantilla:
  1. En un proyecto asociado a un análisis, cree una nueva ventana. Cree, por ejemplo, una ventana "Formulario con navegación".
  2. Seleccione la plantilla de la ventana que se ha creado de antemano. En la zona "Preview" no se muestra ninguna vista previa de plantilla.
  3. Validar la creación de la ventana. La ventana creada se convierte en la ventana actual.
  4. Realice una copia de la ventana creada (Ctrl + C).
  5. Pegue el contenido del portapapeles en un software de dibujo (por ejemplo, Ctrl + V en "Paint").
  6. Guardar imagen:
    • en el directorio "Personal\SkinTemplate\<NameOfSkinTemplate>" de WINDEV.
    • de acuerdo con la siguiente notación: "RadWin_<Window#>.GIF",
      donde <Window#> corresponde al número de identificación de la ventana asociada.
      Tipo de ventanaIdentificación #
      Ventana en blanco00
      Ventana de menú01
      Ventana de formulario simple10
      Formulario con ventana de navegación02
      Formulario con la ventana relacionado tabla06
      Forma con relación ventana tabla07
      Formulario con ventana de formulario relacionado11
      Ventana simple de tabla03
      Tabla con ventana de formulario detallada05
      Tabla con ventana relacionado tabla09
      Ventana Relación tabla08
      Ventana Vision Plus04
Observaciones:
  • Una imagen específica se utiliza cuando se aplica la plantilla a un proyecto.. El nombre de esta imagen debe ser: "RadWin.GIF".
  • La plantilla se puede editar directamente abriendo el archivo STY en el editor.
Versión mínima requerida
  • Versión 9
Esta página también está disponible para…
Comentarios
Haga clic en [Agregar] para publicar un comentario

Última modificación: 27/05/2022

Señalar un error o enviar una sugerencia | Ayuda local