使用Html5+C#+微信 开发移动端游戏详细教程: （四）游戏中层的概念与设计

 

众所周知，网站的前端页面结构一般是由div组成，父div包涵子div，子div包涵各种标签和项，

同理，游戏中我们也将若干游戏模块拆分成层，在后续的代码维护和游戏程序逻辑中将更加清晰和便于控制。

 

Web页面的层结构：

 

游戏中的层结构：

 

如下图，用谷歌debug一下可以看到游戏初始化后，自动生成了一个Canvas画布，

那么我们本篇讨论的重点就是在Canvas中如何设计分层。

 

 

 

依照“怪兽必须死”这个游戏，主要的玩法就是升级英雄、技能、镶嵌宝石等一系列提升属性的功能来攻击屏幕中心的若干怪兽，

同时还有全屏技能，点击攻击等玩法，我们由浅入深，先从最基本的功能模块划分开始，设想一下，刚进入游戏时我们最先看到的是什么，

应该先加载什么，很显然，首先是游戏背景，其次是英雄层，怪物层，菜单层，头部游戏信息层，对照游戏实际画面，大的分层应如下图：

 

 

如上图所示，这是显式分层，是肉眼能看见的大体布局，但在实际开发过程中，这样的分层并不能满足我们的要求，

就会有隐式的层结构，更加便于开发，例如怪物层，同层级关系下其实还有怪物被攻击时显示的数字层，爆出金币的效果层等等，

这在后续的教程中我们将深入浅出，跟随项目进度和源代码，实现一个完整的游戏层结构。

 

本篇结束 主要是一些基本概念 下一篇我们将讲解   游戏中图像的加载与操作