当前时区为 UTC + 8 小时



发表新帖 回复这个主题  [ 2 篇帖子 ] 
作者 内容
1 楼 
 文章标题 : SRGP进行类网页游戏开发(Python+lua)(二:渲染位图)
帖子发表于 : 2008-08-10 20:02 

注册: 2008-07-12 18:20
帖子: 3
送出感谢: 0 次
接收感谢: 0 次
!SRGP进行了部分更新,请重新下载;卸载原来的安装的版本,重新执行安装文件,
http://www.srplab.com/data/SRGPServer_Inst.2.50.1.rar

2D游戏最基本的功能就是位图的渲染。与单机游戏和独立客户端的网络游戏相比,在网页游戏中,图片在客户端首先是不存在的,需要在游戏过程中从服务器下载;其次,客户端需要对图片进行管理,以便判断图片是否已经下载,是否发生变化需要重新下载,并且需要在运行过程中感知服务器端图片的变化,以便实时反应服务器端图片的更新;再者,需要在客户端建立缓冲,避免重复下载。这些功能由SRGP提供的分布式文件管理实现。
位图在SRGP中封装成为一个对象,包含的基本属性有位置,宽度和高度,位图文件,显示顺序,Alpha等。渲染只需要把位图对象注册给设备对象,设备对象就会根据位图的属性进行显示。SRGP中支持的图像文件格式有:JPG,BMP,PNG,TGA,GIF,ANI。其中GIF和ANI为动画,由SRGP自动播放,ANI为SRGP自定义格式。

一:服务器端装载位图文件

使用分布式文件管理系统,其功能由DriveClass提供,在SRPFSEngine服务中定义。首先,创建一个虚拟盘:
VDisk = Service.DriveClass._NewGlobal (SrvItem)
VDisk._Name = "VDisk"
其次,装载需要同步到客户端的位图文件。
VDisk.Lua_LoadFile( "Back640.jpg","Back640.jpg")
第一个参数为在虚拟盘中的文件名,第二个参数为磁盘文件
VDisk.Lua_LoadFile( "8.gif","8.gif")
VDisk.Lua_LoadFile( "9.gif","9.gif")
VDisk.Lua_LoadFile( "horse.gif","horse.gif")
VDisk.Lua_LoadFile( "House.bmp","House.bmp")
VDisk.Lua_LoadFile( "Player.ani","Player.ani")

二:创建显示位图对象

创建位图对象可以有两种选择:客户端创建本地位图对象;或者服务器端创建全局位图对象。如果采用第二种,则服务器端可以改变位图的显示属性,诸如位置,Alpha;并且修改会立即反应到所有在线的客户端上。
对于第一种方式,在服务器端创建客户端脚本,使用Lua语言;对于第二种方式,直接使用Python语言
位图显示使用Frame2DFaceClass类,在SRPRenderEngine服务中定义;该类包含有:BkTextureFile(显示的位图文件)、Pos(位置)、Width(宽度)、Height(高度)、FillColorFlag(是否填充颜色)、DiffuseEnable(是否允许混合颜色)、DiffuseColor(混合颜色)、EnableAlpha(是否允许Alpha)和Alpha等属性。

1. 客户端创建本地位图对象
在InitObj的_OnActivate的事件中,设备对象激活之后,增加如下代码:
InitObj._CreateFunc("_OnActivate",r"""
function _OnActivate( self, Event )

Device:_Active()

--背景图片
Pic1 = self. _Service.Frame2DFaceClass:_New()
Pic1.BkTextureFile = "VDisk:\\Back640.jpg"
Pic1.Pos = {0,0}
Pic1.Width = 640
Pic1.Height = 480
Pic1:_Active()
Device:Lua_RegScene( 0, Pic1 )

Pic2 = self. _Service.Frame2DFaceClass:_New(Pic1)
Pic2.BkTextureFile = "VDisk:\\8.gif"
Pic2.FillColorFlag = false
Pic2.Pos = {100,50}
Pic2.Width = 20
Pic2.Height = 22
Pic2.EnableAlpha = true
Pic2:_Active()
Pic2.Direction = 0

Pic3 = self. _Service.Frame2DFaceClass:_New(Pic1)
Pic3.BkTextureFile = "VDisk:\\9.gif"
Pic3.FillColorFlag = false
Pic3.Pos = {122,50}
Pic3:_Active()
Pic3.Width = 20
Pic3.Height = 22
Pic3.EnableAlpha = true
Pic3.Direction = 0

Pic4 = self. _Service.Frame2DFaceClass:_New(Pic1)
Pic4.BkTextureFile = "VDisk:\\Horse.gif"
Pic4.FillColorFlag = false
Pic4.Pos = {200,50}
Pic4:_Active()
Pic4.Width = 122
Pic4.Height = 119
Pic4.EnableAlpha = true

Pic5 = self. _Service.Frame2DFaceClass:_New(Pic1)
Pic5.BkTextureFile = "VDisk:\\Player.ani"
Pic5.FillColorFlag = false
Pic5.Pos = {100,200}
Pic5:_Active()
Pic5.Width = 32
Pic5.Height = 48
Pic5.EnableAlpha = true

Pic6 = self. _Service.Frame2DFaceClass:_New(Pic1)
Pic6.BkTextureFile = "VDisk:\\House.bmp"
Pic6.FillColorFlag = false
Pic6.Pos = {400,200}
Pic6:_Active()
Pic6.Width = 192
Pic6.Height = 128
Pic6.EnableAlpha = true
Pic6.DiffuseEnable = true
Pic6.DiffuseColor = 0
end
""")

