Designer Workbench de la infraestructura de interfaz de usuario web para desarrolladores de aplicaciones

El entorno de trabajo Designer Workbench permite utilizar herramientas WYSIWYG para crear pantallas nuevas para una aplicación. Tiene herramientas similares al Extensibility Workbench, que se utiliza para cambiar las pantallas de una instalación estándar de una aplicación.

Puede acceder a Designer Workbench de dos maneras:

Un URL.
Los desarrolladores de aplicaciones acceden a Designer Workbench mediante este método.
Un enlace en Extensibility Workbench.
Los desarrolladores personalizados acceden a Designer Workbench mediante este método.

Nota: Aunque puede acceder a Designer Workbench desde una instalación predefinida de una aplicación, está limitado en los cambios que puede realizar. Trabaje con el soporte al cliente de IBM® al cambiar una instalación predefinida utilizando Designer Workbench.

Visión general funcional

El diseño de la interfaz de usuario de Designer Workbench incluye editores y vistas con diversas fichas. Utilice estas vistas para trabajar con:

Widgets
Orígenes de datos
Archivos de proyecto
Diseños de pantalla
Jerarquía de componentes
Propiedades del componente
Plantillas de código

Visión general técnica

La interfaz de usuario de Designer Workbench se crea utilizando la infraestructura JavaScript de Ext JS. Los elementos de la IU de una pantalla se almacenan en un archivo en el formato de metadatos JSON. Estos metadatos se utilizan para generar objetos de configuración de extensión, que puede editar en Ext JS. Ext JS da soporte a la edición de objetos de configuración sólo para crear o cambiar componentes de interfaz de usuario.

Los componentes de la paleta residen en un registro de componentes. La clase de componente extiende la clase sci.ide.DefComponent. Utilice los atributos siguientes de la clase sci.ide.DefComponent para añadir un componente nuevo al registro de componentes de Designer Workbench:

Atributo	Descripción
ID	ID exclusivo del componente que se utiliza para distinguir entre todos los componentes disponibles en Designer Workbench.
tipo	Tipo registrado del componente. Suele ser el tipo xtype del componente.
Texto	Texto de visualización del componente.
acronym	Acrónimo del componente. Se utiliza para instancias de variables de denominación automática.
iconCls	Clase del icono css que se utiliza como icono del componente.
categoría	Categoría bajo la cual se agrupa el componente. Para añadir el componente a Design Workbench, debería agruparse en Controles, Paneles u Otros. Si se debe crear una nueva categoría, ésta debe registrarse.
nombrado	Propiedad booleana que toma el valor predeterminado de true si el componente extiende sci.ide.DefComponent. Cuando se añade un componente named a una pantalla, se añade a él una propiedad sciId de generación automática.
applyDefaults	Este método acepta el modelo (un objeto que contiene propiedades asociadas con un componente) del componente que se va a crear como su argumento y aplica las propiedades predeterminadas del componente al modelo.
getProperties	Este método devuelve una colección (Ext.util.MixedCollection) de todas las definiciones de propiedades del componente. El ID de la propiedad es la clave que se correlaciona con una definición de propiedad. Las propiedades se pueden añadir a un Registro de propiedades para acceso global. Una definición de propiedad es un objeto JavaScript con los atributos siguientes: ID Identificador exclusivo de una propiedad. Si la propiedad está presente en los docs Ext, puede que sea la misma que la opción de configuración del constructor de componente. tipo Tipo de datos de la definición de propiedad. isArray Valor booleano que indica si la propiedad actual es una matriz. getDefaultValue Método que devuelve el valor predeterminado de la propiedad. getDefObject Método que proporciona la definición de propiedad al llamante. getValues Método que devuelve una matriz de todos los valores posibles de la propiedad.
resolveLink	Este método debe implementarse si el componente que se va a añadir es un contenedor, es decir, puede aceptar cualquier otro componente/contenedor de Designer Workbench. Se utiliza para decidir si el componente que se va a añadir puede ser aceptado como un hijo.
validar	Este método acepta el modelo del componente como argumento y verifica si el componente está en estado de error. Si el modelo se encuentra en estado de error (conjunto incoherente de propiedades y valores), puede mostrar errores, avisos o sugerir correcciones (si están disponibles).