Developing Adobe Flex chat client

Together the Adobe Flex framework and BlazeDS framework provide infrastructure to create messaging/chat type of application. You can use the infrastructure to either create one to one or broadcast type of application.

I wanted to try this feature so i built a simple broadcast application, in which there will be one chat destination and multiple clients and connect to it and publish and subscribe messages from it. You can download that application from here

First download the BlazeDS application and use it for creating a new J2EE application.

Then open the messaging-config.xml, which has messaging related configuration required for BlazeDS and add a destination element in it like this

<?xml version="1.0" encoding="UTF-8"?>
<service id="message-service"
class="flex.messaging.services.MessageService">

<adapters>
<adapter-definition id="actionscript"
class="flex.messaging.services.messaging.adapters.ActionScriptAdapter"
default="true" />
<!-- <adapter-definition id="jms"
class="flex.messaging.services.messaging.adapters.JMSAdapter"/> -->
</adapters>

<default-channels>
<channel ref="my-polling-amf"/>
</default-channels>

<destination id="chat"/>
</service>


The chat destination will be used by flex application for both publishing and subscribing messages

Next create a ChatClient.mxml file like this


<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955"
minHeight="600" creationComplete="consumer.subscribe()">
<fx:Declarations>

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

</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.messaging.messages.AsyncMessage;
import mx.messaging.messages.IMessage;

private function send():void{
var message:IMessage = new AsyncMessage();
message.body.chatMessage = msg.text;
producer.send(message);
msg.text = "";
}
private function messageHandler(message:IMessage):void{
log.text += message.body.chatMessage + "\n";
}
]]>
</fx:Script>
<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>
</s:Application>


I am using declarative message handling, the mx:Consumer element declares that your interested in chat destination its messageHandler() method will get whenever there is a new message chat destination.

The mx:Producer element is used for publishing messages to the destination, i am calling its send() method to publish the text to the desination

2 comments:

flexdeveloper.in said...

Flex Application development- Flex is one of the most powerful RIA development platform that is based on the mighty Flash architecture. Flex development provides the developer to build web based applications that run on the client browser and function as typical desktop based software. We provide flex application development services at affordable price in India.

Abhi said...

Thanks for info
Web Design Company in Bangalore
Website development in Bangalore