你的位置:奥古多媒体 >> 资讯 >> 教程 >> FMS教程 >> 详细内容 在线投稿

多人互动聊天教程基于Flash Communication Server构建

排行榜 收藏 打印 发给朋友 举报 来源: aougu.com   发布者:foxet
热度179票  浏览1438次 时间:2007年1月25日 08:08
作者: Foxet
开发时间: 3.11.2003
开发工具: Flash MX,文本编辑工具
调试环境: Flash Communication Server 1.0或以上
开发知识: 有MX as 和FCS基础(本文对命令的‘用法’不作分析)
对象: 想了解“FCS如何结合FLASH进行开发应用”的人
                                 
   

一、前言

   
         

9|9k%H1gY!i0N4X!\0   说到网络上的文字、视频、音频等涉及通讯应用的开发,大多会想到用java(C++也可以),没错,java在这方面的确很强大的,但门槛高,需要有好的编程基础,就算会写,也得花不少时间,更不必说设计者开发这样的应用时要遇到多大的困难了......奥古多媒体 ]2B](J{1x)o]

奥古多媒体\2k1f?&]/~ Jm y

  但大多数的网络设计者对FLASH却是十分熟悉(就算不熟悉,总会了解一点吧),而且Flash的播放器受到广泛支持,MM看到了这些,它们发行的Flash Communication Server使设计者们可以通过Flash的脚本语言来控制复杂的网络交流,从而大大节省了开发时间......

Dxr ]&q|0 奥古多媒体%Fo$a~a

  我们这里就用FCS跟FLASH脚本编程结合起来,开发一个多人互动的应用,建议大家先看一下文件,知道有什么,接着看一遍本文,知道怎么回事,最后再结合文件,融会贯通。

"|H:W@n!y9Ad\ C)~0
   
    构思    
       

)Llt1e:z/Vt0先来构思一下内容:奥古多媒体o;I`T4|(JPC

奥古多媒体T#g Rhk8y J8f

奥古多媒体-|5~({z5Y \H
首先,我们会有一个场境,上面有一些物件(例如树,屋之类的)。
t,F+? k}z\(X/N[0 然后,当客人上我们的SWF,我们让他选择一个角色,填上自己的名字。
p{~N2[k8{0 接着,角色出现在场景。
|0SWo2C r_3P]0 再接着,有另外一些客人在地球不同地方也连上了,登陆后,他们也会有自己的角色,我在场景中可以看到他们,他们也可以看到我。奥古多媒体cK%XmS#p
然后再接着,象RPG网络游戏一样,我们会有走动,也可以看到对方的走动,并且我们之间会有文字的对话,如果喜欢,也可以只按一键 就可以用语音对话(视频就先免了吧,我们已经有角色来代替我们的样子的出现了,但不排除以后再加进去)。
奥古多媒体(f1[ pF8G|

奥古多媒体N:a q V%v\k

奥古多媒体 CUr+B E9{4tK"P
好了,我们心中已经有辐图像浮现出来了。

G-l;brEg0

%iO)xR[,Y0B0 

%Zx+O)om^;}0
   
       
         
    三、材料准备    
 

选材:

   
         

mda/F3w-S:Vr0本例子的素材选择很重要,决定我们的程序怎样写。奥古多媒体j"izZ g&`!j+m]

/Wo n%{}e%@D S4STr0一开始,我们先要决定材料的大小,视角,这个对我们的程序有很大的影响,大小比例要一致,这就决定我们需要的是一套完整的图片,视角也要一致(除了角色本身),这就决定我们还必须从这套完整的图片中挑选,因为我们看一个场景时只能看到一个方向,要么全是45,要么全是60度,如果你把一些不同角度的图片摆在一起,除了不协调外,程序上处理层次(层次指:每种物件因为位置不同都会有不同深度,一个物件会遮住另一物件)也会变得无所适从(注意:如果不是用数组地图可能没有的这个问题),只要视角能统一,无论是30度,45度还是n度,处理过程都基本一致,是没有难度的差别,(这里初学者可能会听得一头雾水,可以先往下看,在实践中思考)在这里我选了几张不太好的位图(找很辛苦),奥古多媒体d&g5Yb$R Or

