Formas Incrustadas FMX

 

RAD_icons2

Ésta entrada está basada en el ejemplo FMXEmbeddedForm (Delphi) localizado en la wiki de documentación de Embarcadero donde nos muestra como incrustar una forma dentro de otra y la intención de la presente entrada es desarrollar paso a paso la forma como hacerlo con Delphi XE7.

Y sin más preambulo comenzaremos creando una aplicación multi-dispositivo, para ello seleccionaremos en los proyectos de Delphi la opción Multi-Device Application.

 

FI-01

 

Posteriormente seleccionamos el tipo de aplicación multi-dispositivo, personalmente utilizo una aplicación en blanco.

 

FI-02

 

A continuación agregamos una nueva forma multi-dispositivo desde el menú File –> new –> Multi-Device Form – Delphi como se muestra en la siguiente figura.

FI-03

 

Elegimos el tipo de Forma HD y presionamos el botón OK.

FI-04

 

Antes de continuar guardamos nuestro proyecto, la unit1 la guardamos como uFormaPadre y la unit2 como uFirmaIncrustada, al proyecto le pueden asignar el nombre que deseen.

FI-05

 

Agramos a nuetra formaPadre dos componentes, 1 ToolBar con la propiedad Align = Top y 1 Panel con la propiedad Align = Client como se muestra en la siguente figura.

FI-06

En la formaIncrustada agregamos tres componentes, 1 TabControl con la propiedad Align = Client donde agregué 3 Tabs y dos TButton, ustedes pueden agregar los componentes que deseen, la idea es mostrar la forma con algunos componentes para poder observar fácilmente el efecto deseado.

FI-07

El siguiente paso es agregar la unidad uFormaIncrustada en nuestra formaPadre, para ello pueden hacerlo presionando Alt-F11 o en el menu File –> Use Unit o escribiendo manualmente la unidad en una sección Uses de la formaPadre.

FI-08

 

Adicionalmente agregamos un procedimiento llamado EmbeddedForm() en la sección Private de la clase Tfrm_Padre (TForm1 si no cambiaron el nombre de la forma) como se muestra en la siguente imagen, a continuación presionamos Ctrl + Shift + C para agregar nuestro procedimiento en la sección de implementación y escribimos el código que se realizará cuando se llame a dicho procedimiento.

FI-09

 

Ahora ya podemos hacer la llamada a  nuestro procedimiento, en éste caso  se ha decidido seguir el ejemplo de la Wiki de Embarcadero utilizando el evento OnCreate de la formaPadre, en la siguente figura se muestra dicha llamada.

Podemos observar que el procedimiento va a incrustar la formaIncrustada en el objeto Panel de la formaPadre en el momento que la aplicación se crea, ustedes pueden jugar con la formaPadre para ejecutar el procedimiento en el momento que lo deseen, incluso pueden agregar código a la formaIncrustada para que ejecute lo que deseen una vez que ya está incrustada en la formaPadre.

FI-10

 

En éste momento nuestra aplicación ya está lista para ser ejecutada en cualquiera de los dispositivos que desee y que están disponibles en DelphiXE7 , en mi caso lo hice para Android y para Windows 32Bits, pero se puede compilar sin problema para los demás y utilizando el mismo código por supuesto.

A continuación pueden ver la imagen en los dós dispositivos compilados.

 

FI-11
Android teléfono LG-P880

 

FI-12
Windows 32 Bits

 

Descargas


Si lo deseas puedes descargar el código fuente de ésta entrada, espero sea de utilidad.

[download id=”20″]


Ésta entrada y el código fuente son libres para su uso y publicación, lo único que te pido, si te parece justo, es mencionar la fuente de donde se obtuvo.

5 comentarios “Formas Incrustadas FMX”

  1. Hola, He hecho lo que tu dices y funciona… pero que pasa con la alineacion de formulario embebido. Como es un form no tiene la propiedad ALIGN para alinearlo al CLIENTE que es el panel.
    Me puedes ayudar con este tema ?

    1. Hola frank, gracias por tomarte el tiempo de “experimentar” con mi publicación.

      Hasta donde entiendo, la forma se alinea automáticamente ‘alClient, pero si eso no sucediera puedes probar con el siguiente código.


      AForm.Left := 0;
      AForm.Top := 0;
      AForm.Height := Panel1.Height;
      AForm.Width := Panel1.Width;

      No dejes de retroalimentarnos con tus pruebas.

      Saludos

  2. Gracias x compartir tu experiencia !

    Estoy empezando con XE7 aunque tengo mucha experiencia con D7 y estoy preocupado por el tamaño de los dispositivos y como escalar la aplicación: formularios de entrada, rejillas con datos y demás… a cada dispositivo.

    No tengo claro como conseguirlo.

    Si puedes dedicarle una entrada al escalado de aplicaciones…

    ¿puedes recomendarnos alguna publicación sobre XE ?

    Gracias y saludos cordiales

    Jesus

    : )

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *