体验 TapTap 小游戏

TapTap 小游戏是一种开放能力。允许用户基于给定的 API 编写游戏代码，最终生成可运行在接入小游戏功能的各产品 APP 上。

快速上手

小游戏文件结构

.
├── game.js               =>  小游戏入口文件
├── game.json             =>  小游戏配置文件
└── project.config.json   =>  工程配置文件

以上三个文件为小游戏的三个必要文件，开发者如有其它资源可以在根目录下自由建立 js, audio, images 等目录，规范自己的开发文件。

配置

小游戏包含两个配置文件：小游戏配置文件game.json和工程配置文件project.config.json。

小游戏配置文件game.json

game.json 示例如下，详细说明可见小游戏配置。

{
  "deviceOrientation": "portrait"
}

工程配置文件project.config.json

project.config.json 示例

{
  "description": "项目描述",
  "setting": {
    "es6": true // 声明使用的 js 语法版本
  }
}

平台能力

Tap API

本平台可以使用 JavaScript 来编写小游戏。小游戏的运行环境是一个绑定了一些方法的 JavaScript VM。不同于浏览器，这个运行环境没有 BOM 和 DOM API，只有 tap系列 API。接下来我们将介绍如何用 tap API 来完成创建画布、绘制图形、显示图片以及响应用户交互等基础功能。

创建 Canvas

var canvas = tap.createCanvas();

通过调用 tap.createCanvas() 接口，可以创建一个 Canvas 对象。用户第一次调用时， 获取到的是一个上屏 Canvas，该 Canvas 已经显示在了屏幕上，且与屏幕等宽等高。小游戏运行期间，有且仅有一个上屏 Canvas。

绘制

var context = canvas.getContext("2d");
context.fillStyle = "#ff00ff";
context.fillRect(0, 0, 100, 100);

触摸事件

平台提供了一系列监听触摸事件的 API：

• tap.onTouchStart()
• tap.onTouchMove()
• tap.onTouchEnd()
• tap.onTouchCancel()

动画能力

开发者可以利用定时器相关 API 实现动画效果，如下

• setTimeout
• setInterval
• requestAnimationFrame
• clearTimeout
• clearInterval
• cancelAnimationFrame

全局对象

小游戏的运行环境不同于 Web 环境，在真机上运行时，没有BOM API，因此也就没有 window 对象以及其上面的各种属性。所以，从 H5 迁移过来的游戏，开发者需要自己实现 window 对象的兼容(如果是利用游戏引擎开发的小游戏，导出的小游戏版本一般已经包含了一份 adapter，适配了 window 对象)。同时，在小游戏的运行环境中，提供了全局对象 GameGlobal，所有全局定义的变量都是 GameGlobal 的属性。如：

setTimeout === GameGlobal.setTimeout; // true
requestAnimationFrame === GameGlobal.requestAnimationFrame; // true

同时，GameGlobal 是一个全局对象，也是一个循环引用的对象。

GameGlobal.GameGlobal === GameGlobal;true

无网兼容

开发中，暂不支持无网打开

开放能力

平台允许开发者可以利用一些产品宿主提供的如登录，分享，支付，广告等一系列开放能力，用以完善自己的产品逻辑和体验。具体可以参考小游戏开发教程 > 开放能力一栏。

代码包限制

目前限制整包大小不超过60M