um+EfF~0可以把这些图片归成两类
9TD7M0\t0yv0 角色;这里我们要用几个不同的角色,每个角色几个方向的图片都要准备,可以是4面,8面,甚至是16面,处理差别不大(由于材料的限制,我只用了四面的),而每个方向至少要有两张图,来模拟该方向的动态效果奥古多媒体5?7Z+Cxe z
物件:静态图就可以了,需要的时候也可以用动态图奥古多媒体,I'b}/l*i
接着,我们Firework或其他图形编辑软件将图片空白处转成透明,这样就得到素材了。
奥古多媒体6~N/u G5u

奥古多媒体n+T hj s+A

 

I ^e1HC9s-b-L0
   
 

理材:

   
          奥古多媒体0I)i5MC-M

将素材导入FLASH后,我们把不同物件的作成不同的MC, 对于数,屋,椅,我们处理如下(具体操作省) 奥古多媒体,\ ]M0e;c ahzwF8j

种类名称 Linkage Name MC Name
房子 room2 room2
小树 tree1 tree1
大树 tree2 tree2
椅子 sit1 sit1
邮筒 email email
垃圾箱 rul rul

1d {-`(d&a\;z\0 对于人物的处理,先建立一个mc:c1(所有的角色按照C1,C2,C3...),
;z3c2A X2gg0 c1内有4桢,每桢有一个表示方向的MC,MC名都是DIR,奥古多媒体"lV Mw;XqA
mc的分别代表四个方向:上下左右方向
N1_7u0D2L&K } {a0 mc:c1up,c1down,c1left,c1right
j%r$L(K8w@0 如果有多个方向图片,就多做个方向mc
j\u*}!xN W0 每一个方向mc有3桢,是该方向的动作

#|$i.A|q|8i"u0 奥古多媒体"sR6g3ww)Q

 奥古多媒体Z"I;A&K-Ek8Z

   
   
     
          奥古多媒体,t\y1M_

好了,我们已经准备好材料了,接下来我们开始写程序.奥古多媒体 Y:CS Q|8P+u

奥古多媒体 zK9?~AKZ:N

 奥古多媒体)R1tfC4`

奥古多媒体W3Q7Vr"y(n!I

 

1Yzq%Ui?x8WH ZW0
   
                               
   

四、编写程序:

              写的程序必须跟素材挂钩,但同时也要有自己的独立性,也就是写的程序必须适应你收集的素材,例如前面说到的视角,具有自己的独立性是指,写完这个应用后,如果要换素材,或者要扩展,程序不需要作出大举动的修改,所以我们写程序的时候要留有一着,说不定一段日子后我们要写一只网络RPG游戏,或者是写一个社区,我们把代码拿出来,可以容易地在远来基础上来改.奥古多媒体w uG/Xj"TnG&[
好,现在来看看素材跟程序对应的关系: 奥古多媒体6RM[dm

可视对象:                程序:奥古多媒体&o&Ze6p.{i:\4_
地图       --------- 数组地图(Map)
:d/ssuJ"D/gO0 物件(树之类的)  --------- 标记(Key) 
jKsBsx_0 角色        --------- 互动

J.]o;KU4f:J b8?0 奥古多媒体OGLJT@vE

需要通过FCS交换数据的部分
s&^Zy\/il%dsN0 角色踩点奥古多媒体m&ibJ}_0x,U@lA
角色方向动作奥古多媒体CTB?5Inr,X|GV"Q
音频奥古多媒体hg6V;p R,Q
文字奥古多媒体+^-X6V2Oh4s

奥古多媒体 nDf*A7DZ2_o8C _

 奥古多媒体:`6D F%m,L*oz

   
   

从地图开始着手,建立二维数组地图

 
            为什么要建立数组地图?这是小型RPG游戏的基础,它可以方便建立从简单到复杂的数学模型,适于扩展,例如一些地形,绕障,过场等,可以同过对数组的删减,二次变换等来实现,这部分很有趣,但本文在不作做详细的介绍。 奥古多媒体 Sn ^ P;K(M:R^ f

现在先把我们flash的视图模式改为显示格子,view->grid->show grid并把他的间隔设置为10×10,我觉得这种大小看起来比较舒服。奥古多媒体(v&T5KKS/gS
我们假定在场景一区域作为地图,把这段区域X轴方向分为rxn格,每格是大小是rx,Y轴方向分为ryn格,每格大小是ry,如果把整个场景也看为由rx,ry构成的小格,但数组地图的rx,ry不设为10,而是更小的5,那么我们可以1:2跟视图的格子联系上,startnx,startny分别表示地图起始的格数,现在我们把地图MC拖放到从第(startnx,startny)开始的位置。

I%p8tl8iJx p0 奥古多媒体Lch`4|

接下来要把数组建立起来,有的人喜欢会直接给出数组,但因为我们设地形为平坦,同时为了容易修改,我们用function建立,
kz#y5Krv7m0 mapadd(startnx, startny, rxn, ryn, rx, ry)奥古多媒体4Y$IwfS6q
现在从库中拖出地图的图片放在场景适当的位置中,我们可以很容易读出视图格子起始(6,5),转化成数组map时要乘2,奥古多媒体y&X dG+X2co

奥古多媒体 s `jL v~ f T]

y*{XBt^F3D@$mn.p0

&zck5M J jHJ0 奥古多媒体!G/L {R6_|n

     
   

角色行走基础:

            奥古多媒体#E/jWn6xw'k

本来介绍完地图,顺理成章应该介绍上面的物件才对,但有些东西为了让大家好理解,先提上来说.奥古多媒体{O R(r,Bx4@m%H
我们这里用的角色控制是经典的键盘控制行走,先简单介绍一下
v/z#?zn ^0 (有游戏基础的可以略过这里)
Nr)C`.Pa^Kj0 我们用以下这两条命令进行方向键捕获:
&q8p*EK{*E0 X轴方向的,左右两值相减,求出步行左右方向,步长为一奥古多媒体'i/s%MM3Z*@
var rl = (Key.isDown(Key.RIGHT)-Key.isDown(Key.LEFT));奥古多媒体w+]+Et.z/oX
Y轴方向的,左右两值相减,求出步行前后方向,步长为一奥古多媒体hI.F+M"L"Z9tWd
var ud = (Key.isDown(Key.DOWN)-Key.isDown(Key.UP));奥古多媒体!T(@U/Ax k [
接下来我们是要让人物在地图行走,奥古多媒体O3Of E9p8|^
随便拖一个角色进入场景,就拿c1吧,变量为_root.cha,奥古多媒体;[~:n^4| Gx
让其在数组地图有对应的坐标
oc+pQ M7e)v)a,}EUo0 _root.xpos,root.ypos
c I5I3IL#d na0 并让其通过数组地图取了实际坐标
X${H.E9L Q\0 map[_root.xpos][root.ypos]
G!Rt_)E,a4}0 请看下面的代码
奥古多媒体gAP8~\$E

