processing实现带音效小动物加农炮发射距离比拼小游戏代码
代码语言:html
所属分类:游戏
代码描述:processing实现带音效小动物加农炮发射距离比拼小游戏代码,左右键控制大炮发射角度,空格键发射。还可以选择不同的小动物,看看谁飞的更远。
代码标签: processing 音效 小动物 加农炮 发射 距离 比拼 小游戏 代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> * { margin: 0; box-sizing: border-box; overflow: hidden; } body { background: #367396; width: 100%; height: 100vh; display: flex; justify-content: center; align-items: center; } body canvas { box-shadow: 0.2em 0.2em 2em #0008; border: none; outline: none; } </style> </head> <body translate="no"> <canvas id="canvas"></canvas> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/processing.1.4.8.js"></script> <audio id="explosive" src="//repo.bfw.wiki/bfwrepo/sound/66d12ba103e33.mp3" preload="auto"></audio> <audio id="bomb" src="//repo.bfw.wiki/bfwrepo/sound/66d12bc052e2d.mp3" preload="auto"></audio> <audio id="trampoline" src="//repo.bfw.wiki/bfwrepo/sound/66d12beddd4aa.mp3" preload="auto"></audio> <audio id="mud" src="//repo.bfw.wiki/bfwrepo/sound/66d12c0b1fae4.mp3" preload="auto"></audio> <audio id="flytrap" src="//repo.bfw.wiki/bfwrepo/sound/66d12c51e76a0.mp3" preload="auto"></audio> <audio id="fire" src="//repo.bfw.wiki/bfwrepo/sound/66d12b86d190c.mp3" preload="auto"></audio> <audio id="ground" src="//repo.bfw.wiki/bfwrepo/sound/66d12b76b704b.mp3" preload="auto"></audio> <script> var sketchProc = function(processingInstance) { with (processingInstance) { size(900, 600); frameRate(60); smooth(); textFont(createFont("Trebuchet MS")); var game; var Button = function(args) { this.x = args.x; this.y = args.y; this.w = args.w || 120; this.h = args.h || 50; this.content = args.content; this.func = args.func; this.enabled = args.enabled || false; }; Button.prototype = { over: function() { return (mouseX > this.x && mouseX < this.x + this.w && mouseY > this.y && mouseY < this.y + this.h); }, draw: function() { noStroke(); if(this.enabled && this.over()) { game.hover = true; fill(69, 66, 69); } else { fill(46, 47, 48); } //Draw the button rect(this.x, this.y, this.w, this.h); //Draw the text on the button pushStyle(); textAlign(CENTER, CENTER); textSize(18); fill(255); text(this.content, this.x + this.w / 2, this.y + this.h / 2); popStyle(); //If the mouse was clicked and the mouse was over the button if(this.enabled && game.clicked && this.over()) { //Run the function this.func(); } } }; //Transition object (between scenes) var Transition = function() { this.h = 0; this.vy = 15; this.active = false; this.scene = "home"; this.reset = function() { this.h = 0; this.vy = 15; }; this.draw = function() { if(this.active) { pushStyle(); fill(64, 57, 59); rect(-20, -20, width + 40, this.h); rect(-20, height-this.h, width + 40, this.h + 20); popStyle(); } }; this.update = function() { if(this.active) { this.h+= this.vy; //if halfway across the screen then change the scene if(this.h >= 300) { game.scene = this.scene; this.vy*= -1; } //else if it's completely off the screen reset it and set to inactive else if(this.h < 0) { this.reset(); this.active = false; } } }; this.run = function() { this.draw(); this.update(); }; }; var Block = function(args) { this.x = args.x || 0; this.y = args.y || 0; this.w = args.w || 100; this.h = args.h || this.w; this.vx = args.vx || 0; this.vy = args.vy || 0; }; Block.new = function(args) { var obj = Object.create(Block.prototype); Block.apply(obj, arguments); return obj; }; Block.prototype = { move: function() { this.x += this.vx; this.y += this.vy; }, draw: function() { pushStyle(); noStroke(); fill(194, 91, 81); rect(this.x, this.y, this.w, this.h); popStyle(); }, go: function() { this.draw(); this.move(); } }; var Trampoline = function(args) { this.x = args.x || 0; this.y = args.y || 0; this.w = args.w || 100; this.h = args.h || this.w; // this.vx = args.vx || 0; // this.vy = args.vy || 0; this.dead = false; }; Trampoline.new = function(args) { var obj = Object.create(Trampoline.prototype); Trampoline.apply(obj, arguments); return obj; }; Trampoline.prototype = { draw: function() { pushStyle(); noStroke(); fill(194, 91, 81); //legs //front left rect(this.x + this.w * 0.12, this.y + this.h * 0.8, this.w * 0.08, this.h * 0.8); //front right rect(this.x + this.w * 0.8, this.y + this.h * 0.8, this.w * 0.08, this.h * 0.8); //back left rect(this.x + this.w * 0.01, this.y + this.h * 0.6, this.w * 0.08, this.h * 0.8); //back right rect(this.x + this.w * 0.91, this.y + this.h * 0.6, this.w * 0.08, this.h * 0.8); //main body fill(80, 222, 201); ellipse(this.x + this.w * 0.5, this.y + this.h * 0.5, this.w * 1.1, this.h * 1.1); fill(79, 82, 82); ellipse(this.x + this.w * 0.5, this.y + this.h * 0.40, this.w * 0.90, this.h * 0.55); // noFill(); // stroke(0); // rect(this.x, this.y, this.w, this.h); popStyle(); }, update: function() { // this.x += this.vx; // this.y += this.vy; }, go: function() { this.draw(); this.update(); } }; var Mud = function(args) { this.x = args.x || 0; this.y = args.y || 0; this.w = args.w || 100; this.h = args.h || this.w; this.dead = false; }; Mud.new = function(args) { var obj = Object.create(Mud.prototype); Mud.apply(obj, arguments); return obj; }; Mud.prototype = { draw: function() { pushMatrix(); translate(this.x, this.y); pushStyle(); noStroke(); // fill(120, 96, 60); // ellipse(this.w * 1.2, this.h * 1.2, this.w * 0.4, this.h * 0.7); // ellipse(-this.w * 0.3, this.h * 1.3, this.w * 0.4, this.h * 0.6); // ellipse(this.w * 0.2, this.h * 2.0, this.w * 0.4, this.h * 0.6); fill(97, 72, 26); ellipse(this.w * 0.5, this.h * 0.8, this.w * 1.6, this.h * 1.8); fill(120, 106, 44); ellipse(this.w * 0.5, this.h * 0.7, this.w * 1.4, this.h * 1.4); fill(102, 80, 45); ellipse(this.w * 0.5, this.h * 0.7, this.w * 1, this.h * 1); fill(120, 106, 44); ellipse(this.w * 0.4, this.h * 0.6, this.w * 0.4, this.h * 0.5); popStyle(); popMatrix(); }, update: function() { // this.x += this.vx; // this.y += this.vy; }, go: function() { this.draw(); this.update(); } }; var Bomb = function(args) { this.x = args.x || 0; this.y = args.y || 0; this.w = args.w || 100; this.h = args.h || this.w; this.dead = false; }; Bomb.new = function(args) { var obj = Object.create(Bomb.prototype); Bomb.apply(obj, arguments); return obj; }; Bomb.prototype = { draw: function() { pushMatrix(); translate(this.x, this.y); pushStyle(); //balloon stroke(50); strokeWeight(1); fill(227, 93, 88); ellipse(0, -this.h * 1.5, this.w, this.h * 1.1); //shadow on balloon pushMatrix(); translate(-this.w * 0.25, -this.h * 1.7); rotate(radians(35)); noStroke(); fill(242, 242, 242, 200); ellipse(0, 0, this.w * 0.2, this.h * 0.3); popMatrix(); //string connecting the bomb to the balloon stroke(50); line(0, -this.h, 0, 0); //bomb pushMatrix(); rotate(radians(-25)); fill(148, 145, 148); beginShape(); vertex(-this.w * 0.4, -this.h * 0.2); vertex( this.w * 0.3, -this.h * 0.2); vertex( this.w * 0.4, -this.h * 0.1); vertex( this.w * 0.5, -this.h * 0.2); vertex( this.w * 0.6, -this.h * 0.2); vertex( this.w * 0.6, this.h * 0.2); vertex( this.w * 0.5, this.h * 0.2); vertex( this.w * 0.4, this.h * 0.1); vertex( this.w * 0.3, this.h * 0.2); vertex(-this.w * 0.4, this.h * 0.2); bezierVertex(-this.w * 0.55, this.h * 0.1, -this.w * 0.55, -this.h * 0.1, -this.w * 0.4, -this.h * 0.2); endShape(); //string around bomb line(this.w * 0.1, -this.h * 0.2, this.w * 0.05, this.h * 0.2); //words on bomb textSize(12); fill(0); text("BOMB", -this.w * 0.34, this.h * 0.09); popMatrix(); popStyle(); popMatrix(); }, update: function() { // this.x += this.vx; this.y += game.sin(radians(frameCount * 2)) * 0.4; }, go: function() { this.draw(); this.update(); } }; var Explosive = function(args) { this.x = args.x || 0; this.y = args.y || 0; this.w = args.w || 100; this.h = args.h || this.w; this.dead = false; }; Explosive.new = function(args) { var obj = Object.create(Explosive.prototype); Explosive.apply(obj, arguments); return obj; }; Explosive.prototype = { draw: function() { pushMatrix(); translate(this.x, this.y); pushStyle(); //barrel stroke(38, 38, 38); strokeWeight(1); fill(120, 119, 120); beginShape(); vertex(0, 0); vertex(this.w * 0.5, 0); vertex(this.w * 0.5, this.h); bezierVertex(this.w * 0.3, this.h * 1.1, this.w * 0.2, this.h * 1.1, 0, this.h); endShape(CLOSE); ellipse(this.w * 0.25, 0, this.w * 0.5, this.h * 0.15); bezier(0, this.h * 0.3, this.w * 0.15, this.h * 0.41, this.w * 0.35, this.h * 0.41, this.w * 0.5, this.h * 0.3); bezier(0, this.h * 0.7, this.w * 0.15, this.h * 0.81, this.w * 0.35, this.h * 0.81, this.w * 0.5, this.h * 0.7); //hole in top of barrel noStroke(); fill(41, 40, 41); ellipse(this.w * 0.15, 0, this.w * 0.15, this.h * 0.05); //skull and cross bones on barrel stroke(66, 63, 63); strokeWeight(3); line(this.w * 0.1, this.h * 0.5, this.w * 0.4, this.h * 0.75); line(this.w * 0.1, this.h * 0.75, this.w * 0.4, this.h * 0.5); strokeWeight(1); noStroke(); ellipse(this.w * 0.1, this.h * 0.5, 5, 7); ellipse(this.w * 0.4, this.h * 0.75, 5, 7); ellipse(this.w * 0.1, this.h * 0.75, 5, 7); ellipse(this.w * 0.4, this.h * 0.5, 5, 7); ellipse(this.w * 0.25, this.h * 0.3, this.w * 0.3, this.h * 0.3); ellipse(this.w * 0.25, this.h * 0.4, this.w * 0.2, this.h * 0.3); fill(156, 153, 156); ellipse(this.w * 0.2, this.h * 0.3, this.w * 0.06, this.h * 0.10); ellipse(this.w * 0.3, this.h * 0.3, this.w * 0.06, this.h * 0.10); //TNT randomSeed(100); stroke(40); fill(219, 89, 57); for(var i = 0; i < 10; i++) { pushMatrix(); rotate(radians(random(-5, 5))); rect(random(this.w * 0.5, this.w * 0.9), random(-this.h * 0.1, this.h * 0.05), this.w * 0.08, this.h * 0.4); popMatrix(); } //TNT box stroke(40); fill(200, 140, 115); rect(this.w * 0.5, this.h * 0.3, this.w * 0.5, this.h * 0.7); line(this.w * 0.5, this.h * 0.65, this.w, this.h * 0.65); fill(36, 35, 36); textSize(14); textAlign(CENTER); text("TNT", this.w * 0.75, this.h * 0.6); text("TNT", this.w * 0.75, this.h * 0.95); popStyle(); popMatrix(); }, update: function() { // this.x += this.vx; // this.y += this.vy; }, go: function() { this.draw(); this.update(); } }; var FlyTrap = function(args) { this.x = args.x || 0; this.y = args.y || 0; this.w = args.w || 100; this.h = args.h || this.w; this.angle = 20; this.eat = false; this.dead = false; this.color = color(108, 158, 27); }; FlyTrap.new = function(args) { var obj = Object.create(FlyTrap.prototype); FlyTrap.apply(obj, arguments); return obj; }; FlyTrap.prototype = { draw: function() { pushMatrix(); translate(this.x, this.y); pushStyle(); //main stem strokeWeight(7); stroke(50); bezier(0, this.h * 0.48, this.w * 0.25, this.h * 0.7, -this.w * 0.25, this.h * 0.8, 0, this.h * 1.1); strokeWeight(5); stroke(108, 158, 27); bezier(0, this.h * 0.48, this.w * 0.25, this.h * 0.7, -this.w * 0.25, this.h * 0.8, 0, this.h * 1.1); //branches fill(108, 158, 27); strokeWeight(3); stroke(50); bezier(0, this.h * 0.7, -this.w * 0.2, this.h * 0.7, -this.w * 0.4, this.h * 0.7, -this.w * 0.5, this.h * 0.9); bezier(0, this.h * 0.8, this.w * 0.2, this.h * 0.8, this.w * 0.4, this.h * 0.7, this.w * 0.5, this.h * 0.95); fill(108, 158, 27); strokeWeight(2); stroke(108, 158, 27); bezier(0, this.h * 0.7, -this.w * 0.2, this.h * 0.7, -this.w * 0.4, this.h * 0.7, -this.w * 0.5, this.h * 0.9); bezier(0, this.h * 0.8, this.w * 0.2, this.h * 0.8, this.w * 0.4, this.h * 0.7, this.w * 0.5, this.h * 0.95); //head stroke(50); strokeWeight(1); fill(108, 158, 27); //left pushMatrix(); translate(0, this.h * 0.5); rotate(radians(-this.angle)); beginShape(); vertex(0, 0); vertex(-this.w * 0.1, -this.h * 0.2); vertex( this.w * 0.1, -this.h * 0.4); vertex(-this.w * 0.1, -this.h * 0.6); vertex( this.w * 0.1, -this.h * 0.8); vertex(0, -this.h); bezierVertex(-this.w * 0.65, -this.h * 0.9, -this.w * 0.65, -this.h * 0.1, 0, 0); endShape(); popMatrix(); //right pushMatrix(); translate(0, this.h * 0.5); rotate(radians(this.angle)); beginShape(); vertex(0, 0); vertex(-this.w * 0.1, -this.h * 0.2); vertex( this.w * 0.1, -this.h * 0.4); vertex(-this.w * 0.1, -this.h * 0.6); vertex( this.w * 0.1, -this.h * 0.8); vertex(0, -this.h); bezierVertex(this.w * 0.65, -this.h * 0.9, this.w * 0.65, -this.h * 0.1, 0, 0); endShape(); popMatrix(); //pot strokeWeight(1); stroke(50); fill(219, 165, 57); beginShape(); vertex(-this.w * 0.5, this.h * 1.1); vertex( this.w * 0.5, this.h * 1.1); vertex( this.w * 0.4, this.h * 2); vertex(-this.w * 0.4, this.h * 2); endShape(CLOSE); fill(176, 130, 39); beginShape(); vertex(-this.w * 0.55, this.h * 1.1); vertex( this.w * 0.55, this.h * 1.1); vertex( this.w * 0.55, this.h * 1.3); vertex(-this.w * 0.55, this.h * 1.3); endShape(CLOSE); popStyle(); popMatrix(); }, update: function() { if(this.eat) { this.angle = lerp(this.angle, 0, 0.08); } }, go: function() { this.draw(); this.update(); } }; var Player = function(args) { this.x = args.x; this.y = args.y; this.vx = args.vx || 0; this.vy = args.vy || 0; this.diameter = args.diameter || 100; this.scale = this.diameter / 300; this.radius = this.diameter / 2; this.circumference = 2 * PI * this.radius; this.vymax = ~~this.diameter * 0.65; this.vxmax = ~~this.diameter * 0.5; this.gravity = args.gravity || 0.2; this.friction = args.friction || 0;// || 0.02; this.angle = args.angle || 0; this.rot = args.rot || 0; this.color = args.color || color(204, 192, 55); this.eaten = false; this.type = args.type || "cat"; }; Player.new = function(args) { var obj = Object.create(Player.prototype); Player.apply(obj, arguments); return obj; }; Player.prototype = { draw: function() { pushMatrix(); translate(this.x, this.y); rotate(radians(this.angle)); scale(this.scale); switch(this.type) { case "cat": pushStyle(); imageMode(CENTER); image(game.images.cat, 0, 0); imageMode(CORNER); popStyle(); break; case "dog": pushStyle(); imageMode(CENTER); image(game.images.dog, 0, 0); imageMode(CORNER); popStyle(); break; case "sheep": pushStyle(); imageMode(CENTER); image(game.images.sheep, 0, 0); imageMode(CORNER); popStyle(); break; case "pig": pushStyle(); imageMode(CENTER); image(game.images.pig, 0, 0); imageMode(CORNER); popStyle(); break; case "cow": pushStyle(); imageMode(CENTER); image(game.images.cow, 0, 0); imageMode(CORNER); popStyle(); break; case "mouse": pushStyle(); imageMode(CENTER); image(game.images.mouse, 0, 0); .........完整代码请登录后点击上方下载按钮下载查看
网友评论0