phaser实现一个简单的杀虫子游戏效果代码
代码语言:html
所属分类:游戏
代码描述:phaser实现一个简单的杀虫子游戏效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<html lang="en"><head> <meta charset="UTF-8"> <title>CodePen - Insect Catch : Sample Tutorial Game</title> <style>html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}</style> <style> body { background-color: #000000; display: grid; place-items: center; } </style> </head> <body style="height: 100%;"> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/phaser.min.js"></script> <script> "use strict"; // Assets prefix const ASSET_PREFIX = "//repo.bfw.wiki/bfwrepo/images/phaser/insect-catch-"; // Size of each tiles const TILES_SIZE = 16; // Count of X tiles of the screen const SCREEN_X = 4 * 4; // Count of Y tiles of the screen const SCREEN_Y = 3 * 4; // Width of the screen const SCREEN_WIDTH = TILES_SIZE * SCREEN_X; // Height of the screen const SCREEN_HEIGHT = TILES_SIZE * SCREEN_Y; // Count of background tile set const BACKGROUND_COUNT = 5; // Count of objects on the game const OBJECT_COUNT = 21; // Movement speed of the character const MOVE_SPEED = 32; // Directions of the character const DIRECTIONS = ["front", "rear", "left", "right"]; // Count of bugs will appear on the game screen const BUGS_COUNT = 5; // Respa const BUGS_RESPAWN_TIME = 10000; /** * Get coordinate of x or y from the screen */ function getCoordinate(value) { return (value * TILES_SIZE) + (TILES_SIZE / 2); } /** * Generate random path variable */ function getRandomPath() { return { x: getCoordinate(Phaser.Math.Between(1, SCREEN_X - 2)), y: getCoordinate(Phaser.Math.Between(1, SCREEN_Y - 2)), } } // Main class class BugCatchGame extends Phaser.Scene { /** * Class constructor */ constructor() { super(); } /** * Load all the required assets */ preload() { // Background tile set for (let i = 1; i <= BACKGROUND_COUNT; i++) { this.load.image(`background-${i}`, `${ASSET_PREFIX}background-${i}.png`); } // Tree this.load.image("tree", `${ASSET_PREFIX}tree.png`); // House this.load.image("house", `${ASSET_PREFIX}house.png`); // Character sprite this.load.spritesheet("character-sprite", `${ASSET_PREFIX}character-sprite.png`, { frameWidth: TILES_SIZE, frameHeight: TILES_SIZE, }); // Bug this.load.image("bug", `${ASSET_PREFIX}bug.png`); } /** * Create and ini.........完整代码请登录后点击上方下载按钮下载查看
网友评论0