Este tutorial muestra cómo crear una aplicación de chat en Flex usando el servicio de mensajería de trazado.

En primer lugar se puede descargar abierto. Tenga en cuenta que las fuentes también están disponibles

La configuración del servidor

1 - En su directorio abierto, WEB-INF/flex/messaging-config.xml abrir el archivo en un editor de texto. Si utiliza abierto con el módulo de servidor Tomcat, la aplicación Web se encuentra en este trazado: "install_dir / tomcat / webapps. Los mensajes-config.xml archivo contiene los ajustes de configuración para el servicio de mensajería. Si abre el archivo config.xml de servicios en el mismo directorio, verá que el archivo de mensajes-config.xml "se entiende incorporada por referencia en este archivo. El archivo "servicios-config.xml" permite un nivel configurationhaut abierto. En general, nos referimos a este archivo el archivo de configuración para definir los servicios específicos, tales como mensajería. También se definen como ajustes de los sistemas de mensajería y canales de la seguridad en este archivo.

2 - En el archivo config.xml de mensajería-, justo antes del elemento </ servicio>, agregar el siguiente y guarde el archivo:

<destination id="chat"/>

3 - El destino se define en el servidor donde el cliente será lanzado Flex y Flex que los clientes podrán recibir los mensajes que se han publicado. Tenga en cuenta que hay un canal predeterminado llamó a mi colegio electoral-AMF-configurado en el archivo config.xml mensajería. Trazado utiliza "cadenas" para enviar y recibir datos entre el cliente Flex y el servidor. El canal se define por defecto en el archivo config.xml servicios-y que sólo se hace referencia en el archivo config.xml mensajería. Este canal utiliza el Formato de mensaje de acción (AMF) y la sonda de servidor para los mensajes nuevos que lleguen a su destino. Además de los canales de "sondeo", abierto también los canales que mantienen la relación entre clientes y servidores de streaming y de flujo de datos (streaming) entre ellos.

4 - Iniciar o volver a iniciar el servidor de aplicaciones BlaseDS.

Lado del cliente en el desarrollo Flex

1 - En el Flex Builder 3, crear un nuevo proyecto abierto, tal como se describe aquí: http://learn.adobe.com/ ...

2-Nombre del proyecto chat1.

3 - En el archivo que Flex Builder chat1.mxml creado, se creará en la aplicación cliente que Flex puede publicar mensajes para el chat de destino y recibir mensajes desde el lugar de destino.

4 - Justo antes de <mx:Application> elemento chat1.mxml en el archivo, agregue un elemento <mx:Script> vacío. Puede hacerlo copiando el siguiente código:

<mx:Script>

<[CDATA [

]]>

</ Mx: Script>

5 - Justo antes de la partida </ mx: Script>, agregar el siguiente código MXML. Este código crea un mensaje de productores y un cliente. Productor envía mensajes a su destino y el cliente se suscribe y recibe los mensajes que se envían a su destino. En esta aplicación, crear objetos de productores y Atención MXML, pero como la mayoría de objetos de Flex, se puede crear en ActionScript.

<mx:Consumer id="consumer" destination="chat" message="messageHandler(event.message)"/>
<mx:Producer id="producer" destination="chat"/>

6 - Justo debajo de la <mx:Consumer> elemento, agregue el siguiente código MXML. Este código crea la interfaz de usuario para introducir los mensajes, enviar y ver mensajes. El Grupo tiene los objetos que contiene. El ControlBar también se utiliza para el diseño. Los mensajes de texto para mostrar en el lugar de destino. El control de TextInput permite introducir mensajes. A continuación, utilice el botón de control para enviar mensajes a su destino.

<mx:Panel title="Chat" width="100%" height="100%">
<mx:TextArea id="log" width="100%" height="100%"/>
<mx:ControlBar>
<mx:TextInput id="msg" width="100%" enter="send()"/>
<mx:Button label="Send B" click="send()"/>
</ Mx: ControlBar>
</ Mx: Panel>

7 - Copia el siguiente código ActionScript en la sección CDATA elemento <mx:Script>:

mx.messaging.messages.AsyncMessage de importación;
mx.messaging.messages.IMessage de importación;

privado la función enviar (): void (
var mensaje: IMessage AsyncMessage = new ();
message.body.chatMessage = msg.text;
producer.send (mensaje);
msg.text = "";

función messageHandler privado (mensaje: IMessage): void (
log.text = message.body.chatMessage + + "n";
)

Este código le permite:

• Importación y IMessage AsyncMessage clase de interfaz, que se utilizan en el método de enviar ().
• Crear método enviar () se llama al hacer clic en el botón de control. Este método crea un nuevo AsyncMessage y luego asignar un mensaje a la variable de tipo IMessage. Este conjunto el valor de la propiedad message.body.chatMessage con el valor de msg.text - el texto de la TextInput control. Este método llama al enviar () productor para enviar el mensaje, y claro la propiedad Text de la TextInput control.
• Estableció el método para recuperar el caso messageHandler (). Este método recupera el caso de "mensaje" cuando el objeto de cliente recibe el mensaje del destino. Este método muestra el texto en message.body.chatMessage propiedad log.text - el control de texto.
• Nota: Debido a que el método de enviar () toma una IMessage como un argumento en este caso expresamente a IMessage TYPER AsyncMessage interfaz que se aplica. Si no desea que esta convocatoria producer.send () con un AsyncMessage, la conversión se realiza automáticamente.

8 - Agregar la siguiente MXML atributos al elemento <mx:Application> Flex para el cliente suscribe el destino cuando se inicia la aplicación:

creationComplete = "consumer.subscribe ()"

9 - El mx: Aplicación debería tener este aspecto:

<mx: Aplicación xmlns: mx = "http://www.adobe.com/2006/mxml"
creationComplete = "consumer.subscribe ()">

El código MXML es ahora completa!

10 - Asegúrese de que el servidor se está ejecutando abierto.
11 - Compile y ejecute la aplicación cliente con Flex Builder por "Ejecutar> Ejecutar de la barra de menú.
12 - Abrir la misma URL en un segundo navegador.
13 - Escriba un mensaje en una ventana y aparecerá en otra ventana.

Y ahora, para nuestra primera aplicación con Adobe Flex abierto!

Pronto poner un nuevo tutorial en línea que le muestre cómo generar servicios web abierto con ...

Fuente: Adobe Aprenda

Si viene por primera vez el Flex-info.fr, puede suscribirse a la fuente RSS. Gracias por su visita!