经典游戏飞机大战

最新推荐文章于 2022-03-09 14:37:07 发布
最新推荐文章于 2022-03-09 14:37:07 发布
阅读量665 收藏 1
点赞数 1
分类专栏： JS
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/fanfan_h/article/details/99684178
版权

好久没更新了，想起之前做的飞机大战
在这里插入图片描述

/**
 * Created by Administrator on 2019/6/22.
 */
var playing =(function(){
    var start;
    function setmap(){
        if(start==undefined){
            start = new game();
        }
        return start;
    }
    //游戏的主类
    function game(){

    }
    //将地图挂载给游戏
   game.prototype.mapobj=new map();

    function map(){
        this.width =window.screen.availWidth ;
        this.height =window.screen.availHeight;
        this.bgurl="./img/map.jpg";
        this.mapp=null;
        this.isstart=true;
        this.makemap=function(){
           if(this.mapp==null){
               this.mapp=document.createElement ("div");
               this.mapp.style="position:relative;width:"+this.width+"px ;height:"+this.height+"px ;background-image:url("+this.bgurl+"); background-size:"+this.width+"px,"+this.height+"px;";
               document.body.appendChild (this.mapp);
           }
        }
    }
   //飞机挂载给地图
    map.prototype.userplane=function(){
        //console.log(this);  // this指的是map
         return new plane(this);  //传参
    }
    //创建飞机
    function plane(m){   //m==map
        this.flying=null;
        this.width=70;
        this.height=65;
        this.flysrc="./img/my_2.png";
        this.x=null;
        this.y=null;
        this.blood=5;
        this.makeplane=function(){
            if(this.flying ==null){
                this.flying=document.createElement ("img");
                this.flying.src=this.flysrc;
                this.flying.style="position:absolute;z-index:33;width:"+this.width+"px;height:"+this.height+"px";
                this.flying.setAttribute ("blood_num",this.blood);
                m.mapp.appendChild(this.flying);
            }
            this.x=m.width/2-this.width/2;
            this.y=m.height-this.height-13;
            this.flying.style.left = this.x +"px";
            this.flying.style.top = this.y +"px";
        };
        this.setevent=function(){
            this.flying.addEventListener("touchmove",this.moveflying);
        };
        this.moveflying=function(a){
            a=a|| a.window ;  //系统兼容性
           // console.log(a.touches[0]); //touch
            Plane.x= a.touches[0].pageX;
            Plane.y= a.touches[0].pageY;
            Plane.x=Plane.x - Plane.width/2;  //
            Plane.y=Plane.y - Plane.height/2;  //
           // console.log(this);  //this指的是飞机
            Plane.x = Plane.x <=0 ? 0 : Plane.x >= m.width -Plane.width ? m.width-Plane.width : Plane.x;
            Plane.y = Plane.y <=0 ? 0 : Plane.y >= m.height-Plane.height+10 ? m.height-Plane.height+10: Plane.y;
            this.style.left = Plane.x+"px";
            this.style.top  = Plane.y+"px";
        };

    }
    //子弹挂载给地图
    map.prototype.zidan=function() {
        return new biudan(this);
    }
    //创建子弹
    function biudan(m) {
            this.width = 30;
            this.height = 45;
            this.src = "./img/myb_1.png";
            this.biudanlist = [[], [], []];  //存放三种子弹
            this.method = "double";
            this.speed=6;
            this.dancreattime=12;
            this.makebiudan = function (plane) {
                switch (this.method) {
                    case "one":
                        var middle = document.createElement("img");
                        middle.src = this.src;
                        middle.style = "position:absolute;width:" + this.width + "px;height:" + this.height + "px";
                        this.biudanlist[1].push(middle);
                        break;
                    case "double":
                        //左边子弹
                        var tleft = document.createElement("img");
                        tleft.src = this.src;
                        tleft.style = "position:absolute;width:" + this.width + "px;height:" + this.height + "px";
                        this.biudanlist[0].push(tleft);
                        //右边子弹
                        var tright = document.createElement("img");
                        tright.src = this.src;
                        tright.style = "position:absolute;width:" + this.width + "px;height:" + this.height + "px";
                        this.biudanlist[2].push(tright);
                        break;
                    case "three":
                        //左边子弹
                        var tleft = document.createElement("img");
                        tleft.src = this.src;
                        tleft.style = "position:absolute;width:" + this.width + "px;height:" + this.height + "px";
                        this.biudanlist[0].push(tleft);

                        var middle = document.createElement("img");
                        middle.src = this.src;
                        middle.style = "position:absolute;width:" + this.width + "px;height:" + this.height + "px";
                        this.biudanlist[1].push(middle);
                        //右边子弹
                        var tright = document.createElement("img");
                        tright.src = this.src;
                        tright.style = "position:absolute;width:" + this.width + "px;height:" + this.height + "px";
                        this.biudanlist[2].push(tright);
                        break;
                        break;

                }
                this.addbiudan(plane);
            };
            this.addbiudan = function (plane) {
                switch (this.method) {
                    case "one" :
                        this.biudanlist [1][this.biudanlist[1].length - 1].style.left = (plane.x + plane.width / 2 - this.width / 2) + "px";
                        this.biudanlist [1][this.biudanlist[1].length - 1].style.top = (plane.y - this.height + 15) + "px";
                        m.mapp.appendChild(this.biudanlist[1][this.biudanlist[1].length - 1]);
                        break;
                    case "double" :
                        this.biudanlist [0][this.biudanlist[0].length - 1].style.left = (plane.x ) + "px";
                        this.biudanlist [0][this.biudanlist[0].length - 1].style.top = (plane.y - this.height + 15) + "px";
                        this.biudanlist [2][this.biudanlist[2].length - 1].style.left = (plane.x + plane.width-this.width) + "px";
                        this.biudanlist [2][this.biudanlist[2].length - 1].style.top = (plane.y - this.height + 15) + "px";
                        m.mapp.appendChild(this.biudanlist[0][this.biudanlist[0].length - 1]);
                        m.mapp.appendChild(this.biudanlist[2][this.biudanlist[2].length - 1]);
                        break;
                    case "three" :
                        this.biudanlist [1][this.biudanlist[1].length - 1].style.left = (plane.x + plane.width / 2 - this.width / 2) + "px";
                        this.biudanlist [1][this.biudanlist[1].length - 1].style.top = (plane.y - this.height + 15) + "px";
                        this.biudanlist [0][this.biudanlist[0].length - 1].style.left = (plane.x ) + "px";
                        this.biudanlist [0][this.biudanlist[0].length - 1].style.top = (plane.y - this.height + 15) + "px";
                        this.biudanlist [2][this.biudanlist[2].length - 1].style.left = (plane.x + plane.width-this.width) + "px";
                        this.biudanlist [2][this.biudanlist[2].length - 1].style.top = (plane.y - this.height + 15) + "px";
                        m.mapp.appendChild(this.biudanlist[0][this.biudanlist[0].length - 1]);
                        m.mapp.appendChild(this.biudanlist[2][this.biudanlist[2].length - 1]);
                        m.mapp.appendChild(this.biudanlist[1][this.biudanlist[1].length - 1]);
                        break;
                }
            };
            this.movebiudan = function (enemy) {
                switch (this.method) {
                    case "one":
                        for(var key in this.biudanlist[1] ){
                            var top = parseInt(this.biudanlist[1][key].style.top);
                            top-=this.speed;
                            this.biudanlist[1][key].style.top=top + "px";
                            if(top<=0){
                                this.biudanlist[1][key].remove();
                                this.biudanlist[1].splice(key,1);
                            }
                        }
                        break;
                    case "double":
                        //遍历左边
                        for(var key in this.biudanlist[0] ){
                            var top = parseInt(this.biudanlist[0][key].style.top);
                            top-=this.speed;
                            this.biudanlist[0][key].style.top=top + "px";
                            if(top<=0){
                                this.biudanlist[0][key].remove();
                                this.biudanlist[0].splice(key,1);
                            }
                        }
                        for(var key in this.biudanlist[2] ){
                            var top = parseInt(this.biudanlist[2][key].style.top);
                            top-=this.speed;
                            this.biudanlist[2][key].style.top=top + "px";
                            if(top<=0){
                                this.biudanlist[2][key].remove();
                                this.biudanlist[2].splice(key,1);
                            }
                        }
                        break;
                    case "three":
                        //遍历左边
                        for(var key in this.biudanlist[0] ){
                            var top = parseInt(this.biudanlist[0][key].style.top);
                            top-=this.speed;
                            this.biudanlist[0][key].style.top=top + "px";
                            if(top<=0){
                                this.biudanlist[0][key].remove();
                                this.biudanlist[0].splice(key,1);
                            }
                        }
                        for(var key in this.biudanlist[1] ){
                            var top = parseInt(this.biudanlist[1][key].style.top);
                            top-=this.speed;
                            this.biudanlist[1][key].style.top=top + "px";
                            if(top<=0){
                                this.biudanlist[1][key].remove();
                                this.biudanlist[1].splice(key,1);
                            }
                        }

                        for(var key in this.biudanlist[2] ){
                            var top = parseInt(this.biudanlist[2][key].style.top);
                            top-=this.speed;
                            this.biudanlist[2][key].style.top=top + "px";
                            if(top<=0){
                                this.biudanlist[2][key].remove();
                                this.biudanlist[2].splice(key,1);
                            }
                        }
                        break;
                }
                this.checkenemy (enemy);
            };
            this.checkenemy=function(enemy){
               for(var i=0;i<this.biudanlist.length;i++){  //0 1 2
                   for(var k=0;k<this.biudanlist[i].length;k++ ){
                    var biuleft=parseInt (this.biudanlist[i][k].style.left );
                    var biutop=parseInt (this.biudanlist[i][k].style.top );
                       for(var r=0;r<enemy.enemylist.length;r++ ){
                           var enleft=parseInt (enemy.enemylist[r].style.left);
                           var entop=parseInt (enemy.enemylist[r].style.top);
                           var enwidth=parseInt (enemy.enemylist[r].style.width);
                           var enheight=parseInt (enemy.enemylist[r].style.height);
                           if(biuleft <=enleft +enwidth && biutop<= entop+enheight && enleft<=this.width + biuleft){
                              this.biudanlist[i][k].remove();
                              this.biudanlist[i].splice(k,1);
                               var enblood = enemy.enemylist[r].getAttribute ("blood_num");
                               enblood--;
                               enemy.enemylist[r].setAttribute ("blood_num",enblood);
                               if(enblood<=0){
                                    enemy.enemylist[r].remove();
                                    enemy.enemylist.splice(r,1);
                               }
                           }
                       }
                   }
               }
            }
        }
   //敌机挂载给地图，传参
    map.prototype.enemy_plane=function() {
        return new enemy(this);
    }
    //创建敌机
    function enemy(m){
        this.enemyy=[["./img/ep_1.png",90,85,5],["./img/ep_2.png",83,78,4],["./img/ep_3.png",92,80,5],["./img/ep_4.png",86,75,3],["./img/ep_11.png",90,79,5],["./img/ep_8.png",80,75,3]];
        this.enemylist=[];
        this.r;
        this.speed=2;
        this.maketime=60;
        this.enemybiudanlist=[];
        this.makeenemy=function(){
          this.r = Math.floor(Math.random()*this.enemyy.length);
            var enemy=document.createElement ("img");
            enemy.src=this.enemyy[this.r][0];
            enemy.style="position:absolute;z-index:10;width:"+this.enemyy[this.r][1]+"px;height:"+this.enemyy[this.r][2]+"px;";
            enemy.style.left=(Math.random()* (m.width -this.enemyy[this.r][1]))+"px";
            enemy.style.top=10+"px";
            enemy.setAttribute ("blood_num",this.enemyy[this.r][3]);
            this.enemylist.push(enemy);
            m.mapp.appendChild (enemy );
            this.enemybiudanlist.push([]);
        };
        this.moveenemy=function(){
          for(var key in this.enemylist){
              var top = parseInt (this.enemylist[key].style.top);
              top+=this.speed;
              this.enemylist[key].style.top = top+"px";
              if(top>= m.height){
                  this.enemylist [key].remove();
                  this.enemylist.splice(key,1);
              }
          }
        };
        this.en_biudan=function(){
            for(var key in this.enemylist){
                var biudan=document.createElement ("img");
                biudan.src="./img/epb_1.png";
                biudan.style="position:absolute; width:20px; height:30px";
                var left=parseInt (this.enemylist[key].style.left) + parseInt(this.enemylist[key].style.width)/2 - 10;
                var top=parseInt (this.enemylist[key].style.top) + parseInt(this.enemylist[key].style.height);
                biudan.style.left=left+"px";
                biudan.style.top=top+"px";
                this.enemybiudanlist[key].push(biudan);
                m.mapp.appendChild (biudan );
            }
        };
        this.moveenemybiudan=function(plane){
            for(var i=0;i<this.enemybiudanlist.length;i++){
                for(var k=0;k<this.enemybiudanlist[i].length;k++ ){
                    var top=parseInt (this.enemybiudanlist[i][k].style.top );
                    var left=parseInt (this.enemybiudanlist[i][k].style.left );
                    top+=5;
                    this.enemybiudanlist[i][k].style.top = top+"px";
                    if(top>= m.height){
                        this.enemybiudanlist[i][k].remove();
                        this.enemybiudanlist[i].splice(k,1);
                    }
                    //检测用户飞机,打到用户飞机时
                   var mtop=parseInt(plane.flying.style.top);
                   var mleft=parseInt(plane.flying.style.left);
                    if(top+30>=mtop  &&  top <= plane.height+mtop && mleft<=left+20 && left<=plane.width+mleft){
                        console.log(2);
                        this.enemybiudanlist[i][k].remove();
                        this.enemybiudanlist[i].splice(k,1);
                        var mblood = plane.flying.getAttribute ("blood_num");
                        mblood--;
                        plane.flying.setAttribute ("blood_num",mblood);
                        if(mblood<=0){
                            m.isstart=false;
                            setInterval (function(){
                                cancelAnimationFrame (gametime )
                            },1)
                        }

                    }

                }
            }
        }

    }
    return{
        gamestart: setmap
    }
})();