2. 服务器端创建全局位图对象

在代码InitObj._ActiveCmd(srpspy.ACTIVE_FOLLOW) 后面,创建全局位图对象;创建全局位图对象使用_NewGlobal

#--背景图片
Pic1 = Service.Frame2DFaceClass._NewGlobal(SrvItem)
Pic1._Name = "Pic1"
Pic1.BkTextureFile = "VDisk:\\Back640.jpg"
Pic1.Pos = (0,0)
Pic1.Width = 640
Pic1.Height = 480
Pic1._ActiveCmd(srpspy.ACTIVE_FOLLOW)

Pic2 = Service.Frame2DFaceClass._NewGlobal(Pic1)
Pic2._Name = "Pic2"
Pic2.BkTextureFile = "VDisk:\\8.gif"
Pic2.FillColorFlag = false
Pic2.Pos = (100,50)
Pic2.Width = 20
Pic2.Height = 22
Pic2.EnableAlpha = True
Pic2._ActiveCmd(srpspy.ACTIVE_FOLLOW)
Pic2.Direction = 0

Pic3 = Service.Frame2DFaceClass._NewGlobal(Pic1)
Pic3._Name = "Pic3"
Pic3.BkTextureFile = "VDisk:\\9.gif"
Pic3.FillColorFlag = false
Pic3.Pos = (122,50)
Pic3._ActiveCmd(srpspy.ACTIVE_FOLLOW)
Pic3.Width = 20
Pic3.Height = 22
Pic3.EnableAlpha = True
Pic3.Direction = 0

Pic4 = Service.Frame2DFaceClass._NewGlobal(Pic1)
Pic4._Name = "Pic4"
Pic4.BkTextureFile = "VDisk:\\Horse.gif"
Pic4.FillColorFlag = false
Pic4.Pos = (200,50)
Pic4._ActiveCmd(srpspy.ACTIVE_FOLLOW)
Pic4.Width = 122
Pic4.Height = 119
Pic4.EnableAlpha = True

Pic5 = Service.Frame2DFaceClass._NewGlobal(Pic1)
Pic5._Name = "Pic5"
Pic5.BkTextureFile = "VDisk:\\Player.ani"
Pic5.FillColorFlag = false
Pic5.Pos = (100,200)
Pic5._ActiveCmd(srpspy.ACTIVE_FOLLOW)
Pic5.Width = 32
Pic5.Height = 48
Pic5.EnableAlpha = True

Pic6 = Service.Frame2DFaceClass._NewGlobal(Pic1)
Pic6._Name = "Pic6"
Pic6.BkTextureFile = "VDisk:\\House.bmp"
Pic6.FillColorFlag = false
Pic6.Pos = (400,200)
Pic6._ActiveCmd(srpspy.ACTIVE_FOLLOW)
Pic6.Width = 192
Pic6.Height = 128
Pic6.EnableAlpha = True
Pic6.DiffuseEnable = True
Pic6.DiffuseColor = 0

三:操作位图对象

通过改变位图对象的属性,实现对位图对象的控制,包括有:移动(通过改变位置),改变Alpha,改变混合颜色等。
对于客户端创建本地位图对象的方式,所有改变都在本地发生;此时如果有多个客户端连接到服务器端,则各个客户端的显示不同步;如果采用全局创建位图的方式,服务器端控制位图对象的属性变化,则各个客户端之间的显示是同步的。

1. 客户端操作位图对象

