Componentes externos (I)

En la serie de artículos que empieza hoy, vamos a aprender paso a paso cómo crear un componente para Xailer 2.0 y cómo integrarlo en el IDE.

En este capítulo aprenderemos lo más básico para crear un nuevo componente, generar la DLL para el IDE y la librería estática (.LIB) para enlazar con las aplicaciones en las que queramos usarlo.

Lo primero que vamos a hacer es crear un nuevo proyecto, al que llamaremos MyFirstComponentDll, en la carpeta samplesMyFirstComponent.

Cuando el IDE muestre el formulario «Propiedades del proyecto», seleccionaremos la opción DLL en «Tipo de proyecto» y haremos un pequeño cambio. En la opción carpetas, en la entrada Obj el IDE nos ofrecerá c:xailer2samplesMyFirstComponentDllObj como directorio por defecto, pero le añadiremos «Dll» a esta ruta, quedando c:xailer2samplesMyFirstComponentDllObjDll. Una vez hecho esto, aceptaremos el resto de opciones por defecto para continuar.

En estos dos pasos anteriores hemos generado el archivo de proyecto para construir la librería dinámica para el IDE. Lo siguiente será repetir estos pasos pero cambiando un par de cosas:

Creamos otro proyecto en el mismo directorio (esto es importante), donde hemos guardado el anterior, pero con otro nombre, esta vez le llamaremos «MyFirstComponent».

Otra vez el IDE nos muestra el formulario «Propiedades del proyecto», seleccionaremos la opción LIB en «Tipo de proyecto» y aceptamos.

Si los dos pasos anteriores se han completado correctamente, debemos tener dos archivos de proyecto «MyFirstComponentDll» y «MyFirstComponent» en la carpeta samplesMyFirstComponent.

Para no complicar demasiado este artículo, el componente que vamos a crear, TMyLabel, será un control derivado de TLabel y cuya única diferencia con la clase padre es que va a tener como color de fondo por defecto el blanco y no va a ser transparente.

Construir la librería

Una vez que ya tenemos el espacio de trabajo listo, podemos empezar con la definición del componente. Añadimos un nuevo módulo PRG (CTRL+N) y lo salvamos (CTRL+S) con el nombre MyLabel.prg

En este nuevo módulo desarrollamos la clase TMyLabel:


CLASS TMyLabel FROM TLabel

PUBLISHED:
   PROPERTY nClrPane       INIT clWhite
   PROPERTY lTransparent   INIT .F.

ENDCLASS

Compilamos (F9) y si todo ha ido bien, el IDE habrá construído MyFirstComponent.Lib en la carpeta del proyecto.

Construir la DLL

Para terminar de construir el componente, abrimos el proyecto MyFirstComponentDll que creamos al principio y con Proyecto->Añadir archivo al proyecto, añadimos el archivo MyLabel.prg con la definición de la clase.

Creamos un nuevo módulo PRG (CTRL+N) y lo salvamos (CTRL+S) con el nombre MyLabelDll.prg y le añadimos el código que se encargará de registrar el componente en el IDE:

INIT PROCEDURE InitDLL()

   RegisterComponent( "Samples", "mylabel", "TMyLabel", {|| TMyLabel() } )

RETURN


En el caso de un proyecto que tenga más de un componente, la única diferencia es que será necesario llamar a RegisterComponent() tantas veces como necesitemos, por ejemplo: supongamos que tenemos un proyecto que contiene tres controles tal que TMyLabel, TMyEdit y TMyButton, registrarlos es tan sencillo como:


INIT PROCEDURE InitDLL()

   RegisterComponent( "Samples", "mylabel", "TMyLabel", {|| TMyLabel() } )
   RegisterComponent( "Samples", "myedit", "TMyEdit", {|| TMyEdit() } )
   RegisterComponent( "Samples", "mybutton", "TMyButton", {|| TMyButton() } )

RETURN


Por supuesto, recordando siempre que deberemos añadir al archivo de recursos una imagen por cada componente para identificarlos correctamente en la paleta del IDE.

Para completar la construcción del componente, necesitaremos una imagen que lo identifique en la paleta del IDE. Para ello abrimos el Gestor de recursos del menú Vista, pulsamos en el botón «Nuevo recurso» y aceptamos el nombre por defecto que nos ofrece el IDE.

Una vez creado el archivo de recursos, añadimos el bitmap que identificará al nuevo componente y cerramos el gestor de recursos.

Consideraciones

La función RegisterComponent() le indica al IDE el nombre de la paleta en la que colocar el componente, el nombre del bitmap, la tooltip que se mostrará al poner el puntero del ratón encima del componente y la función de clase que crea el componente y hay que llamarla siempre que queramos registrar un componente externo.

Como norma general, el nombre del procedimiento que registra el componente puede ser cualquiera, la única condición es que sea un INIT PROCEDURE.

Hay que recordar que el bitmap debe tener unas dimensiones de 24×24 para que se muestre correctamente en la paleta y en caso de que el componente no tenga ningún bitmap asociado, el IDE le asignará uno por defecto.

Es posible incluir información en el propio componente usando la opción Proyecto->Propiedades del proyecto->Versión. La información de número de versión, copyright, etc. que se introduzca será accesible luego desde el botón «Información…» del Gestor de componentes.

Una vez completados los pasos anteriores, compilamos (F9) el proyecto y se creará la DLL con el nuevo componente listo para ser usado desde el IDE.

Instalar el componente

Para utilizar el componente desde el IDE, seleccionamos la opción Componentes->Gestor de componentes del menú principal, pulsamos el botón «Añadir» y desde el cuadro de diálogo que se muestra, apuntamos a samplesMyFirstComponent para seleccionar la DLL que acabamos de construir.

Una vez que pulsemos en el botón Aceptar y comprobamos que la pestaña «Samples» ya tiene correctamente registrado el nuevo componente.

Utilizar el componente

En aquellos proyectos donde queramos utilizar el componente, deberemos informar al IDE para que enlace la librería con nuestra aplicación, así que abrimos el formulario «Propiedades del proyecto» y en la opción «Librerías» añadimos la librería que construimos al principio y que estará en samplesMyFirstComponentMyFirstComponent.lib

Para probar el nuevo componente, creamos un nuevo formulario en un proyecto nuevo (o en uno de nuestros proyectos), seleccionamos la pestaña «Samples» de la paleta de componentes, pinchamos en el componente y lo soltamos en el formulario.

¡Funciona! Ahora habrá que probarlo también en tiempo de ejecución, así que F9 y …

Notas finales

Si se quiere hacer algún cambio en el código del componente y la DLL está cargada en el IDE, es importante no olvidar que antes de recompilar, hay que eliminarla con el Gestor de componentes, si no el enlazador nos dará un mensaje de error avisando que la DLL está siendo usada.

El ZIPadjunto incluye el proyecto completo para generar la librería y la DLL.

Deja una respuesta