学习情境2之手机游戏系统界面设计与开发教案.doc

移动应用程序开发实践学习情景2 手机游戏系统的界面设计与开发学习情境2之“手机游戏系统界面设计与开发”教案学习领域：移动应用程序开发学习情境：手机游戏“迷失森林”学习任务1：手机游戏系统的界面设计与开发学习单元一 游戏系统设计 学习单元：游戏系统设计授课班级：教学时间教学地点：应具备的职业能力：了解手机游戏设计的组成部分l 游戏界面设计l 游戏逻辑设计l 记录管理系统手机游戏系统分析l 项目功能需求分析l 技术支持和产品定位l 项目概要设计l 游戏策划l 手机游戏的剧本编写教学目标：了解、熟悉和掌握：1、了解项目的需求分析2、了解项目的概要设计3、了解手机游戏设计的特点4、了解项目的两大组成部分5、了解项目的剧本编写l教学重点难点：1、项目的两大组成部分2、项目的剧本编写教学方法： “讨论式”、“问题牵引”，“项目驱动”等教学方法。教学过程设计：第一部分：复习上次课程的内容（15分钟左右）公交车查询算法和整体结构第二部分：本次课程内容（75分钟）1、使用问题牵引的方式来引入本次课程内容。如何进行手机游戏设计？2、项目需求1、“公欲善其事，必先利其器”，做项目之前第一步是前期需求分析。首先就是要搞清楚我们要做什么，为什么这样做，做成什么样，那些不做。手机已经与现代生活方式紧紧地结合在一起。属于最普遍携带的个人用品中仅次于钥匙和钱包的东西。手机用户都可以随时、随地进行游戏。尽管每个手机游戏都不贵，但是巨大的使用量将使得这个市场商机无限。一个成功的手机游戏大多具有以下特征：l 易于学习：既然手机游戏面向的是普通消费者而不是计算机专家，那么他们不可能深入的学习游戏技巧。保持游戏的简单是最基本的要求。 l 可中断性：多任务处理是手机生活方式的基本特征。而通话、游戏、日历管理、通讯和工作数据访问使用的是同一个设备。所以一个好的手机游戏应该提供短时间的娱乐功能，并且允许用户在游戏和工作模式之间顺利切换。 l 丰富的社会交互：不管一个游戏设计得多好，只要玩家找到了它的根本模式或者玩完了所有的游戏路径很快就会厌烦这个游戏。对于一个基于订阅的游戏，重要的是与别的玩家合作以增强所玩游戏的智力和随机性。在今天纷繁复杂的多玩家游戏中具有丰富社会交互的游戏证明是成功的。 l 利用手机技术的优点：巨额的手机技术研发费用都花在提高设备和网络的可用性和可靠性上面。因此，手机设备硬件和网络协议与桌面/控制台世界（如全球定位系统(GPS)扩展、条形码扫描仪、和短消息服务(SMS)/多媒体信息服务(MMS)通讯）有着非常大的差别。好的手机游戏应该利用那些更新的设备特征和网络基础设备的优点。 l 无违法内容：既然所有年龄/性别的人群都玩手机游戏并且常常在公共/工作场合，就应该避免明显的暴力或者色情内容。大致了解了目前手机游戏的情况后，我们准备做一个在手机上运行的休闲类游戏，虽然不满足上述的全部条件，但此项目还是有一定的可行性的：l 范围性：目前手机日益普及化，大部分城市几乎是人手一部，手机游戏有着良好的用户群体，发布、传播方便，这个先天优势是其它平台游戏所不能比拟的。l 随意性：目前能进行游戏的平台种类繁多，大至街机、电脑、电视游戏机，小至掌上便携游戏机、PDA等。但它们都有一个共同的地方，就是都需要特定设备的支持，虽然掌上游戏机能随时随地地进行游戏，但也需要用户携带额外的设备外出，存在一定的局限性，如何才能最大限度地提高用户游戏的自由度呢？在满足了用户通话需求的情况下，手机游戏作为手机上的一种娱乐性增值服务，能让用户真正地随时随地进行游戏而不需要额外携带特定的游戏设备。l 娱乐性：手机上的游戏以休闲类的为主，大部分在手机上进行游戏的用户并不是核心玩家，对游戏的要求不如核心玩家高，游戏只是他们放松或等待中打发时间的一种手段，这样便要求手机游戏的进程时间短，能随时开始，也能随时结束，毕竟手机的主要作用还是通话，需要长时间大精力进行的游戏不适合，而休闲类游戏刚好满足此类用户的需求。目前手机的机能日益强大，能处理更为丰富的图形和效果，手机游戏的规模一般不大，必须通过可玩性、可重复性和图形特效来满足用户的游戏需求，游戏进程在精不在长，简单的操作配合细致的像素图形，同样能为用户提供丰富的娱乐性。3、总体设计n 游戏策划在设计一个游戏之前，一定要先作个调研，看看这类游戏的适用对象、投资规模和市场等因素。对于一般的手机游戏在开发之前要搞清楚以下问题：l 剧本编写l 规则设计l 关卡设计n 逻辑功能外部图形导入：设定场景范围，即屏幕边界，所有元素事件都必须在该范围内进行，范围的大小设置为1616像素的倍数。场景、元素绘制：导入人物图形，因为游戏的主角属于四方向行走，所以至少需要导入4帧的人物行走图像，如果需要使人物行走更为流畅真实，所需帧则更多。图像每帧大小为1616像素，也就是场景范围中的一个单位。地图不可能通过直接导入图片或绘图来解决。因为这样的话必须使用大型的图片，使得程序运行效率降低，体积变大，而且难于控制和处理过多的元素，也会因过多的大型图片而不能限制程序的大小，失去手机上程序的原则和Java的优势。地图通过数组贴图的方法实现，即仅仅导入一个需要的地形图片，图片的大小为N16像素，每1616的位置为一种地形，然后通过编写地形数组和场景排列实现地图的贴图绘制。这样不仅使得程序体积大大减少，也为地图的修改提供了极大的便利。层次显示：使用layerManager来管理层次显示。人物移动：人物的行走控制通过键盘响应事件实现，人物位置随时根据使用者的按键输入产生变化，每次移动的距离为16像素，移动后立即进行事件判断。人物移动的时候需要考虑到是否碰撞到其它元素，例如接触障碍物的时候人物必须停止移动，碰到水晶的时候人物生命值变化而且水晶图片消失，这就要求每前进一步都需要对人物所处位置进行扫描与刷新，进行对应的事件相应。元素碰撞处理：元素的显示与消除：元素的显示与消除，根据设置的的游戏逻辑决定某个元素当前的状态，每次显示与消除都必须刷新一次画面以保证全局的一致性。胜利、失败判断：看生命值和人物的位置。时间计算系统：用户运行完成游戏时需要有时间记录的功能。如何采用合理的时间系统，需要进行适当的设计。这个系统可以提供用户竞技的可能，在游戏不变的情况下多个使用者或许会为了更好的成绩而反复游戏。数据更新：本文使用RMS数据库记录存储来表示生命值的增加和减少。4、总结概要设计总体规划5、课后作业题和思考题思考题：如何分析设计一个手机游戏项目？第三部分：课堂专题讨论（10分钟）1、手机游戏的特点？在教学过程中出现的问题及解决办法学习单元二 游戏界面设计学习单元：游戏界面设计授课班级：教学时间教学地点：应具备的职业能力：手机游戏系统的设计与开发l 分析手机游戏系统用户界面的组成元素l 设计用户界面、功能按钮布局l 设计功能按钮的事件处理方法教学目标：了解、熟悉和掌握：1、了解Canvas类2、了解Graphics类3、掌握游戏界面设计的特点教学重点难点：掌握游戏界面设计的特点教学方法： “讨论式”、“问题牵引”，“项目驱动”等教学方法。教学过程设计：第一部分：复习上次课程的内容（15分钟左右）如何设计手机游戏，以及手机游戏的特点。第二部分：本次课程内容（75分钟）1、使用问题牵引的方式来引入本次课程内容。如何进行手机游戏界面设计？2、Canvas类2、高级用户界面API是面向任务的，程序员无法控制这些组件在屏幕上的显示。而低级用户界面API的控制权是赋予程序员的，程序员可以使用低级用户界面API在屏幕上画出自己想要的图形来。这种低级用户界面API特别适合于游戏的开发，因此，关于游戏的开发主要是针对低级用户界面API的开发。当然，在游戏开发过程中，也可以使用高级用户界面API，这不过这两种用户界面不可以同时存在。为了直接在屏幕上绘制线条、文本和形状，必须使用Canvas类。该类提供了一个供MIDlet 在上面绘制的空白屏幕。假设现在要在屏幕上绘制字符串“Hello-World”，一种简单的方法是从Canvas类派生子类，Canvas类是一个抽象类，扩展了Displayable，并重载了paint()方法。为了能有程序开发人员控制接口的外观和行为，需要使用大量的初级用户接口类，尤其在游戏程序中，几乎完全依赖的就是Canvas抽象类进行绘图。从程序开发的观点看，Canvas类可与高级Screen类交互，程序可在需要时在Canvas中掺入高级类的组件。Canvas提供了键盘事件、指点杆事件（如果设备支持），并定义了允许将键盘按键映射为游戏控制键的函数。键盘事件由键代码指定，但这样控制游戏会导致缺乏通用性，并不是每个设备的键盘布局都适合游戏的操作。应当将键代码转换为游戏键的代码，以便硬件开发商能定义他们自己的游戏键布局。本程序中，操纵用户人物运行的按键都定义为游戏控制键，这样便能适应所有的机器。3、Graphics类Graphics类提供了简单的2D绘图功能。它具有24位深度色彩的绘制能力，以三原色分别各占一个字节表示其颜色。程序只能在paint()函数中使用Graphics绘制，GameCanvas可调用getGraphics()函数直接绘制在缓冲区上，可以在任何时间请求传输到前台。其对象会被传给Canvas的paint()函数，以便最终显示。在没有MIDP2.0前，进行游戏绘图一般需要手动编程使用双缓冲。需要在paint()方法内所想要画的图形画在一张预先准备好的背景，等所有绘图操作都完成后再将背景的数据拷贝到实际的屏幕上。Image类提供了一个建立背景的静态方法createImage(int width, int height)，再利用getGraphics()方法取得属于这个背景的Graphics对象，所进行的绘图操作都会作用在背景上，等到全部的绘图操作完成后，再调用drawImage()方法将背景的数据复制到实际显示的屏幕上。这样的技术在绘制动画时特别有用。绘制动画时经常需要不断地更新画面，而更新画面的操作就是先将屏幕以fillRect()的方式清除，再将下一张图片画在屏幕上，然而反复的清除及重绘会造成屏幕的闪烁现象（flicker），因此使用双重缓冲的好处就是在背景进行这个清除及重绘的操作，再将完成的绘图拷贝到屏幕上，由于用户看不到清除的操作，因此就不会出现闪烁的现象了。不过在某些MIDP的实现上已经加上了双重缓冲的支持，因此在处理前应先利用Canvas类的isDoubleBuffer()方法来判断。PNG(Portable Network Graphics)格式是MIDlet唯一支持的图象格式，PNG具体格式由PNG Specification,Version 1.0定义的。PNG格式提供透明背景的图象，这对绘制游戏画面和被操纵主角极有帮助。元素之间或与障碍物碰撞时就不会因为背景有特定的颜色，显示出的效果像贴上的图片而缺乏真实感，物体之间轻微重叠时最上层图片也不会覆盖超过其有效象素外的部分。PNG格式图片中包含许多定义其图片特性的冗余部分(Chunks)。这些代码包含在每一个单独的png格式图象中，然而如果将多个png图象合并在一张幅面稍大一些的整图中，多个chunks就可以得到精简，图片的大小可以得到控制。使用Image类中的createImage函数可从整图中分割出所需要的元素。在Game包中的TiledLayer和Sprite类都整合了这样的功能。本程序中的地图元素都集成在一张tile.png图片中，实现了方便的管理和程序体积的精简。4、建立应用程序游戏也是一种MIDlet应用程序，因此它也有MIDlet生命周期，既startApp()、pauseApp()和destroyApp(boolean)三种方法。为了直接在屏幕图形，必须使用Canvas类，该类提供了一个供MIDlet 在上面绘制的空白屏幕。但是该类是一个抽象类，扩展了Displayable，为了能够在屏幕上画图像，必须创建一个类，该类继承Canvas类，并且重载(Override)paint(Graphics g)方法。paint(Graphics g)方法的实现使用了javax.microedition.lcdui.Graphics 类的绘制功能，所有的图像绘制工作都要在paint(Graphics g)方法中实现，所要绘制的图像的形状、颜色、大小等特性都在Graphics类实现中。5、总结1、Canvas类2、Graphics类3、游戏界面设计的特点5、课后作业题和思考题思考题：如何分析设计一个手机游戏界面？第三部分：课堂专题讨论（10分钟）1、手机游戏界面的特点？在教学过程中出现的问题及解决办法学习单元三 添加游戏菜单学习单元：添加游戏菜单授课班级：教学时间教学地点：应具备的职业能力：游戏界面菜单的设计与开发教学目标：了解、熟悉和掌握：1、游戏界面坐标2、动态界面设计教学重点难点：1、游戏界面坐标2、动态界面设计教学方法： “讨论式”、“问题牵引”，“项目驱动”等教学方法。教学过程设计：第一部分：复习上次课程的内容（15分钟左右）1、如何设计手机游戏界面？2、Canvas类3、Graphics类 第二部分：本次课程内容（75分钟）1、使用问题牵引的方式来引入本次课程内容。如何进行手机游戏界面设计？2、需求3、在需求分析中可知，菜单选项分：“开始游戏”、“游戏方法”、“制作小组”和“退出”等四个部分组成。如何在屏幕上画出菜单，需要程序员事先计算好放置在屏幕上的位置，在本游戏中，菜单的位置在屏幕的中间，放在“Lost in the Forest Ver1.0”和“Copyright 2005 SZPT”字符串之间。因此，菜单的起始位置应该是屏幕的宽度减去上下字符串的宽度然后除以2。同时，在设置菜单位置时还要考虑到字符本身的长度和宽度，以及菜单选项之间的宽度。3、动态菜单代码class MenuScreen extends Canvas /获得lowFont字体的长度final Font lowFont = Font.getFont (Font.FACE_MONOSPACE,Font.STYLE_PLAIN, Font.SIZE_MEDIUM); /获得highFont字体的长度final Font highFont = Font.getFont (Font.FACE_MONOSPACE,Font.STYLE_BOLD, Font.SIZE_LARGE); /设置字体的颜色final int lowColor = 0x000000AA;final int highColor = 0x00FF0000;final int highBGColor = 0x00AAAAAA; /屏幕的宽度int width; /屏幕的高度int height; /菜单起始位置的高度 int startHeight; /整个菜单的高度int menuHeight; /菜单选项之间的高度final int spacing = highFont.getHeight()/2; /菜单内容final String mainMenu = 开始游戏,游戏方法,制作小组,退出; /数组下标int menuIdx; public MenuScreen() width = getWidth();height = getHeight();menuHeight = (highFont.getHeight() * mainMenu.length) + (mainMenu.length-1) * spacing);startHeight = (height - menuHeight)/2 ;menuIdx = 0; public void paint( Graphics g ) for (int i=0; imainMenu.length; i+) if (i=menuIdx) g.setColor(highBGColor);g.fillRect(0,startHeight + (i*highFont.getHeight() + spacing,width,highFont.getHeight();g.setFont(highFont);g.setColor(highColor);g.drawString(mainMenui,(width highFont.stringWidth(mainMenui) / 2,startHeight + (i*highFont.getHeight() + spacing,20); else g.setFont(lowFont);g.setColor(lowColor);g.drawString(mainMenui,(width lowFont.stringWidth(mainMenui) ) / 2,startHeight + (i*highFont.getHeight() + spacing,20); 4、总结1、坐标计算2、动态字体设计5、课后作业题和思考题思考题：不同的手机型号是否影响游戏的界面？第三部分：课堂专题讨论（10分钟）1、手机游戏界面的特点？在教学过程中出现的问题及解决办法学习单元四 事件处理学习单元：事件处理授课班级：教学时间教学地点：应具备的职业能力：能够综合运用低级事件处理和高级事件处理方法完成游戏界面菜单的事件处理教学目标：了解、熟悉和掌握：1、低级事件处理2、高级事件处理教学重点难点：1、低级事件处理教学方法： “讨论式”、“问题牵引”，“项目驱动”等教学方法。教学过程设计：第一部分：复习上次课程的内容（15分钟左右）1、如何计算坐标？2、如阿设计动态字体第二部分：本次课程内容（75分钟）1、使用问题牵引的方式来引入本次课程内容。如何进行手机游戏事件处理设计？2、低级事件处理4、定义菜单以后，菜单不能上下移动，由于菜单的上下移动要设计到低级事件处理，因此必须给程序加上事件处理程序。在MIDP中，所有的低级事件处理都是基于Canvas对象的。低级事件处理的按键要根据ITU-T标准，根据ITU-T标准，0-9数字键、*和#键是所有手机都支持的。如果要想使开发出来的游戏具有较高的可移植性，建议开发者尽量使用ITU-T标准的按键。在MIDP中，规定了3个方法用于低级事件处理：protectedvoid keyPressed(intkeyCode);protectedvoid keyReleased(intkeyCode);protectedvoid keyRepeated(intkeyCode);keyPressed表示按键被按下，keyReleased表示按键被释放，keyRepeated表示按键被重复按，当一个键被按下足够长的时间时，被认为是重复按键。在MIDP API中定义了一些抽象按键表示按键的上、下、左、右和选择，它们分别为：UP、DOWN、LEFT、RIGHT和FIRE。但是有些设备上没有这样的抽象键，设备就把数字键2、4、6、8和5分别表示这些抽象键。如何获取按键的事件呢？Canvas类提供了两个方法：int getGameAction(intkeyCode);int getKeyCode(intgameAction);第一个方法的功能是从按键事件映射到抽象键事件；第二个方法的功能是从抽象键事件映射到按键事件。这两个方法都可以判断按键事件，具体来说就是当按下向下键时，使用getGameAction(intkeyCode)方法就可以知道是抽象键DOWN；当选择了抽象键DOWN时，通过getKeyCode(intgameAction)就可以知道按下的向下键。处理完低级事件处理以后，菜单将会进行上下的选择，表面上用户看不出来，但是实际上菜单可以通过上下进行选择了。3、高级事件处理由于本界面还有Alert对象用于显示制作小组和游戏方法等信息，所以还要加入高级事件处理方法，具体处理原理和过程本章将不会讲解，读者可以参考第四章的高级事件处理方法。4、总结1、低级事件处理2、高级事件处理5、课后作业题和思考题思考题：事件处理中如何使用