奥古多媒体4uN$m1~D

奥古多媒体8HC;M-]5?f T

4j yn |7Dc'^$m5{v0
奥古多媒体!mzB*hnH \

奥古多媒体O xCE~mE

现在角色可以在地图上行走,而不会超出地图.但不能进行网络上的互动奥古多媒体3d!?)H4s1Yg7y
要进行网络上的互动就要通过FCS....,我们从登陆开始入手

O6y(X:DW m0

Z5Q0ku)w#P0 奥古多媒体@'ANU A:_;w uy

  服务端与客户端的对话
                             
                       
                             
           

,x1Q l'z*T6|X g0例子中我做了一个登陆平台(lib:LoginP)
^b#?2O]H&M5Da0 当某一用户填了名字,选了角色,并按LOGIN,我们就可以得到两个变量,奥古多媒体_| pl8TG%t|^
并调用doConnect function
奥古多媒体Zd ?YpLgt;W

o1S @7e U8p N1b#Z0奥古多媒体)Ns*P Z,V X V

9|!O2X4@fo0
"O0^:B.[8E"M u0 奥古多媒体D7Q~I6{fM

lP!?v.q[nT0 奥古多媒体D%WT%JYnPz6Z9X*{
奥古多媒体$pdZ0N.m.g T:{

a&pfz/A&PV*]f0

Njv2JM*m6u y0

)G!VyA~0 奥古多媒体K3~@c;qT

 奥古多媒体-m*F$R)u-pR.A

 

人物建立与人物的间文字交流

           

R(^`%Jr0现在把加入人物的 addcha function拿上来看看;从图中我们可以看到一个人物应该包括几部分,
e%o/iD w3t5J7d vRp0 一是角色本身的MC,二是人物对话框,三是登录名的标签
奥古多媒体2P9x c`M b.{P-T1SIp

^Qj"dcrBY[0奥古多媒体@5vq x"L$X*s _
奥古多媒体)[-mzU _ D1eJF
奥古多媒体1ser(Io\z6q

#T4InB#Iep0这时候当用户发送文字"倒,你很傻",用chat_so.sent("showmsg",_root.chaname,"倒,你很傻")
Sr9y7ei)z%T0 就可以各客户端包括自己调用showmsg."倒,你很傻"字样出现在对话框和又边的文字记录框

W XN&p5d0 奥古多媒体 O-A'v.M%vlw c

奥古多媒体.U6O|_O zM(g(K
奥古多媒体 rKp6D2O U2@q

     

再回到地图的行走

           

5k7Gh{[#q7j0
"?9nC0_3GK0
奥古多媒体2unZ/WI/D,bE

奥古多媒体uKP'\HPHUK

现在大家可以启动FCS来调试一下,如果发现有不正常的工作,要注意的是,有些机械化的操作(例如建立一个MC,设变量),我这里省略了过程,大家可能以参考看我的文件奥古多媒体|\&jgh%a

奥古多媒体#w~R]@.}

 

uc*`iiC+^ ['@V;l0

创建环境(添加物件)

 
           

?Mo/^-u"K/b0添加物件前,先把物件分类,再设置属性
'Sg ?i/O0 例如以树为一类物件,不同linageID表示其属于不同的类,这里是"tree",想象一下,当树 在场景中(同样要把它理解为在数组地图上的某个坐标),人物是不能穿过它的,也就是有些位置必须进行标识(管它叫该物件的占位点),标识其实就要是把在数组地图中对应坐标的KEY设为0,让人物行走时侦测到这一坐标不可以行走而停留.奥古多媒体-QVYVl'ss
好,再来看这树MC本身,它到底有那几个位置是不能穿过呢?(如果目测不太准确,可以先把MC放到场景在VIEW GRID 编辑方式下看,或者干脆CTRL+ENTER,用控制小人来确定,一般目测就可以了),我们看出这树的占位点大概有四点(看白色格子),而且都在同一Y轴的坐标上,这里要注意的是:树冠所占的坐标是可以行走的,只不过这时人物被树所遮,所以不能行走的只是树根的部分.由于TREE的坐标原点位于在左下角,那么这四个点为[0,0],[1,0],[2,0],[3,0]

Vw q:}-?:og0

0r~ZRaK(lW,B0我们表示为:
1~k(s(z)Zu4](Z0 clip_ocu.tree = [[0, 4]];
*QceQ&i0 clip_ocu是收集各种类型占位属性的对象

&dT8H(k]:K/p0
               
           

;] |o1O LLI7B~N0 奥古多媒体 oZ;On)E+L

9] Px E e)_%M+Y'P,J;z0可以看到clip_ocu.tree是一个二维数组,第一维表示Y轴,第二维表示X轴奥古多媒体#[^o'YM P6uN [l
这里的意思是在Y=0的位置,X的跨度范围从0到4的这些点都是占位点

%Mq$g I7e$fn3IdQ+}\0 奥古多媒体#tM0TA7r)wW qD O

再拿另一种类"tree2"来看看:奥古多媒体5B}#TFm
这样的占位点我们应该怎样表示呢?

Q}P9W-~tC0

} Hbx'O'BbE0 

gK(U OCS/x cR0
 
             
             
         

G+T(ap+v0 奥古多媒体DQ/aSY d

奥古多媒体,P\,s9{?K \)M4@

我们可以这样写
^;d o!~4e[0 clip_ocu.tree = [[0, 4],[0.4]];
CD[RB8fO0 表示在Y=0的位置,X的跨度范围从0到4,
j%bvz1Df0 在Y=1的位置,X的跨度范围从0到4,
0X k1dB"y$I1F0 这些点都是占位点
奥古多媒体X'Yz fC2mR6R)Bl

奥古多媒体!BS J M vg

由此可见,我们可以通过增加数组的长度来表示不同Y轴上连续的X坐标点,第二维数组所表示的跨度并不一定相等,也不一定要从0开始,例如:
9V.C%L!A"}o)S$Bt\0 clip_ocu.room2 = [[0, 11], [2, 15], [4, 19], [6, 22]]也是可以的,文件中的房屋就是这样的一个例子.奥古多媒体`i0r G7j
奥古多媒体0{:|*S8^@7g,s
奥古多媒体 ]6t;_){9zDrn,Xj#T

奥古多媒体E4b'Zhn xE n3A

可能有人会问,为什么要搞这几个表啊,直接把物件拖到场景不是更好?奥古多媒体1I1C)st;`-lp7F
其实这样做是为了能够方便修改和扩展,使我们只需对表操作就可以达到目的,同时为数学模型的建立提供良好的数据形式,例如我现在要多加个场景,我只需要调用相应的座位表,再addclips就可以完成操作了,再如,我要建立随机地图,那么可以先随机算出“网络”,再建表。
4OIa~b"gU?(y0 当然如果你只是想把这个应用做完就算了,不打算修改,扩展的话,那么你可以直接把物件拖到场景就ok了。

9X O6v*g/Ikq0
 

五、总结

      这篇文章到这里算是完了,但这个APP还有很多想象的空间,例如可以添加一些花巧的东西,验证,等级,踢人,动作之类的;也可以运用一些数学模型,如cameral,但要注意的是flash本身的功能限制,不要一味加入大量运算而使应用的可用性或可玩性降低,我比较倾向于把一些简单的运算给Flash,把一些复杂的留给数据库来做(如提供智能的数据),或者这时候大家已经想到前面我提到的网络RPG,社区之类的....
d_ ^@&sK0 还有的就是在这篇文章没提到的细节,大家可以参考一下我的源文件,如果有时间我也会以教程的方式作一点作补充。奥古多媒体5bq3mgp._ | @1F k,v
希望这篇文章对大家有点用,同时预祝大家开发出出色的互动程序。奥古多媒体f @l,wD
 
  源程序下载
{7S"S&a7e;b+n?K0
A,^V3BQ`#RQ0
顶:15 踩:11
对本文中的事件或人物打分:
当前平均分:0.09 (47次打分)
对本篇资讯内容的质量打分:
当前平均分:-0.36 (55次打分)
【已经有51人表态】
9票
感动
5票
路过
5票
高兴
5票
难过
7票
搞笑
8票
愤怒
5票
无聊
7票
同情
上一篇 下一篇

网络资源