为了对位图对象进行操作,在客户端创建一个定时器,周期为100ms;定时器函数中,改变各个位图对象的属性。
该方式在服务器端创建客户端脚本,使用Lua语言
InitObj._CreateFunc("_OnActivate",r"""
function _OnActivate( self, Event )

function Pic1:_OnTimer()
--改变Diffuse Color
Pic6.DiffuseColor = Pic6.DiffuseColor + 10
if Pic6.DiffuseColor > 255 then
Pic6.DiffuseColor = 0
end

--改变Alpha
if Pic4.Alpha >= 255 then
Pic4.Alpha = 0
else
Pic4.Alpha = Pic4.Alpha + 10
end

--改变位置
if Pic2.Direction == 0 then
Pic2.Pos.X = Pic2.Pos.X + 5
if Pic2.Pos.X > 640 then
Pic2.Direction = 1
end
else
Pic2.Pos.X = Pic2.Pos.X - 5
if Pic2.Pos.X < 0 then
Pic2.Direction = 0
end
end

--改变位置
if Pic3.Direction == 0 then
Pic3.Pos.Y = Pic3.Pos.Y + 5
if Pic3.Pos.Y > 480 then
Pic3.Direction = 1
end
else
Pic3.Pos.Y = Pic3.Pos.Y - 5
if Pic3.Pos.Y < 0 then
Pic3.Direction = 0
end
end
end
Pic1:_SetTimer(10,Pic1._OnTimer,0,0,0)

2. 服务器端操作位图对象
为了对位图对象进行操作,在服务器创建一个定时器,周期为100ms;定时器函数中,改变各个位图对象的属性。
该方式在服务器端直接处理,使用Python语言
def Pic1_OnTimer(self,TimerID,Arg1,Arg2) :
#--改变Diffuse Color
Pic6.DiffuseColor = Pic6.DiffuseColor + 10
if Pic6.DiffuseColor > 255 :
Pic6.DiffuseColor = 0

#--改变Alpha
if Pic4.Alpha >= 255 :
Pic4.Alpha = 0
else :
Pic4.Alpha = Pic4.Alpha + 10

#--改变位置
if Pic2.Direction == 0 :
Pic2.Pos.X = Pic2.Pos.X + 5
if Pic2.Pos.X > 640 :
Pic2.Direction = 1
else :
Pic2.Pos.X = Pic2.Pos.X - 5
if Pic2.Pos.X < 0 :
Pic2.Direction = 0

#--改变位置
if Pic3.Direction == 0 :
Pic3.Pos.Y = Pic3.Pos.Y + 5
if Pic3.Pos.Y > 480 :
Pic3.Direction = 1
else :
Pic3.Pos.Y = Pic3.Pos.Y - 5
if Pic3.Pos.Y < 0 :
Pic3.Direction = 0
Pic1._SetTimer(10,Pic1_OnTimer,0,0

四:示例下载

1. 客户端测试网页下载:http://www.srplab.com/demo/clienttest.rar
2. 服务器端Python代码下载:http://www.srplab.com/demo/RenderImg.rar
运行方法:展开,
首先python RenderImg.py 其次打开浏览器,装入测试页面;或者
首先python RenderImg_Global.py 其次打开浏览器,装入测试页面
[/img]


附件:
RenderImg.jpg
RenderImg.jpg [ 87.19 KiB | 被浏览 792 次 ]

页首
 用户资料  
 
2 楼 
 文章标题 :
帖子发表于 : 2008-08-10 20:04 
头像

注册: 2007-04-25 13:12
帖子: 2838
送出感谢: 0 次
接收感谢: 0 次
:shock:


_________________
♜♞♝♛♚♝♞♜
♟♟♟♟♟♟♟♟
♙♙♙♙♙♙♙♙
♖♘♗♕♔♗♘♖

☠☯⚔⚓☣☦☃☕
☹☻☪☭☬⚖⚛⚜
ℜℳℬ™ ℋℯℓ℘ ℳℭ
sƂɐʍ рǀɹoʍ əɥʇ oS


页首
 用户资料  
 
显示帖子 :  排序  
发表新帖 回复这个主题  [ 2 篇帖子 ] 

当前时区为 UTC + 8 小时


在线用户

正在浏览此版面的用户:没有注册用户 和 1 位游客


不能 在这个版面发表主题
不能 在这个版面回复主题
不能 在这个版面编辑帖子
不能 在这个版面删除帖子
不能 在这个版面提交附件

前往 :  
本站点为公益性站点,用于推广开源自由软件,由 DiaHosting VPSBudgetVM VPS 提供服务。
我们认为:软件应可免费取得,软件工具在各种语言环境下皆可使用,且不会有任何功能上的差异;
人们应有定制和修改软件的自由,且方式不受限制,只要他们自认为合适。

Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
简体中文语系由 王笑宇 翻译