var Begin =playing.gamestart();
Begin.mapobj.makemap ();

var Plane=Begin.mapobj.userplane();
Plane.makeplane ();
Plane.setevent ();

var Biudan=Begin.mapobj.zidan ();
var makebiudan=0;

var Enemy=Begin.mapobj.enemy_plane ();
var make_enemy=0;  //敌机产生时间
var make_enbiudantime=0;
var isenemystart=true;
var gametime=null;
setInterval (function(){
    isenemystart =!isenemystart ;
},1000);
animate();
function animate(){
    makebiudan ++;
    make_enemy ++;
    if(makebiudan>=Biudan.dancreattime){
        makebiudan =0;
        Biudan.makebiudan (Plane);
    }
   if(make_enemy >=Enemy.maketime ){
     make_enemy=0;
       Enemy.makeenemy ();
   }
    Biudan.movebiudan (Enemy);
    Enemy.moveenemy();
    if(isenemystart ){
        make_enbiudantime++;
        if(make_enbiudantime>=14){
            make_enbiudantime=0;
            Enemy.en_biudan ();
        }
    }

    Enemy.moveenemybiudan (Plane);
   gametime =window.requestAnimationFrame (animate);
    if(!Begin.mapobj.isstart ){
        Plane.flying.removeEventListener("touchmove",Plane.moveflying);
    }
}
/*
console.log(Begin);
console.log(Plane);*/
莓莓儿～
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
经典飞机大战
03-12
经典飞机大战 cocoscreator ！！！速来下载！！！ 走过路过不要错过
Java经典飞机大战游戏
茶树
10-20 1万+
《飞机大战》这款小游戏相信许多朋友早就已经玩过，但是作为小白，学习过程中就是要拿各种经典项目来练手，飞机大战就是老师拿来让我们练手的一个小项目。老师给我们提供了素材包，让我们自由发挥，刚开始真的是没什么头绪，不过这几天的确学习到一些东西，随着慢慢尝试，终于背景动了起来，飞机动了起来，子弹动了起来，可以消灭敌机了，到这也算实现了最底层的功能，这里把代码和我理解的注释写下来，算是对学习过程的记录，也希...
Docker--docker ps 命令与结果解析
Tech Station
10-13 1万+
命令详解 意义：列出容器相关信息 格式：docker ps [options] 参数列表： 参数 解释 无参 默认显示正在运行的容器 -a 显示所有的容器，包括未运行的 -f 根据条件过滤.........
经典飞机大战资源源码
07-10
实现最基本功能，英雄飞机，Boss飞机和子弹的创建和检测碰撞并销毁。
cocos2d-x飞机大战——加载页面到游戏菜单，再从游戏菜单进入地图
qq_41791653的博客
09-05 437
为了节省内存，提高效率，大多数游戏开发者会将零碎的图片合成一张图片（使用TexturePacker可以实现合图功能，shoeBox可以拆图） 1、使用cocos2d-x引擎如何获取合图中的某一张图 首先应当获取精灵帧缓冲区，将合图加载进缓冲区： //获取精灵帧缓冲区，里面存放精灵帧 SpriteFrameCache* pCache=SpriteFrameCache::getInstanc...
C++最经典游戏飞机大战代码（高仿），完美复原原游戏，好玩到停不下来
最新发布
03-29
C++最经典游戏飞机大战代码（高仿），完美复原原游戏，好玩到停不下来 C++最经典游戏飞机大战代码（高仿），完美复原原游戏，好玩到停不下来 C++最经典游戏飞机大战代码（高仿），完美复原原游戏，好玩到停不下来 ...
java小游戏 飞机大战
06-23
java小游戏 飞机大战java小游戏 飞机大战java小游戏 飞机大战java小游戏 飞机大战java小游戏 飞机大战java小游戏 飞机大战java小游戏 飞机大战java小游戏 飞机大战java小游戏 飞机大战java小游戏 飞机大战java小游戏...
java游戏之飞机大战
12-07
《Java游戏：飞机大战》是一款基于Java编程语言开发的简单射击类游戏，它展示了Java在游戏开发中的应用潜力。在这款游戏中，玩家控制一架飞机，通过躲避敌机和发射子弹来消灭敌人，体验刺激的空战场景。下面将详细...
飞机大战游戏.rar
07-25
"飞机大战游戏"作为一个经典的休闲小游戏，利用JavaScript、HTML和CSS这三种前端核心技术构建，为用户提供了沉浸式的体验。本文将深入探讨这款小游戏的开发过程，以及JavaScript在其中的关键作用。 一、JavaScript...
微信经典飞机大战
12-02
《微信经典飞机大战》是一款基于JavaScript（JS）开发的在线游戏，它仿照了微信内置的热门游戏“飞机大战”。这款游戏充分利用了Web技术，为玩家提供了在浏览器上体验射击战斗的乐趣。下面将详细介绍《微信经典飞机...
微信经典飞机大战之四：子弹层的完全解析
三十画生 一个北漂的人
03-01 2867
飞机发射子弹在子弹层需要处理以下几个方面： 1.子弹的渲染效果 2.子弹的初始位置和飞行效果 3.子弹的管理和回收 4.子弹层提供的其他接口 这节，我们就从这四个方面来完全解析子弹层。 1.子弹的渲染效果 子弹的添加和渲染，我们采用CCSpriteBatchNode，因为批次渲染只要1次就可以完成了。 bool BulletLayer::init() { bool bRe
c++飞机大战
qq_43525905的博客
07-17 6339
C++飞机大战 长春理工大学大一下学期面向对象课程设计 本程序于2018年7月完成 这个飞机大战运用了easyX库，这个库可以帮助新手快速上手图形界面编程 声明 本人为长春理工大学2018级学生，程序为本人制作，本程序未经允许请勿做商用 资源包包含一个课程设计论文，详细设计见论文，代码就不打出来了，自己去下载 功能需求 地图选择 难度选择 分数模块 激光模块 … 概述 飞机大战游戏是基于Win...
cocos2dx实现经典飞机大战
weixin_30381317的博客
02-25 348
游戏开始层 #ifndef __LayerGameStart_H__ #define __LayerGameStart_H__ #include "cocos2d.h" USING_NS_CC; class LayerGameStart :public CCLayer { public: static CCScene * scene(); CREATE...
用 Python 写一个经典的飞机大战（附源代码）
小六的博客
03-09 6457
当年微信 5.0 发布时，首页被设置成了一款新推出的小游戏，它就是微信版飞机大战，游戏一经推出便是火爆异常，铅笔画风格的游戏界面也受到了很多人的喜欢。 最近重温了一下这款小游戏，尽管时隔多年，但无论是游戏的画质还是风格，时至今日依然都不过时。本文我们使用 Python 来实现一下这款小游戏，游戏的实现主要用到第三方模块 pygame，安装使用 pip install pygame 即可。 注：文章末尾附源码and资料领取方式！ 环境 操作系统：Windows Python 版本：3.6 涉及模块：pygam
初学Android之飞机大战（二）——地图
origin_edge的博客
05-25 707
package com.example.a11918.myapplication;import android.graphics.Bitmap; import android.graphics.Canvas; import android.graphics.Paint;/** * Created by 11918 on 2017/5/25. *//** * 地图类 */ public cla
Python代码实现飞机大战(经典)
gb4215287的博客
08-04 8144
参考资料 《零基础入门学习python》 源代码以及素材资料(图片，音频)可从下面的github中下载： 飞机大战源代码以及素材资料github项目地址链接 ————————————————————————————————————————————————————— 文章目录 经典飞机大战 一.游戏设定 二.我方飞机 三.敌方飞机 四.发射子弹 五.发放补给包 六.主模块 经典飞机大战 不知道大家有没有打过飞机,喜不喜欢打飞机。当我第一次接触这个东西的时候,我的内心.
pygame编写飞机大战(4)-滚动地图
一亩三分地儿
09-24 5271
我们要实现飞机在场景中飞行的效果，我们可以选择背景地图滚动，相对来衬托飞机在移动。如何实现背景的滚动效果，我们可选取两张图片，两张图片交替向下移动，当某张图片完全移动到屏幕外侧，那么马上再次设置为开始位置，重新开始移动。图示入下： 这里有两张一模一样的图片，这两张图片比较特殊，也就是图片的下边界和图片的上边界可以完美的无缝的对接在一起，好似一张图片一样。我们将这两张图片一张放在场景上外侧
js中的foreach用法
热门推荐
不想写代码的一天
06-10 59万+
forEach() 方法对数组的每个元素执行一次提供的函数。 var array = ['a', 'b', 'c']; array.forEach(function(element) { console.log(element); }); 输出为： a; b; c; forEach() 方法对数组的每个元素执行一次提供的函数。总是返回undefined； var arr = [1,2,3...
C++实现的飞机大战游戏开发
"C++飞机大战游戏开发实训报告" 在本次实训中，学生使用Microsoft Foundation Classes (MFC)库开发了一款简易的飞机大战游戏。游戏实现了基础的飞行射击元素，包括飞机、导弹、敌机、碰撞检测以及各种特效。以下是...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值