Lo primero que hago es
abrir mi recién instalado Flash Buider 4.5 y lo que hacemos es ir a File/New/Flex
Project; sale la siguiente ventana:
Lo que pide básicamente
para crear un nuevo proyecto es: Un nombre de proyecto, utilizamos para darle
nombre HolaMundo, (por cuestiones de
programación es que escribimos así, no es porque la barra espaciadora se haya
destrozado ni nada parecido), luego pide una ubicación para guardar nuestro
primer proyecto, para este proyecto he creado una carpeta en mi unidad D para
tener seguros todos mis proyectos, lo siguiente que se debe de hacer es
seleccionar el tipo de aplicación que se va a desarrollar y lo interesante de
esto es que tenemos dos opciones un proyecto web que corre en cualquier
navegador web que disponga de flash player o una aplicación de escritorio que correrá
en Adobe AIR , pero tenemos que darnos cuenta también que se puede migrar de un
tipo de aplicación a otra así que por el momento lo más sencillo será dejarlo
como aplicación web.
La siguiente parte que nos
pide seleccionar es el SDK con el que se trabajara, la versión que estoy
probando es la versión Flex 4.5.1 que requiere de flash player 10 o superior
para que funcione correctamente. Se puede cambiar también a un SDK específico; para
continuar con la creación de nuestro primer proyecto pulsamos el botón
Siguiente.
Este paso para la creación
de un proyecto Flash Builder se refiere a la configuración del servidor una
parte esencial en todos los proyectos web dinámicos que se van a realizar, por
supuesto para este primer ejemplo no se utiliza ningún servidor pero servirá de
introducción, primero nos pide la tecnología de servidor con la que se planea
trabajar y tenemos que elegir entre usar una aplicación tipo servidor que puede
ser PHP, ASP, coldfusion o Java. Al seleccionar cualquiera de estos la ventana
cambiara para poder configurar detalles propios del tipo de servidor
seleccionado.
Como
dije para un primer proyecto lo que se debe hacer es dejarlo en la opción por
defecto None/Other, lo siguiente que
indica es la localización de nuestro proyecto flex compilado que se ubicara en
la carpeta llamada bin-debug, lo
dejamos todo tal como está y pulsamos el botón Next.
Este último paso para la
construcción de nuestro primer proyecto se refiere al manejo de la librería de
componentes que tiene Flash Builder, estas librerías le darán funcionalidad a
nuestros proyectos web o de escritorio; por lo que son importantes, como se
dijo anteriormente Flash Buider trabaja en una nueva arquitectura de
componentes y adquiere los componentes de otras versiones también; como es el
caso de MX, actualmente se está trabajando con componentes Spark que es lo que
funciona para nuestra versión de Flex; nuestro código se ubica en la carpeta src (source); y el archivo principal de
la aplicación se llama HolaMundo.mxml;
todo esto es llenado automáticamente pero es bueno saber donde se encuentra
cada cosa para no perderse. Como estamos trabajando de manera local no llenamos
el espacio de la carpeta de salida URL, por ultimo apretamos el botón Finish.
La pestaña de trabajo
principal puede cambiarse a dos modos, el modo diseño y el modo código; esto
nos ayuda en el desarrollo de aplicaciones de manera más rápida; en el panel de la izquierda se muestra
nuestro explorador de paquetes en la cual se observan todos los paquetes que
hemos configurado y creado con los pasos anteriores, y es donde se encuentran
las diferentes carpetas de trabajo como son la de código (src); que es donde
estamos actualmente y trabajamos dentro del archivo llamado HolaMundo.mxml;
también están las carpetas bin-debug que es la carpeta de compilación de
proyectos, también están las carpetas de las librerías y templates html.
El objetivo con el que
hicimos todo esto era para mostrar una aplicación web básica desarrollada en
flash Builder, y lo que debemos de hacer ahora es crear esa aplicación ejemplo.
Para
que sea fácil lo que se hace es cambiar a modo diseño y escoger del panel de
componentes de la carpeta controls el componente label y arrastrarlo al escenario de
trabajo principal luego de esto debemos de configurar sus propiedades en el
panel de la derecha llamado Properties,
esto es fácil si se ha desarrollado antes con dreamweaver o con otro framework similar.
En el área de texto escribimos el mensaje que queremos que muestre, en nuestro
caso la bienvenida “Hola Mundo”, luego configuramos su tamaño, tipo de letra y
posición.
Esto sería lo que deberíamos tener en nuestro
entorno de trabajo por el momento, ahora lo que hago es analizar un poco el
código de mi proyecto. Cambio de modo a Código (Source), y lo que debo de
encontrar seria la siguiente línea:
<s:Label x="359" y="100" fontFamily="Verdana"
fontSize="40" text="Hola Mundo"/>
Lo que básicamente muestra
esta etiqueta MXML es lo que se a configurado en modo diseño que sería la
posición, el tipo de letra, el tamaño y el contenido del mensaje que muestra en
la aplicación principal. Ahora tengo que hacer correr esa aplicación pulsando
ctrl+F11.
Notemos que en la
dirección url aparece como HolaMundo.html
sin embargo debemos entender que solo el contenedor es html, el contenido está
siendo mostrado en el player del usuario. Y con esto se ha creado una primera
aplicación en flash Buider.