使用processing写一个仿雷电小游戏

非常幸运这个学期在互动媒体技术这门课上深入的了解了Daniel Shiffman的《代码本色 The Nature of Code》 这本书，在课程最后，老师也是希望我们能利用书中的内容做一个交互应用出来，这就是我们本次博文内容的主题啦。

1.前言

那么怎么才能让这个交互小应用变得足够有趣呢，我思考了很多的表现形式，最终还是回到了我比较熟悉的游戏上来。
当然，可供选择的游戏模式依旧有很多，正好在思考这个问题的几天里，我的网易云推给了我一首FC游戏的bgm，一下子无数回忆涌上心头，就想使用processing仿照着去写一个小时候玩过的《雷电》。

2.内容展示

3.实现过程

首先我们需要实现这个小应用需要什么功能，然后再把这些功能抽象成一个个类，这样实现起来会方便很多。
然后我们可以想到，我们需要的有：子弹类，主角类，云彩类，怪物类，飞机尾气类还有子弹消失的粒子效果类。
这些类别共同构成了我们可以进行交互娱乐的游戏应用，接下来我们就几个关键技术看他们的具体实现。

3.1.背景云彩的随机生成

在这份小游戏中，背景由天蓝色的整体颜色以及白色的云朵组成，在这里我们可以设定云彩的数量上限，然后在每次初始化的时候进行随机生成。

class cloud {
   
  int num_cloud;
  float[] bgptx;
  float[] bgpty;

  cloud(int num) {
   
    bgptx = new float[num];
    bgpty = new float[num];
    num_cloud = num;
    for (int i = 0; i<num_cloud; i++) {
   
      bgptx[i] = random(-width*0.4, boxx+width*0.4);
      bgpty[i] = random(-height*0.4, boxy+height*0.4);
    }
  }

  void update() {
   
    show();
  }

  void show() {
   
    for (int i = 0; i<num_cloud; i++) {
   
      noStroke();
      fill(255);
      ellipse(bgptx[i]+anchordist.x, bgpty[i]+anchordist.y, 130, 130);
      ellipse(bgptx[i]+anchordist.x+80, bgpty[i]+anchordist.y+10, 100, 100);
      ellipse(bgptx[i]+anchordist.x+130, bgpty[i]+anchordist.y+30, 55, 55);
      ellipse(bgptx[i]+anchordist.x-80, bgpty[i]+anchordist.y+10, 95, 95);
    }
  }
}

在这里我们可以看到，cloud在执行构造函数时，每次都会通过random（）函数随机地获得一个坐标位置，然后在show()函数中，在这个随机位置上，绘制云彩的图案。

然后我们在背景类中实体化云彩类，最后在主页sketch中调用实体化的背景类——层层调用。

// 背景类的构造函数
background() {
   
    bds = new bullet_die_particle ();
    cl = new cloud(20);// 每次生成20朵云
  }
// sketch主页上的调用
public background bg;
bg = new background();
void draw() {
   
    bg.show();
  }

3.2.飞行尾气的实现

要实现每次按动方向键就能出现飞行尾气，我们首先需要能产生“一条”尾气。
所以我们这里建立两个类，一个onefire，一个powerFire，虽然二者至今没有直接的继承关系，但是由于他们关系密切，我们将他们放在一个标签页中。
这里我们可以想到，对于“一条”尾气来说，他应该有三个参数，位置，速度，以及判断是否处在“加速”状态（方向键按下）。
接下来我们看一下onefire类的构造函数。

onefire(PVector loc0, PVector vel0, boolean powerup)