用js做一个小游戏平台 (一)
38 浏览量
2020-12-09
09:36:56
上传
评论
收藏 62KB PDF 举报
用用js做一个小游戏平台做一个小游戏平台 (一一)
记得上班写代码时，我们技术总监总说是要先“设计”，那就先“设计”吧。
ps：我是新手大家多多见谅。
.网页游戏区域。就是说需要知道游戏在网页上的区域，如下：
在网页中插入一个div，设定宽高和id，
<div id=”GameFrame” style=”width:400;height:400″></div>
然后再js中得到该对象，
var _GameFrame = document.getElementById(“GameFrame”);
.键盘参数对象：在游戏中会经常获取键盘的值，设定一个键值对应的对象：
var _KeyParameters = { KeyEnter: 13, KeySpace: 32, KeyLeft: 37, KeyUp: 38, KeyRight: 39, KeyDown: 40, KeyESC: 27 };
.标签控制对象：用于控制、产生html标签，辅助生成对应样式的”控件”：
代码如下:
var _HtmlControl =
{
//清空网页游戏区域
_ClearArea: function() {
},
//创建一个div
newDiv: function() {
var div = document.createElement(“div”);
return div;
},
//创建一个指定宽高的按钮样式标签
newButton: function(w, h) {
var div = this.newDiv();
div.style.width = w + “px”;
div.style.height = h + “px”;
div.select = function() {
//被选中时的变化
};
div.unselect = function() {
//没选中时的样子
};
return div;
}
//继续…
};
.动画类：用于播放一些游戏跳转动画：
代码如下:
var Animation = function(endFn) {
//播放动画
this._play = function() {
//具体怎么放没有想好。
};
//播放结束事件
this._palyEnd = endFn || function() {
alert(“动画播放结束”);
};
};
.游戏类：要有一个游戏名，
a.控制：1.逻辑控制、2.键盘控制
b.主界面：1.标题、2.游戏区域、3.状态显示区、4.控制区
c.动画：1.开场动画、2.过关动画、3.通关动画
d:事件：1.开始、2.结束。
代码大致如下：
代码
代码如下:
var Game = function(name, logicalFn, keyFn) {
//游戏名
this._name = name || “未命名”;
this._LControl = logicalFn || function() {
//简单游戏逻辑控制
评论0