📄 j2me游戏开发中的地图设计与绘制-开发者网络-j2me-天极yesky.htm
字号:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<!-- saved from url=(0038)http://dev.yesky.com/224/2394224.shtml -->
<HTML lang=zh-CN xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>J2ME游戏开发中的地图设计与绘制-开发者网络-J2ME-天极Yesky</TITLE>
<META content=J2ME游戏开发中的地图设计与绘制, name=description>
<META content=J2ME游戏开发中的地图设计与绘制, name=keywords>
<META content="天极Yesky | 全球中文IT第一门户" name=author>
<META content="天极Yesky | 全球中文IT第一门户" name=Copyright>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<META http-equiv=Content-Language content=zh-CN><LINK media=all
href="J2ME游戏开发中的地图设计与绘制-开发者网络-J2ME-天极Yesky.files/y_mobile_content.css"
type=text/css rel=stylesheet>
<SCRIPT src="J2ME游戏开发中的地图设计与绘制-开发者网络-J2ME-天极Yesky.files/showlay.js"></SCRIPT>
<META content="MSHTML 6.00.2900.3132" name=GENERATOR></HEAD>
<BODY><!--页面头部--><!--头部-->
<DIV id=topmenu><A href="http://www.yesky.com/">Yesky首页</A>| <A
href="http://product.yesky.com/">产品报价</A>| <A
href="http://cseek.yesky.com/">行情</A>| <A href="http://mobile.yesky.com/">手机</A>
| <A href="http://digital.yesky.com/">数码</A> | <A
href="http://notebook.yesky.com/">笔记本</A> | <A
href="http://pc.yesky.com/">台式机</A> | <A href="http://diy.yesky.com/">DIY硬件</A>
| <A href="http://oa.yesky.com/">外设</A> | <A href="http://net.yesky.com/">网络</A>
| <A href="http://dh.yesky.com/">数字家庭</A> | <A
href="http://lab.yesky.com/">评测</A> | <A href="http://soft.yesky.com/">软件</A> |
<A href="http://e.yesky.com/">e时代</A> | <A href="http://game.yesky.com/">游戏</A>
| <A href="http://pic.yesky.com/">图片</A> | <A
href="http://desktop.yesky.com/">壁纸</A> | <A href="http://q.yesky.com/">群乐</A> |
<A href="http://my.yesky.com/">社区</A> | <A href="http://blog.yesky.com/">博客</A>
| <A href="http://www.mydown.com/">下载</A></DIV>
<DIV id=topbox>
<DIV class=tleft><A href="http://www.yesky.com/"><IMG alt=天极Yesky_全球中文IT第一门户
src="J2ME游戏开发中的地图设计与绘制-开发者网络-J2ME-天极Yesky.files/logo.gif" border=0></A></DIV>
<DIV class=tad><SPAN id=ad1></SPAN></DIV>
<DIV id=search>
<DIV>
<FORM name=searchform action=http://search.chinabyte.com/search method=get
target=_blank><INPUT id=searchzz onmouseover=this.focus() onfocus=this.select()
name=q><INPUT type=hidden value=GB2312 name=encoding><INPUT type=hidden
value=connect name=dir><INPUT type=hidden value=20002 name=cid><INPUT id=search_btn type=submit value=天极搜索> </FORM></DIV>
<DIV class=tdq>
<DIV class=rightarea><A href="http://bj.yesky.com/">北京</A> <A
href="http://hd.yesky.com/">上海</A> <A href="http://gd.yesky.com/">广东</A> <A
href="http://xa.yesky.com/">西安</A><BR><A href="http://cq.yesky.com/">重庆</A> <A
href="http://cd.yesky.com/">成都</A> <A href="http://sy.yesky.com/">沈阳</A> <A
href="http://js.yesky.com/">江苏</A> </DIV>
<DIV class=rightarea_right><A
href="http://my.yesky.com/">用户<BR>登录</A></DIV></DIV></DIV>
<DIV class=tright>
<DIV class=box1>
<SCRIPT src="J2ME游戏开发中的地图设计与绘制-开发者网络-J2ME-天极Yesky.files/content_text_ad.js"
type=text/javascript></SCRIPT>
</DIV></DIV></DIV>
<SCRIPT src="J2ME游戏开发中的地图设计与绘制-开发者网络-J2ME-天极Yesky.files/flash.js"
type=text/javascript></SCRIPT>
<DIV id=childmenu><A href="http://soft.yesky.com/">软件频道></A><A
href="http://dev.yesky.com/">程序开发></A><A
href="http://dev.yesky.com/devjava/">Java</A><A
href="http://dev.yesky.com/ysdevvb">VB</A><A
href="http://dev.yesky.com/ysdevvc">VC</A><A
href="http://dev.yesky.com/ysdevdelphi">Delphi</A><A
href="http://dev.yesky.com/ysdevc">C/C++</A><A
href="http://dev.yesky.com/web/">Web开发</A><A
href="http://dev.yesky.com/msdn/">微软专栏</A><A
href="http://dev.yesky.com/devydkf/">移动</A><A
href="http://dev.yesky.com/devsjk/">数据库</A><A
href="http://dev.yesky.com/ysdevcxrs">程序人生</A><A
href="http://dev.yesky.com/ysdevrjgc">软件工程</A>|<A
href="http://soft.yesky.com/lesson/">产品中心</A><A
href="http://www.mydown.com/soft/develop/news.shtml">下载</A><A
href="http://q.yesky.com/group/179"><FONT
color=#ff0000>群乐:大家耍QQ</FONT></A></DIV><!--导航条-->
<DIV id=location>
<DIV class=loleft>您现在的位置: <A href="http://www.yesky.com/">天极Yesky</A> > <A
href="http://soft.yesky.com/">软件频道</A> > <A
href="http://dev.yesky.com/">开发者网络</A> > J2ME游戏开发中的地图设计与绘制</DIV>
<DIV class=adright><SPAN id=ad2></SPAN></DIV></DIV><!--内容块开始-->
<DIV id=conbox><!--左边开始-->
<DIV id=conleft>
<DIV id=contopla1>
<DIV id=__001>
<DIV class=qkong></DIV>
<DIV class=qw1>全文</DIV>
<DIV class=zkong>
<DIV class=kl></DIV>
<DIV class=bj><A href="http://dev.yesky.com/224/2394224.shtml#pls"
target=_self>评论</A></DIV>
<DIV class=kr></DIV>
<SCRIPT type=text/javascript>
var titiepic ="#";
if (titiepic!="#")
{
document.write("<div class=\"kl\"></div><div class=\"bj\"><a href=\"#\" target=\"_blank\">图片</a></div><div class=\"kr\"></div>");
}
</SCRIPT>
</DIV></DIV></DIV>
<DIV class=topadbg><SPAN id=ad10></SPAN></DIV><A name=top></A>
<DIV id=contitle>
<H1>J2ME游戏开发中的地图设计与绘制</H1></DIV>
<DIV id=conauthor><SPAN>2006-05-11 08:19 </SPAN><SPAN>作者: </SPAN><SPAN>出处:
j2me开发网 </SPAN><SPAN>责任编辑:<A title=向本编辑提问
href="http://comments.yesky.com/t/·½ÖÛ/6,324/2394224.shtml" target=_blank>方舟</A>
</SPAN></DIV>
<DIV class=topadbg><SPAN id=ad9></SPAN></DIV>
<DIV id=conneirong><SPAN id=ad3></SPAN>
<DIV class=guanggao><SPAN
id=contentAdv></SPAN></DIV> 在开发很多类型的游戏中,地图系统都需要良好的设计,直观的说,我们需要的地图系统仅仅是一个2D数组,然后用最快的方式将数组影射到屏幕上。
<BR><BR> 游戏中的地图通常不是由程序员用键盘输入到程序里然后再在程序中修改然后再修改的狂乱过程,而是一般先由程序员做一个地图编辑器,在这个地图编辑器中用鼠标点点点,再保存的过程,或者是从网络上下载的一些成熟编辑器比如:mappy这样的工具生成地图,再用脚本语言为mappy写一个应该保存成什么样格式的程序。通常地图分为45度角,侧视角和俯视角等等,45度角的也有很多种,这种视角相对俯视角和侧视叫较复杂,我们主要讨论俯视角,其实侧视叫和俯视角主要的区别是图片的表现风格不一样,比如雷电这样的空战就是俯视角,mario这样的游戏就是侧视角,可以用相同的地图编辑器做出来。综上,你要知道游戏地图不是程序员用程序写出来的,你喜欢写也可以,修改起来较麻烦,也不能像资源一样动态管理而是一次性读入到内存里,比较不爽。
<BR><BR> 在这个文章里面,我们假设我们的2D数组是通过,资源读取出来的,内容如下:<BR><BR>
<TABLE borderColor=#cccccc width="90%" align=center bgColor=#e3e3e3 border=1>
<TBODY>
<TR>
<TD>public static byte[][] B_MAZE_2D_ARRAY = {<BR>{<BR>0, 0, 0, 0, 0, 0,
0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0}<BR>, {<BR>0, 1, 1,
1, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0}<BR>,
{<BR>0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
0}<BR>, {<BR>0, 1, 1, 1, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
0, 0, 0, 0}<BR>, {<BR>0, 1, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0,
0, 0, 0, 0, 0, 0, 0}<BR>, {<BR>0, 1, 1, 1, 1, 1, 0, 0, 1, 1, 1, 1, 1, 1,
1, 0, 0, 0, 0, 0, 0, 0, 0, 0}<BR>, {<BR>0, 1, 0, 0, 0, 1, 1, 1, 1, 0, 0,
0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0}<BR>, {<BR>0, 1, 1, 1, 1, 1, 0, 0,
0, 0, 0, 0, 0, 0, 1, 0, 1, 1, 1, 1, 1, 1, 1, 0}<BR>, {<BR>0, 0, 0, 0, 0,
0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 1, 0, 0, 0, 0, 0, 0, 0}<BR>, {<BR>0, 0,
0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0}<BR>,
{<BR>0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
0}<BR><BR>};</TD></TR></TBODY></TABLE><BR> 这个地图中一共0,1两种byte数,0代表一种图块,1代表一种图块,也可以是动画图块,你绘制的时候区别一下就可以了。因为我们程序里面想把这整个图形绘制出来的话有N多种方案,我给出两个比较合理的方案,当然第二种是比较优化的.我们假设你的主角一直在屏幕中央,当你主角移动的时候,地图相应的变化,就是说主角为参照物,地图动.我们知道地图的大小要超过屏幕的,我们需要设定一个坐标系统,我的方法是,以左上角为0,0也就是和我们常用的Canvas的坐标系统是相同的,我们的图块大小为:ELEMENT_WIDTH,
ELEMENT_HEIGHT,所以我们整个地图的面积(绝对面积)是 ELEMENT_WIDTH * 横坐标的块数 *
ELEMENT_HEIGHT*纵坐标的块数。因此,我们把这么大的题图画在屏幕上时,需要把需要画的坐标面积(也就是屏幕面积)从这个地图中拿出来,其他地方被切除,这就比较的高效了。<BR><BR> 方法一:循环整个2维数组,不需要的地方不绘制只绘需要的部分:<BR><BR>
<TABLE borderColor=#cccccc width="90%" align=center bgColor=#e3e3e3 border=1>
<TBODY>
<TR>
<TD>int kI = 0;// 表示<BR>int kJ = 0;<BR>//nEleStartedX, nEleStartedY表示从2D
Array哪个位置开始绘制地图<BR>for (int i = nEleStartedY; i <
B_MAZE_2D_ARRAY.length; i++) {<BR> kJ = 0;<BR> //是否需要绘制<BR> boolean
isDrawed = false;<BR> for (int j = nEleStartedX; j <
B_MAZE_2D_ARRAY[i].length; j++)
{<BR> //绘制需要的面积,N_MAZE_ELEMENT_WIDTH,N_MAZE_ELEMENT_HEIGHT表示图块宽高<BR> int
bX = nMapStartedX + j * N_MAZE_ELEMENT_WIDTH;<BR> int bY = nMapStartedY +
i * N_MAZE_ELEMENT_HEIGHT;<BR> //SCREEN_WIDTH,SCREEN_HEIGHT屏幕大小<BR> if
(bX <= SCREEN_WIDTH<BR> &&<BR> bY <=
SCREEN_HEIGHT<BR> &&<BR> bX >=
-N_MAZE_ELEMENT_WIDTH<BR> &&<BR> bY >=
-N_MAZE_ELEMENT_HEIGHT<BR> )
{<BR> g.drawImage(mapImages[B_MAZE_2D_ARRAY[i][j]], bX,bY,Graphics.TOP |
Graphics.LEFT);//绘制图块<BR> isDrawed = true;<BR> kJ++;<BR> //
N_MAX_MAZE_ITEM_X , N_MAX_MAZE_ITEM_Y屏幕面积内图块的最大值<BR> if (kJ >
N_MAX_MAZE_ITEM_X + 2) {<BR> break;<BR> }<BR> }<BR> }<BR> if
(isDrawed) {<BR> kI++;<BR> }<BR> if (kI > N_MAX_MAZE_ITEM_Y + 2)
{<BR> break;<BR> }<BR>}</TD></TR></TBODY></TABLE><BR> 方法二:事先找到需要绘制的横坐标纵坐标的图块编号(2DArray的数组下标),循环屏幕面积大小的数组:<BR><BR>
<TABLE borderColor=#cccccc width="90%" align=center bgColor=#e3e3e3 border=1>
<TBODY>
<TR>
<TD>// 需要绘制的2DArray左上角位置,nMapStartedX,nMapStartedY在地图绝对面积上的坐标<BR>int
nArrayI = ( -N_MAZE_ELEMENT_HEIGHT - nMapStartedY)
/N_MAZE_ELEMENT_HEIGHT;<BR>int nArrayJ = ( -N_MAZE_ELEMENT_WIDTH -
nMapStartedX) /N_MAZE_ELEMENT_WIDTH;<BR>for (int i = nArrayI;i <
SCREEN_HEIGHT / N_MAZE_ELEMENT_HEIGHT + 2; i++) {<BR>for (int j =
nArrayJ;j < SCREEN_WIDTH / N_MAZE_ELEMENT_WIDTH + 2; j++) {<BR> if (i
< 0 || j < 0 || i > B_MAZE_2D_ARRAY.length || j >
B_MAZE_2D_ARRAY[0].length) {<BR> continue;<BR> }<BR> else {<BR> int bX =
nMapStartedX + j * N_MAZE_ELEMENT_WIDTH;<BR> int bY = nMapStartedY + i *
N_MAZE_ELEMENT_HEIGHT;<BR> g.drawImage(mapImages[B_MAZE_2D_ARRAY[i][j]],
bX,bY,Graphics.TOP |
Graphics.LEFT);<BR> }<BR> }<BR>}</TD></TR></TBODY></TABLE><BR> 根据我的测试,方法一的地图面积越大fps掉的越为厉害,而方法二基本上不会掉fps,强烈推荐方法二。<BR><BR> 地图系统做好了之后,你就可以使用地图做更多的表现力了,只要改变nMapStartedX,nMapStartedY,就可以绘制出地图上的相应部分,代码的复用效率非常的高。RPG,
SLG, PUZZLE等游戏类型都可以使用。<BR></DIV><!--广告代码开始-->
<SCRIPT>
var ad_cid;
if (window.location.search.substring(1) != "")
{
ad_cid = window.location.search.substring(1);
} else {
ad_cid = 412;
}
</SCRIPT>
<!--小通栏:c-scolumn顶部500*90--><SPAN id=span_ad1>
<SCRIPT language=JavaScript>
document.write("<script src=\"http://vd.yesky.com/html/"+ad_cid+"/"+ad_cid+"_c-scolumn.js\"><\/script>");</SCRIPT>
</SPAN>
<SCRIPT language=JavaScript>
document.getElementById("ad1").innerHTML=document.getElementById("span_ad1").innerHTML;
document.getElementById("span_ad1").innerHTML="";
</SCRIPT>
<!--c-pip文章正文中间240*200--><SPAN id=span_ad3>
<SCRIPT language=JavaScript>
document.write("<script src=\"http://vd.yesky.com/html/"+ad_cid+"/"+ad_cid+"_c-pip.js\"><\/script>");</SCRIPT>
</SPAN>
<SCRIPT>
if(document.getElementById("contentAdv")) {
document.getElementById("contentAdv").innerHTML=document.getElementById("span_ad3").innerHTML;
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -