OK,大功告成,现在是集视频和文字聊天的多人在线聊天室就实现了,不足的是只能一对一聊天。如果我要对大家说话怎么办呢?于是我在本案例中设计了一个
小喇叭功能,通过发送小喇叭实现全服务器喊话。下边是下喇叭组件代码:
<?
xml version
=
"
1.0
"
encoding
=
"
utf-8
"
?>
< mx:TitleWindow xmlns:mx = " http://www.adobe.com/2006/mxml " layout = " absolute " width = " 540 " height = " 50 "
headerHeight = " 8 " roundedBottomCorners = " true " borderColor = " #000000 " >
< mx:TextInput x = " 2 " y = " 3 " width = " 400 " id = " txtMessage " />
< mx:Button x = " 466 " y = " 3 " label = " 关闭 " click = " onClose(event) " />
< mx:Button x = " 410 " y = " 3 " label = " 发送 "
enabled = " {txtMessage.text.length > 0 ? true : false} "
click = " onSend(event) " />
< mx:Script >
<! [CDATA[
import mx.core.Application;
import mx.events.CloseEvent;
import mx.managers.PopUpManager;
private function init(): void
{
this .txtMessage.setFocus();
}
private function onClose( event :MouseEvent): void
{
onCloseHandler( null );
}
private function onCloseHandler( event :CloseEvent): void
{
Application.application.speakFlag = false ;
PopUpManager.removePopUp( this );
}
private function onSend( event :MouseEvent): void
{
Application.application.userSO.send( " speakMessage " ,txtMessage.text,Application.application.myInfo);
this .txtMessage.text = "" ;
onCloseHandler( null );
}
]] >
</ mx:Script >
</ mx:TitleWindow >
< mx:TitleWindow xmlns:mx = " http://www.adobe.com/2006/mxml " layout = " absolute " width = " 540 " height = " 50 "
headerHeight = " 8 " roundedBottomCorners = " true " borderColor = " #000000 " >
< mx:TextInput x = " 2 " y = " 3 " width = " 400 " id = " txtMessage " />
< mx:Button x = " 466 " y = " 3 " label = " 关闭 " click = " onClose(event) " />
< mx:Button x = " 410 " y = " 3 " label = " 发送 "
enabled = " {txtMessage.text.length > 0 ? true : false} "
click = " onSend(event) " />
< mx:Script >
<! [CDATA[
import mx.core.Application;
import mx.events.CloseEvent;
import mx.managers.PopUpManager;
private function init(): void
{
this .txtMessage.setFocus();
}
private function onClose( event :MouseEvent): void
{
onCloseHandler( null );
}
private function onCloseHandler( event :CloseEvent): void
{
Application.application.speakFlag = false ;
PopUpManager.removePopUp( this );
}
private function onSend( event :MouseEvent): void
{
Application.application.userSO.send( " speakMessage " ,txtMessage.text,Application.application.myInfo);
this .txtMessage.text = "" ;
onCloseHandler( null );
}
]] >
</ mx:Script >
</ mx:TitleWindow >
同样通过远程共享对象的send()方法实现发送小喇叭功能,在客户端定义一个方法(speakMessage)来接受小喇叭发送的消息内容,然后显示在用户聊天界面上。
public
var speakFlag:Boolean
=
false
;
private function onSpeaker( event :MouseEvent): void
{
if ( ! speakFlag)
{
var dis:Speaker = new Speaker();
dis.x = 230 ;
dis.y = 505 ;
PopUpManager.addPopUp(dis, this , false );
speakFlag = true ;
}
}
public function speakMessage(message:String,info:UserInfo): void
{
message = " 【小喇叭】: " + info.NickName + " 说: " + message;
writeMessage(message);
}
private function onSpeaker( event :MouseEvent): void
{
if ( ! speakFlag)
{
var dis:Speaker = new Speaker();
dis.x = 230 ;
dis.y = 505 ;
PopUpManager.addPopUp(dis, this , false );
speakFlag = true ;
}
}
public function speakMessage(message:String,info:UserInfo): void
{
message = " 【小喇叭】: " + info.NickName + " 说: " + message;
writeMessage(message);
}
貌似这一整篇都是代码,除了代码我也不知道该怎么去介绍更容易说得清楚了,下面来看看上面的劳动成功,启动服务器后运行多个客户端来聊天测试看看。
现在还差一个重要的功能没有实现了,前面提到过画中画功能,也就是说在和在线朋友进行视频聊天的同时,需要将自己的视频以小视频窗口的方式显示在聊天窗口,实现所谓的画中画功能,显示自己的视频通过初始化方法,程序启动后就直接显示出自己的视频。
private
function init():
void
{
// 将自己的视频显示在画中画中
cam = Camera.getCamera();
if (cam != null )
{
this .myVD.attachCamera(cam);
}
else
{
writeMessage( " 未能找到视频设备,请检测是否正确安装设备! " );
}
}
{
// 将自己的视频显示在画中画中
cam = Camera.getCamera();
if (cam != null )
{
this .myVD.attachCamera(cam);
}
else
{
writeMessage( " 未能找到视频设备,请检测是否正确安装设备! " );
}
}
本文就介绍到这里,关于聊天表情的实现这里就不作介绍了,由于时间关系本案例里也没有实现这个功能,有兴趣的朋友可以下载源代码自己去扩展实现聊天表情这个功能。这里我将实现的原理简单说一下,通过TileList组件加载表情图片或动画信息显示出来,详细可以参考《使用TileList+TitleWindow组件开发聊天表情功能 》,发送表情则是将图片地址通过SharedObject的send()方法发送出去,接收消息的方法通过图片地址,组合<img src='图片地址' />然后显示在聊天信息窗口中。
本文转自博客园,其版权归作者和博客园共有。
作 者:Beniao