阅读更多

6顶
0踩

Web前端

原创新闻 HTML5 版的涂鸦跳跃

2012-08-27 15:44 by 副主编 wangguo 评论(2) 有8805人浏览
涂鸦跳跃(Doodle Jump)目前是iOS和Android平台上最流行的游戏之一。本文介绍的是该款游戏的HTML5移植版本


该版本基于HTML5 API和Canvas特性构建。目前为止,HTML5版涂鸦跳跃实现了原始游戏中的大部分功能,但还有一些功能未实现,如怪兽、道具等。在游戏中,你可以使用左、右方向键进行控制。

作者称,在即将发布的第2个版本,将带来更多的功能,比如原始游戏中的声音,以便使这个游戏更加有趣。

项目地址:http://cssdeck.com/labs/html5-doodle-jump/8

你可以点击项目页面左侧的代码编辑器(Code Editors)按钮来查看游戏的代码,同时你也可以修改代码,修改的结果可以即时在右侧的游戏中体现出来。

  • 大小: 58 KB
6
0
评论 共 2 条 请登录后发表评论
2 楼 thereisyougo 2012-08-27 21:59
这个站不错...
1 楼 p2world 2012-08-27 21:37
方便的接触到html5 游戏开发~ 赞

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

  • 一个基于OpenGL的游戏代码

    作者对游戏的说明: 首先,您应当以一种批判的眼光来看待本程序。这个游戏是我制作 的第一部RPG游戏,无任何经验可谈,完全按照自己对游戏的理解进 行设计的。当我参照了《圣剑英雄2》的源码之后,才体会到专业游 戏引擎的博大精深。 该程序的内核大约有2000余行,能够处理人物的行走、对话、战斗, 等等。由于该程序的结构并不适于这种规模的程序,故不推荐您详 细研究该程序。所附地图编辑器的源程序我已经添加了详细的注释, 其程序结构也比较合理,可以作为初学VC的例子。 该程序在VC的程序向导所生成的SDI框架的基础上修改而成。它没有 使用任何关于VC底层的东西。程序的绝大部分都是在CgameView类中 制作的,只有修改窗口特征的一段代码在CMainFrm类中。其他的类 统统没有用到。另外添加的一个类是CEnemy类。 整个游戏的故事情节分成8段,分别由Para1.h ~ Para8.h八个文件 实现。由于程序仅仅能够被动的处理各种各样的消息,所以情节的 实现也只能根据系统的一些参数来判断当前应当做什么。在程序中 使用了冗长的if……else if……结构来实现这种判断。 当然,在我的记录本上,详细的记录了每个事件的判断条件。这种 笨拙的设计当然是不可取的。成都金点所作《圣剑英雄II》采用了 剧本解读的方式,这才是正统的做法。但这也需要更多的编程经验 和熟练的code功夫。 下面列举的是程序编制过程中总结出来的经验和教训。 第一,对话方式应该采用《圣剑英雄II》的剧本方式。 现在的方式把一个段落中所有的对话都混在一个文件中,然后给每 句话一个号码相对应。这样做虽然降低了引擎的难度,却导致剧情的 编写极其繁琐。 第二,运动和显示应当完全分开。 现在的程序中,运动和显示是完全同步的。即:在定时器中调用所有 敌人的运动函数,然后将主角的动画向前推一帧,接着绘制地图,调 用所有敌人的显示函数、重绘主角。这样的好处是不会掉帧,但带来 的问题是,如果要提高敌人的运动速度,那么帧数也跟着上去了。所 以当DEMO版反馈说速度太慢的时候,我修改起来非常困难。而这个问 题到最后也仅仅是将4步一格该成了2步一格。 第三,VC中数组存在上限。如果用“int aaa[1000000000]”定义一个 数组,编译器肯定不会给分配那么大的内存空间。而在这个程序中, 地图矩阵、NPC矩阵都超过了VC中数组的上限。但这一点知道的太晚了。 在1.0版本中已经发现地图最右端缺少了几行,但不知道是什么原因 造成的。(地图编辑器中未出现此问题,因为地图编辑器是用“序列 化”的方式存盘读盘的。)解决这个问题的方法是用“new”来分配 内存空间。 第四,由于不知道应该如何使用“new”和“delete”,几乎所有的DC 都使用了全局变量。这是完全没有必要的。程序运行期大约会耗用20 多M的内存空间,相当于一个大型游戏所使用的内存空间了。 另外,在游戏的剧情、美工方面也有许多问题,总之一个词“业余”。 我就不总结了。下一部作品,我将争取在程序上有一个质的飞跃。

  • OpenGL 入门(一)—— OpenGL 基础

    OpenGL(Open Graphics Library)是图形领域的工业标准,是一套跨编程语言、跨平台、专业的图形编程(软件)接口。它用于二维、三维图像,是一个功能强大,调用方便的底层图形库。它与硬件无关,可以在不同的平台如 Windows、Linux、Mac、Android、IOS 之间进行移植。因此,支持 OpenGL 的软件具有很好的移植性,可以获得非常广泛的应用(比如 PS 在部分功能和操作中使用 OpenGL 加速,以提高图像处理和渲染的性能)。对于 Android 系统而言,它支持的是 Ope

  • OpenGl 概述

    OpenGL简单介绍学习笔记

  • OpenGL学习总结-OpenGL功能总结(六)

    OpenGL相关功能总结

  • openGl 入门(一)

    以问答的形式记录openGl 知识点

  • 【OpenGL学习】OpenGL介绍

    OpenGL学习笔记

  • openGL使用方法教程

     OpenGL是一个典型的、已经被接受的国际工业标准的三维图形软件包。严格地讲,OpenGL被定义为“图形硬件的一种软件接口”。从本质上说,它是一个3D图形和模型库,具有高度的可移植性,并且具有非常快的速度。OpenGL是API而不是编程语言。        OpenGL特点:OpenGL是一个过程性的图形API,它并不是描述性的。事实上,程序员并不需要描述场景的性质和外观,而是事先确定实现一定的

  • C++ OpenGL学习——入门篇

    本文参考自 opengl学习网站 opengl学习网站中文版 一、什么是OpenGL OpenGL主流上被认为是一个API(一个应用程序程序接口),提供了大量的函数,使用这些函数可以操作图形和图像。但OpenGL本身不是API,而是一个规范,由Khronos集团开发和维护 二、安装配置 1、OpenGL本身并没有创建窗口的函数,所以只能调用其他函数库,这里使用GLFW创建窗口 2、安装GLFW 下...

  • C++新手必备:基于OpenGL简单实现3d立方体

    VC++基于OpenGL简单实现3d立方体,没有添加动态的效果,只是一个三维立方体效果,有兴趣的朋友可下载参考。 项目源代码: 部分代码: 项目运行截图: ...

  • OpenGL入门教程12讲代码加解析

    OpenGL入门教程12讲代码加解析

  • C++/OpenGL环境配置

    记录C++/OpenGL的开发环境配置步骤。(参考书《计算机图形学编程(使用OpenGL和C++)》) 本人在准备了解图形学知识的同时,整好也想进行C++的深入学习,意外发现本书,刚好一举两得。 但C++/OpenGL开发环境配置较为复杂,所以在博客上对环境配置进行整理记录,以备来时。 1.C++环境用VS即可,OpenGL的API内置在显卡中,可通过GLView应用(直接搜索可得)查看显卡的OpenGL版本。 2.CMAKE编译工具——以下多个库需使用该工具编译获得 下载地址:https://cmake.

  • VS2019 搭建OpenGL环境

    点击跳转到视频教程 配置 OpenGL(Win10 + VS2019 + GLAD + GLFW) 并创建自己的第一个 OpenGL 项目 1.下载GLFW GLFW 2.下载GLAD GLAD 在线 3.创建控制台应用项目 4.找到并复制LearnOpenGL的源码 5.讲刚才复制的源码粘贴到新创建的项目的 cpp 文件中 可以看到有 include 的错误,说明找不到 glad/glad.h 和 GLFW/glfw3.h 这两个头文件 6.解决 include 报错的问题 进入到创建的

  • VS2019 最简单的配置glfw+glad教程以及画出三角形

    https://download.csdn.net/download/Zhangle11/12766169 将配置文件下载后 创建一个文件夹专门放入: 创建一个项目工程 右击属性 将glad.c添加进来 配置完成 下面展示代码 可参见 https://learnopengl.com/Getting-started/Hello-Triangle #include <glad/glad.h> #include <GLFW/glfw3.h> #include <iostrea

  • VC所需的OpenGL库文件

    利用MFC编写OpenGL程序所必需的几个库文件:opengl32.lib,glu32.lib,glaux.lib,glut32.lib

  • OpenGL03-显示窗口

    在windows中,使用GLFW创建窗口的流程如下: 包含头文件 #include "GLFW/glfw3.h" #pragma comment(lib, "glfw3.lib") 初始化窗口glfwInit() 配置GLFW glfwWindowHint(GLFW_CONTEXT_VERSION_MAJOR, 3); //OpenGL 3.3 glfwWindowHint(GLFW...

  • opengl初学 + C++ + vs2017

    OpenGL概述 1. 主要功能 (1)基本几何形状 绘制点、线段和多边形;Bezier曲线;简单形体 (2)属性 设置颜色、线型(实、虚等)。。。 (3)变换 几何变换:平移、旋转、缩放; 投影变换:正投影、透视投影(3维图形投影到2维平面) (4)交互(GLUT) 键盘和鼠标 2. 函数格式 glVertex3fv(x, y ,z ) ...

  • 【C++】OpenGL:计算机图形学OpenGL基础及环境配置

    计算机图形学OpenGL基础及环境配置

  • OpenGL基础教程

    OpenGL基础教程

  • Android C++ OpenGL 教程

    用纯C++实现Android的OpenGL渲染功能,包括EGL环境创建、EGL线程创建、OpenGL生命周期管理等,会结合SurfaceView和TextureView实现OpenGL的渲染,最终我们会实现一个YUV播放器实例,为音视频开发打下坚实的基础。

Global site tag (gtag.js) - Google Analytics