【phaser.js学习笔记（1）】使用phaser.js制作游戏

最新推荐文章于 2024-08-16 09:34:30 发布

orangecsy

最新推荐文章于 2024-08-16 09:34:30 发布

阅读量2.7k

点赞数 3

本文链接：https://blog.csdn.net/orangecsy/article/details/80590923

版权

这篇博客介绍了开源HTML5游戏框架phaser.js，包括其特点、版本以及如何安装和创建游戏对象。通过讲解游戏对象的配置、场景创建及主要方法，如preload、create、update，帮助读者理解如何利用phaser.js制作游戏。文章还提到了资源预加载、窗口调整和事件处理，最后提供了一个简单的游戏示例和代码存放的GitHub链接。

摘要由CSDN通过智能技术生成

phaser.js是一款开源的HTML5游戏框架，GitHub主页上star超过了2万。phaser.js支持使用JavaScript或TypeScript编写游戏，支持WebGL和Canvas渲染并可借助第三方工具编译成iOS，Android原生程序。phaser.js有两个版本：phaser 3和phaser CE（Community Edition）。phaser CE基于phaser 3并由社区主导，phaser 3是下一代phaser。

1、安装phaser 3

使用npm安装

npm install phaser

使用时引入

import 'phaser';

官方针对Webpack发布了Webpack模板（点击）。

2、创建游戏对象

import 'phaser';

// 游戏对象
let game;

// 全局游戏设置
const gameOptions = {
    // 角速度，每帧多少度
    rotationSpeed: 3,
    // 投掷飞刀的时间，单位毫秒
    throwSpeed: 150,
    // 两刀间最小间隔角度
    minAngle: 15
}

// 载入时初始化
window.onload = function () {
  // 配置信息
  const config =