jueves, 24 de abril de 2008

Internacionalizacion en Flex 3

En este tutorial se explica como integrar la internacionalización en Flex 3.

Se asume tener instalado, configurado el Flex Builder, y un proyecto flex vacío.

  • Creamos una carpeta "locale" en la raiz del proyecto
  • Dentro de esta carpeta crearemos una carpeta por cada idioma, y con el nombre correspondiante ej: es_CL,en_US,pr_BR,ja_JP .. etc
  • Ahora, dentro de cada directorio de idioma crearemos un archivo de igual nombre, como puede ser "recursoForm.properties", lo importante es que debe terminar con ".properties".
  • En estos archivos colocaremoas las traducciones. ej:
locate/es_CL/recursoForm.properties
pais = Chile
flag = Embed("images/chile.gif")

locate/en_US/recursoForm.properties
pais = US
flag = Embed("images/us.gif")

locate/pt_BR/recursoForm.properties
pais = Brasil
flag = Embed("images/brasil.gif")

locate/ja_JP/recursoForm.properties
pais = Japon
flag = Embed("images/japon.gif")


  • Creamos las respectivas carpetas "images" en cada carpeta de los locales, donde colocamos las imagenes que hemos declarado.
  • Ahora desde la linea de comando "cmd" nos dirigimos directorio de instalacion del sdk que utilicemos, en mi caso es:

C:\Archivos de programa\Adobe\Flex Builder 3 Plug-in\sdks\3.0.0\bin>

  • Y ejecutamos el comando copylocale.exe, para cargar los nuevos idiomas, su sintaxis es: copylocale locale_original locale_nuevo

copylocale.exe en_US es_CL
copylocale.exe en_US pr_BR

  • El en_US y el ja_JP vienen cargador por defecto.
  • Podemos ver los que han sido cargado en :
C:\Archivos de programa\Adobe\Flex Builder 3 Plug-in\sdks\3.0.0\frameworks\locale

  • Ahora en las propiedades del proyecto, en la seccion "Flex Compiler", en los argumentos para el compilador, agregamos los nuevos locales:

-locale=es_ES,en_US -allow-source-path-overlap=true -source-path=..\locale\{locale}

  • Bién ahora solo que hacer una pequeña aplicación donde lo podamos ver.

Y ejecutando la aplicación se puede apreciar así:

Al seleccionar el pais, también se carga el Label y la Image correspondiente

Hay dos formas de buscar un recurso:

  • Una es usando la directiva @Resource: este es el método simple pero tiene varias limitaciones. Ejemplo, solo se puede usar en MXML, no se pueden cambiar los locales en tiempo de ejecución y solo devuelve Strings.

<mx:formitem label="@Resource(key='nombre', bundle='recursos')">
<mx:textinput>
</mx:textinput></mx:formitem>


  • La otra forma es usando los métodos de la clase ResourceManager (como se muestra en el ejemplo): puede retornar distintos tipos de datos como int, Boolean, Number. Se pueden cambiar los locales en tiempo de ejecución

Cambiando los mensajes del sistema

Para cambiar los mensajes del sistema como "yes" por "si" , vamos a la carpeta de los locales, en mi caso:
C:\Archivos de programa\Adobe\Flex Builder 3 Plug-in\sdks\3.0.0\frameworks\locale\es_CL

Abrimos el archivo "framework_rb.swc", puede ser con winzip. Y editamos el archivo "controls.properties".

Y cambiamos donde dice:

yesLabel=Yes

por

yesLabel=Si

Y así podemos seguir con todas la que queramos.

Guardamos los cambios. Volvemos a compilar el proyecto y apareceran los cambios

miércoles, 23 de abril de 2008

Creando un proyecto Flex con Java y BlazeDS con RemoteObject en un solo proyecto

En este tutorial se explica paso a paso la puesta en marcha de un proyecto Flex y Java con RemoteObject de BlazeDS, todo sobre Tomcat.

Se debe tener instalado eclipse wtp y Flex Builder como plugin

Agregamos el Tomcat Server al entorno de Eclipse.


Creamos un proyecto Flex

Seleccionamos la arquitectura J2EE y se define la carpeta de recursos java


Seleccionamos el Tomcat server que habíamos configurado previamente e idicamos la ubicación de BlazeDS


Una vez creado el proyecto crearemos una simple clase Java, con un método que retorne un String



Luego lo declaramos el destination en el archivo flex\remoting-config.xml


Debemos realizar este pequeño cambio. En el campo de Contex root de la ventana de propiedades del proyecto cambiamos /WebContent por /tmp , que es el nombre del proyecto


Escribimos el archivo mxml que consumirá el RemoteObject. En este caso, al pinchar el botón, se cargará en el label del botón, el retorno del método.

Y lo hechamos a correr en el servidor tomcat.





Finalmente, con bombos, platillos y "hola mundo" incluido, lo podemos ver en el navegador .

pd: el builder para Linux aún está muy verde para este tipo de proyecto(front-end y back-end todo en un proyecto) .. habrá que esperar un poco más. ¬¬

:wq

miércoles, 16 de abril de 2008

Creando una aplicación CRUD en Flex y PHP

Para crear una alicaciónCRUD en Flex con PHP a través de HTTPServices, debemos disponer de un servidor de http, php y mysql; como XAMPP. Aquí lo podemos ver corriendo.



Con el Flex builder instalado, procederemos a crear una aplicación Web Flex con PHP.

En la siguiente pantalla se deben ingresar los datos del servidor web. Y finalizar el asistente
.

Una vez creado el proyecto, usaremos el asistente para crear la aplicación CRUD desde una Base de datos.
Procederemos a crear el perfil de conección a la base de datos en "New" si no existe. Seleccionamos el proyecto, la tabla y su identificador. Y Finalizamos el asistente.


El proyecto ahora contiene todo el código necesario. De aquí podemos sacar muchas ideas. Ahora podemos ejecutamos la aplicación para probarla.



Y ya tenemos una aplicación que permite listar, crear , edición en linea y eliminación de registros de una base de datos.


Como se pudieron dar cuenta este tutorial lo he desarrollado en windows, ya que el Flex builder para Linux está recién en alpha 3, y no posee este wizard.

:wq

Instalar Jdk y Tomcat

Aun que es un tema menor, no falta el que pregunta "..oye, como instalo java.." [ack] ¬¬
bueno... descarga el Jdk de http://java.sun.com/javase/downloads/index.jsp busca el que dice JDK6 Update N°

ya descargado, lo ejecutamos y lo movemos a un directorio del sistema

$ chmod +x jdk-6u6-linux-i586.bin
$ ./jdk-6u6-linux-i586.bin
#mv jdk1.6.0_06 /usr/local


Luego establecimos las variables en el sistema (/etc/profile) para que encuentre le directorio de instalación

# vi /etc/profile
(Y agregamos estas lineas al final del archivo)

export JAVA_HOME=/usr/local/jdk1.6.0_06
export PATH=$PATH:$JAVA_HOME/bin
export CLASSPATH=$CLASSPATH:$JAVA_HOME/lib


Incorporamos las variables:

# source /etc/profile


Lo mismo para Tomcat. Lo bajamos de http://archive.apache.org/dist/tomcat/ la última version

$ tar -xzvf apache-tomcat-6.0.16.tar.gz
$ cd apache-tomcat-6.0.16/bin
$ ./startup.sh


Se puede comprobar en el navegador, abriendo la dirección http://localhost:8080/


:wq